رساله الخطا لمدونات بلوجر حصريا

Beautiful Custom 404 Error Page For Blogger

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

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

 مع تصميم رائع.

Live DEMO

How To Add To Blogger

1. اذهب لمدونتك > اختر القالب > تحرير القالب >
2. اضف هذا الكود قبل  </body>    ولا تعدل اي شي.

<b:if cond="data:blog.pageType == &quot;error_page&quot;">
<style>
#error-not-found {
    background: #ff0000;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLe0TiwP3B4h6PVtuQeKgAMNlqzgPRu4ahhh0BS_m3H1UQujm17BXso6C5VnxBc42JdmHmZzKQo8IlhdZg5t-vJpkY0jFtfyDGXh_bSXRrRF4FQX0GUnQcifcXypCoc6KA12tDg1i8ECo/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/AVvXsEjLe0TiwP3B4h6PVtuQeKgAMNlqzgPRu4ahhh0BS_m3H1UQujm17BXso6C5VnxBc42JdmHmZzKQo8IlhdZg5t-vJpkY0jFtfyDGXh_bSXRrRF4FQX0GUnQcifcXypCoc6KA12tDg1i8ECo/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:impact,sans serif!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:arial black,sans serif!important;
        text-transform:uppercase;
        font-size:81px;
        line-height:66px!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:arial black,sans serif!important;
        text-transform:uppercase;
        font-size:56px;
        line-height:40px!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>Ops..sorry</h2>
 <h2>Page Not Found</h2>
 <p> <a title="home page" href="/"> Back To Home page</a></p>
</div>
</b:if>

3. ثم احفظه.
That's it.