[حسين]

بسم الله الرحمن الرحيم
في تدوينة جديدة سأشرح لكم كيفية تغيير شكل رسائل أقدم ،رسائل أحدث، الصفحة الرئيسية التي تكون في أسفل الصفحة تحت التدوينات إلى شكل جميل وعدة ألوان بطريقة سهلة مع شرح حصري لمدونتنا.

الخطوات:
1. قم بالدخول إلى لوحة تحكم مدونتك.
2. اضغط على قالب.
3. ثم تحرير HTML.
4. ابحث عن الكود التالي:

]]></b:skin>


ثم ضع فوقه مباشرة الكود التالي:



.home-link {float: center;
background: #a9014b url( ) repeat-x 0 0; display: inline-block; font-size: 16px; padding: 8px 19px 9px; color: #fff !important; font-weight: bold; line-height: 1; text-decoration: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25); text-shadow: 0 -1px 1px rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25); position: relative; cursor: pointer; overflow: visible; width: auto;
}
.home-link::-moz-focus-inner { border: 0; padding: 0; }
.home-link:hover { background-color: #630030; color: #fff; text-decoration:none; }
.home-link:active { -webkit-transform: translateY(1px); -moz-transform: translateY(1px); }
.blog-pager-newer-link {float: right;
background: #ff5c00 url( ) repeat-x 0 0; display: inline-block; font-size: 16px; padding: 8px 19px 9px; color: #fff !important; font-weight: bold; line-height: 1; text-decoration: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25); text-shadow: 0 -1px 1px rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25); position: relative; cursor: pointer; overflow: visible; width: auto;
}
.blog-pager-newer-link::-moz-focus-inner { border: 0; padding: 0; }
.blog-pager-newer-link:hover { background-color: #d45500; color: #fff; text-decoration:none; }
.blog-pager-newer-link:active { -webkit-transform: translateY(1px); -moz-transform: translateY(1px); }
.blog-pager-older-link {float: left;
background: #ffb515 url( ) repeat-x 0 0; display: inline-block; font-size: 16px; padding: 8px 19px 9px; color: #fff !important; font-weight: bold; line-height: 1; text-decoration: none; -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25); text-shadow: 0 -1px 1px rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25); position: relative; cursor: pointer; overflow: visible; width: auto;
}
.blog-pager-older-link::-moz-focus-inner { border: 0; padding: 0; }
.blog-pager-older-link:hover { background-color: #fc9200; color: #fff; text-decoration:none; }
.blog-pager-older-link:active { -webkit-transform: translateY(1px); -moz-transform: translateY(1px); }

انتهى الشرح:)

ملاحظة :هذه الأشكال مأخوذة من مدونة هوم البلوجر

المصدر: http://designer4arab.blogspot.co.il/...g-post_29.html