إنشاء صفحة خطأ أحترافية


نـعود لكم باضافة بلوجر جديدة ألا وهي إنشاء صفحة الخطأ 404 بشكل أحترافي ومميز بكل سهولة , فهذه الاضافة مهمة لأي موقع , اقدمها لكم اليوم بشكل خفيف ومميز مزودة بتاثيرات css3 جميلة, الصفحة مصممة باكواد بسيطة وهي الــ css3 لذا هي أكثر خفة وحتى لا أكثر الوقت في المميزات فمن الأفضل ان أترككم تشاهدون المعاينة ومن ثم ندخل للشرح 
شرح طريقة التركيب
1. توجه للقالب >> تحرير
2. أبحث باستعمال ctrl+f عن<head> ثم أضف أسفله بسطور الكود التالي
<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='page-qaisi1web404'>
  <img id='logo-qaisi1web404' src='http://2.bp.blogspot.com/-xQzwgCEMB6w/VmSCZMGHw4I/AAAAAAAABwI/TnOrfI2EHzM/s1600/notfound-qaisi1web.jpeg'/>
  <h1>لم تجد الصفحة!... تقبل اعتذاري&#1567;&#1567;&#1567;</h1>
  <h2>للعودة الى الصفحة الرئيسية , <a href='/' target='_blank'>يرجى الضغط هنا</a></h2>
</div>
<style>
/* CSS error page qaisi1web*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
a:link {
  text-decoration: none;
  outline: none;
  transition: all 0.25s;
}

a:visited,
a:link:hover,
a:visited:hover {
  text-decoration: underline;
}

body {
  background: #fff none repeat scroll top left;
  color: #333;
  font-family: &#39;Open Sans&#39;, sans-serif;
  margin: 0;
  padding: 0;
  position: relative;
  line-height: normal;
}

#page-qaisi1web404 {
  margin: 50px auto;
  max-width: 700px;
  text-align: center;
}

h1 {
  font-size: 200%;
  font-weight: 700;
  margin-top: 30px;
}

h2 {
  font-size: 120%;
  font-weight: 400;
  margin-top: 30px;
  margin-bottom: 50px;
  line-height: 1.5em;
}

@-webkit-keyframes thumb {
  0% {
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
  }
}

#page-qaisi1web404 img {
  -webkit-animation-name: thumb;
  -webkit-animation-duration: 200ms;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
}
</style>
  </b:if>
اتمنى ان تكون الاضافة نالت أعجابكم ... بالتوفيق

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

روابط الموضوع للنسخ

رابط
HTML
BBCode
يسمح بنقل الموضوع لكن مع ذكر المصدر في نهاية الموضوع المنقول ووضع رابط الموضوع الأصلي
كيف تعلق ؟

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *