إضافة صفحة الخطأ لقوالب بلوجر

إضافة صفحة الخطأ لقوالب بلوجر

يوجد الآن مشاهدة التعليقات : 14

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات

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

ما فائدة صفحة الخطأ : تدور اهمية صفحة الخطأ حول كسب المزيد من الزوارمن عناكب البحث أيضا , بدون خروجهم من الموقع في حالة اتباعهم للرابط خاطئ.

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

شرح طريقة التركيب
1. مباشرة من القالب ابحث باستعمال Ctrl+F عن </body> ثم ضع الكود التالي فوقه
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style>
/* www.ar1web.com */
#error-not-found {
    background: #ff0000;
    background: url(http://4.bp.blogspot.com/--Ri7FNhfPuU/T3p0_rWUvLI/AAAAAAAAHzU/v_V5cF2O9YM/s1600/bg_body.gif)no-repeat top center,-moz-radial-gradient(center 40%, circle cover, #ff0000 0%, #880000 100%);
    background: url(http://4.bp.blogspot.com/--Ri7FNhfPuU/T3p0_rWUvLI/AAAAAAAAHzU/v_V5cF2O9YM/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 أي شيئ ..
* هناك تحديدات باللون الأخضر في الكود كروابط الصور والكلمات غيرهم بما تشاء
ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 14 تعليقًا:

  1. رائع أخ حسام شكرا على الإضافة واصل

    ردحذف
  2. جميل لكن أنا لدي صفحة خطآ شاهدها www.Ebda2.net/404 لكنها غير جيدة !! :(

    كيف يمكنني استبدالها بأحد الأمثلة في الأعلى :) ؟

    ردحذف
    الردود
    1. جرب أولا بوضع الكود إذا ظهرت لك الصفحة جديدة
      يمكنك ترك الكود القديم أو حذفه لكن يختلف حسب الأكواد يبدء عندك هكذا : .error_page .error-title

      div class="error-title">

      حذف
  3. غير معرف9/05/2014

    ملحوظة أخى : أنت وضعت كود القائمة الثانية فقط
    عدل على الموضوع لأفادة الجميع

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

      حذف
  4. شكرا لك صديقي حسام والله حتى احببت مدنتك لئنها وبصراحة مدونة الوحيدة الموثوق بها وانا اعرف لماذا اقول موثوق بها وشكر

    ردحذف
  5. شكرا لك اخي الكريم ولكن اتمنى ان تنشر كيفية وضع المثال الاول لانه احلى بكثير من الثاني

    ردحذف
  6. شكرا على الاضافه الجميله دى

    http://mostafaelgamal.blogspot.com/

    ردحذف
  7. غير معرف11/08/2015

    بجد الله يباركلك على هذه الاضافه الاكثر من رائعه والحديثه حقيقا

    ردحذف
  8. غير معرف1/22/2016

    شكرا

    ردحذف
  9. والله استفدت كتير من هذا الموضوع وجربتها وشغاله 100% فى 100 وهذا موقعى للمعاينه

    keyseating

    ردحذف
  10. رائع أخ حسام شكرا على الإضافة واصل

    ردحذف

عن الكاتب :

إرشادات

    تحميل الملفات

    نستخدم بمدونتنا مواقع مختلفة في رفع الملفات ونوفر منها إثنان:
  • موقع : Mediafire
  • موقع :file-upload
  • باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
  • تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
  • كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
  • إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.
  • أين تجدنا؟

    بعيدا عن الصفحات المزورة أو المزيفة التي يحاول البعض من خلالها استغلال جهود فريق عمل عرب ويب، هذه هي حساباتنا وصفحاتنا الرسمية في الشبكات الاجتماعية، لا نمتلك سوى هذه الصفحات والحسابات وهي الوحيدة التي تتبع للمدونة : https://www.instagram.com/ar1web

    كلمة الختام

    في مدونة عرب ويب نسعى دوما جاهدين للتحسن والتقدم وليس ما تراه هو حدودنا! ونحن نقدر كثيرا زوارنا وآراؤهم فإن كان لديك أي اقتراح/نصيحة/ومضة مفيدة/نقد بناء أو ما إلى ذلك يمكنك مشاركتنا كل ما في جعبتك من خلال الإتصال بنا : istoretech3@gmail.com
أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم