اضافة صفحة خطاء 404 بطريقة شيك واحترافية بسهولة للمدونة

طبعا عشان تربط اعضاء مدونتك بنفس الموقع لو دخلو لصفحة خطاء فائدة الصفحة تعمل على اعادة التوجيه بشكلة جذاب واحترافى بدل ما الزائر يطفش منك

Error 404
مثال
 

بلوجر وفي تحديثاتها الأخيرة قامت بإضافة صفحة الخطأ من الإعدادات تسمح لك فقط بإضافة رابط مدونتك لكن صفحة الخطأ ليست جذابة بالمعنى

 لظهور صفحة الخطأ عندما لا تتواجد صفحة أو حذفتها فالزائر يعلم بالرسالة أنه يوجد خطأ ،

 طبعا عندما تحدثت عن صفحة 404 الذي تتيحها لنا بلوجر فقط كتابة ، 

وهنا يأتي دور مدونة شوف واعرف في إضافة صفحة الخطأ 404 بشكل إحترافي وجذاب نعم الأن 

ستحصلون على صفحة الخطأ بأسهل طريقة سأشرحها بدون أن تتعب في شيئ كل شيئ جاهز

ما فائدة صفحة الخطأ؟! :

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

شرح طريقة التركيب

1. مباشرة من القالب ابحث باستعمال Ctrl+F عن </body> ثم ضع الكود التالي فوقه

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style>
/* http://shofwa3rf.blogspot.com.eg */
#error-not-found {
    background: #ff0000;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMECtGRK3dQsyOqY6wZTNH5aOoS3-9AQSU-vb75T_jxoKdeflRNEt5vA5FLv6x-47E5Z9Q7WweYomCcfAXYua1Zq-qsHnmk7V1PR8CiBWbTAq-AzLN0R9HsvaKz0FvBDaZ7mCqdTcQ56o/s1600/bg_body.gif)no-repeat top center,-moz-radial-gradient(center 40%, circle cover, #ff0000 0%, #880000 100%);
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMECtGRK3dQsyOqY6wZTNH5aOoS3-9AQSU-vb75T_jxoKdeflRNEt5vA5FLv6x-47E5Z9Q7WweYomCcfAXYua1Zq-qsHnmk7V1PR8CiBWbTAq-AzLN0R9HsvaKz0FvBDaZ7mCqdTcQ56o/s1600/bg_body.gif)no-repeat top center,-webkit-gradient(radial, center 40%, 0,  center 40%, 800, from(#ff0000), to(#880000) );
        text-align:center;
        position:fixed;
        top:0px;
        right:0px;
        bottom:0px;
        left:0px;
        padding-top:270px;
        z-index:999999;
}
#error-not-found  h1 {
        font-size:640px!important;
        position:absolute;
        font-family:&#39;sultan_-_3_line_2sultan3line&#39;!important;
        top:70px;
        left:50%;
        letter-spacing: -8px;
        margin-left:-502px!important;
        width:960px;
        z-index:-2;
        color:rgba(0,0,0,.09)!important;
}
#error-not-found  h2 {
        font-family:&#39;sultan_-_3_line_2sultan3line&#39;!important;
        text-transform:uppercase;
        font-size:81px;
        line-height:100px!important;
        letter-spacing: -3px;
        color:#fff!important;
        margin:0!important;
        padding:0!important;
}
#error-not-found p a,
#error-not-found p a:visited,
#error-not-found p a:hover{
        font-family:&#39;sultan_-_3_line_2sultan3line&#39;!important;
        text-transform:uppercase;
        font-size:56px;
        line-height:80px!important;
        border:none;
        font-weight: bold;
        color:rgba(0,0,0,.5)!important;
        margin:0!important;
        padding:0!important;
        text-decoration:none!important;
}
</style>
<div id='error-not-found'>
 <h1>404</h1> <h2>أووبس..الصفحة غير موجودة</h2>
 <h2>كيف وصلت إلى هنا !</h2>
 <p> <a href='/' title='الرئيسية'> الرجوع للصفحة الرئيسية</a></p>
</div>
</b:if>

2. قم بحفظ العمل ومبروك عليك أهم إضافة يمكنك تجربتها من خلال إضافة /404 في أخر الرابط وليس بالضرورة أن تكون 404 أي شيئ .. * هناك تحديدات باللون الأخضر في الكود كروابط الصور والكلمات غيرهم بما تشاء

ارجو ان يدوم زيارتكم لنا وعجبكم الشرح