أضف صفحة 404 إلى مدونتك بلوغر تظهر في كل رابط خاطئ + أشكال حصرية

السلام عليكــم ورحمـة الله تعالى وبركاتــه ، ومرحبا بكل الزوار معنا في هذا الدرس المهم الذي سوف نتناول من خلاله طريقة وضع صفحة 404 إلى مدونات بلوغر أي بمعنى أنه عند الإنتقال إلى رابط خاطئ في مدونتك تظهر الصفحة وما يوجد فيها بإمكانك إستخدام الأشتمل فيها الشرح سوف يكون على الواجهة الجديدة.

مشاهدة مباشرة

1-قم بتسجيل الدخول إلى المدونة التي تريد أن تضيف فيها الإضافة.

2-من لوحة التحكم الجديدة إختر إعدادات.

 

3- ومن ثم توجه إلى تفضيلات البحث.

4-في لم يتم العثور على الصفحة المخصصة أنقر على تحرير.

5- في المربع الذي سيضهر لك ضع الشكل الذي تريد :

إختر الشكل الذي أعجبك وضع كوده في المربع الكبير


1-

الكود

<h1><a href='/'>خطأ 404 !</a></h1>
<h2> نعتذر ! فإن الصفحة التي تبحث عنها غير موجودة أو تم حذفها يرجى التأكد من الرابط  أو <a href='/'>التوجه إلى الصفحة الرئيسية</a></h2>
<style type='text/css'>
.status-msg-wrap {
    font-size: 50%;
    margin: none;
    position: static;
    width: 150%;
}
.status-msg-border {
    display:none
}
.status-msg-body {
    padding: none;
    position: static;
    text-align: inherit;
    width: 100%;
    z-index: auto;
}
.status-msg-wrap a {
    padding: none;
    text-decoration: inherit;
}
* { margin, padding: 0; }
body {
 background: #474747 url(bg.png);
 margin: 70px;
}
h1 a {
 display: block; text-decoration: none;
 font: 150px Helvetica, Arial, Sans-Serif; letter-spacing: -5px;
 text-align: center;
 color: #999; text-shadow: 0px 3px 8px #2a2a2a;
 }
  h1 a:hover {
   color: #a0a0a0; text-shadow: 0px 5px 8px #2a2a2a;
  }

h2 {
 font: 70px Tahoma, Helvetica, Arial, Sans-Serif;
 text-align: center;

 color: #222; text-shadow: 0px 2px 3px #555;
}
#sidebar-wrapper, #blog-pager,#main-nav, #header, #footer, nav, .blog-feeds {
    display: none;
    }
</style>

2-

 الكود

<center>
<h1><a href='/'>خطأ 404 !</a></h1>
<img src="http://data.imagup.com/10/1147702687.png"" />
<style type='text/css'>
main-wrapper
#sidebar-wrapper, #blog-pager,#menupic,#sidebarleft-wrapper,#main-nav, #header, #footer, nav, .blog-feeds {
display: none;
}
</style>
<h1><a href='/'>الصفحة الرئيسية</a></h1>
</center>

3-
  للخلفية البيضاء

الكود

<center>
    <h1><a href='/'>خطأ 404 !</a></h1>
    <img src="http://data.imagup.com/10/1147706163.png"" />
    <style type='text/css'>
    main-wrapper
    #sidebar-wrapper, #blog-pager,#menupic,#sidebarleft-wrapper,#main-nav, #header, #footer, nav, .blog-feeds {
    display: none;
    }
    </style>
    <h1><a href='/'>الصفحة الرئيسية</a></h1>
    </center>

 للخلفية السوداء

 الكود

<center>
    <h1><a href='/'>خطأ 404 !</a></h1>
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjueS2n-xbAE7YJscqusCKZdAa7Vi9S5FY7WYxF45mUiM-FJl2jXHzctUpKuhlcWO0KNyM_qt2OCBq1nKLnPJUlUDl9Q6BGraDNWRCseIU4bpiDKOwQiIgRQvKYL5gYbRKG7h7zIkygCZ0/s1600/Untitled-3.png"" />
    <style type='text/css'>
    main-wrapper
    #sidebar-wrapper, #blog-pager,#menupic,#sidebarleft-wrapper,#main-nav, #header, #footer, nav, .blog-feeds {
    display: none;
    }
    </style>
    <h1><a href='/'>الصفحة الرئيسية</a></h1>
    </center>

إنتهى الدرس أرجو أن أكون قد وفقت فيه وفي درس أخر إن شاء الله 

وأي إستفسار ضعه في التعليقات فالتعليقات مهمة بالنسبة لي