إضافة صفحة خطأ 404 إحترافية

إعلان أدسنس

آخر المواضيع

breaking/قوالب بلوجر/9
مقالات

الجمعة، 14 يوليو، 2017

يوليو 14, 2017

تكبير النص تصغير النص أعادة للحجم الطبيعي


السلام عليكم .... �� , اليوم سوف نقدم لكم درس جديد حول كيفية اضافة صفحة الخطأ 404 بشكل احترافي , اليوم جلبت لكم صفحة خطأ احترافية بشكلها الاحترافي ✨ والوانها المريحة هذه الصفحة احترافية لمدونتك سوف تغير شكل مدونتك الى الافضل باذن الله , كما أنها متجاوبة, على الرغم من أنّ رسالة الخطأ 404 قد تسبب إرباكًا للمستخدمين والتي تدّل على أنّ الموقع لم يستطع إيجاد الصفحة المطلوبة 👾




ماذا يميز صفحة الخطأ وما فائدتها؟
تدور اهمية صفحة الخطأ حول كسب المزيد من الزوار من عناكب البحث أيضا، بدون خروجهم 👣 من الموقع في حالة اتباعهم للرابط خاطئ ⚠ 



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

1 . توجه لقالب >> تحرير 
2.  ابحث عن <head>  ضع الكود التالي أسفلهاذا كان موجود لا تضيفه }

الكود

<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
    <title><data:blog.pageName/><data:blog.title/></title>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
    <title>الصفحة غير موجودة ~ <data:blog.title/></title>
    </b:if>

3. ابحث عن<body> ضع الكود التالي أسفله

الكود

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='oopss'>
<div id='error-text'>
<span>4<i class='fa fa-frown-o'/>4</span>
<p> هل أنت(ي) تائه(ة)!</p>
<div class='er-Pro7web'>نعتذر إن لم تجد(ي) الصفحة</div>
<p><a class='back' href='/'><i class='fa fa-toggle-on'/>  العودة للرئيسية</a></p>
</div>
</div>
  </b:if>

4. ابحث عن </head> ضع الكود التالي فوقه

الكود

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
.sidebar,.ct-wrapper, .header-wrapper, #header, #post-wrapper, #outer-wrapper, #footer-wrapper, #credit,.topwrapper,::-webkit-scrollbar,.banner,.topwrapper{display:none!important;margin:0;padding:0;overflow:hidden;}

/* CSS Error Page */
#oopss {background:#222;text-align:center;margin-bottom:50px;font-weight:400;font-size:30px;font-family:&#39;Roboto Condensed&#39;,sans-serif;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;}
#error-text {top:30%;position:relative;font-size:30px;color:#aaa;}
#error-text a{color:#aaa;}
#error-text p {margin:0!important;  font-family: droid arabic kufi;}
#error-text span {color:#aaa;font-size:120px;font-weight:700;letter-spacing:0.1em;}
#error-text a.back {  display: inline-block;margin: 10px auto;background: #F23D3D;color: #fff;padding: 6px 10px 3px;font-size: 10px;font-weight: 700;line-height: normal;border-radius: 3px;transform: scale(1);transition: all 0.5s ease-out;}
#error-text a.back:hover {background:#181818;color:#fff;}
#error-text a.back:active {-webkit-transform:scale(0.95);-moz-transform:scale(0.95);transform:scale(0.95);background:#F23D3D;color:#fff;}
.fa-frown-o:before {content: &quot;\f119&quot;;color: #F23D3D;}
.er-Pro7web {font-size: 18px!important;font-family: droid arabic kufi;}

/* CSS Error Page Responsive */
@media only screen and (max-width:640px){
#error-text {color:#aaa;font-size:20px;}
#error-text span {font-size:60px;}
#error-text a.back {padding:5px 10px;font-size:12px;}
#error-text a.back:hover,#error-text a.back:active {border:0;}}
</style>
</b:if>

التغييرات الأساسية
* الملون بالأزرق هو لون الخلفية 


* الملون بالبرتقالي هو لون الأيقونة : 4  4 وزر الرئيسية
  1. يا أخي ممكن كيف تمكنت من الحصول على قبول ادسنس لمدونتك (الشروط مثلا عدد المواضيع...)

    ردحذف
    الردود
    1. أولا المرجو إنضمام للمتابعي المدونة فضلا وليس أمر
      ثانيا أنشئت حساب أدسنس مند ان فتح حساب في غوغل
      وعندما أردت عمل إعلانات كانت مدوتي بها 98 موضوع و ترتيبها 3 مليون هدا فقط

      حذف

مقالات