- fahad
- 10:03 ص
- css
- لاتوجد تعليقات
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
أضافة اليوم خاصة بمن يريد وضع أعلانات نصية في مونة بلوجر
سواء لتبادل الاعلاني مع مدونات ومواقع أخرى أو حتى الأستفادة منها لإبراز مواضيع مفيدة لمدونتك بحيث
تكون في الصفحة الرئيسية وحتى في داخل صفحات مدونتك
الأضافة بصيغة CSS سهلة التعامل معها وخفيفه على صفحات المدونة بحيث لاتشكل بطئ في تحميل الموقع
صورة لشكل الأضافة
للعلم يمكنك
تغيير لون الروابط قبل مرور الموس
و
تغيير لون الروابط بعد مرور الموس
و
تغيير لون الخلفية قبل مرور الموس
تغيير لون الخلفية قبل مرور الموس
طريقة أضافتها لمدونة البلوجر
نتجه للوحة التحكم
التخطيط
ونختار أضافة اداة
بعد ذلك تهيئة HTML/JavaScript
ونضيف الكود التالي
<!-- إعلانات نصية --><ul id="navlist"><table width="100%" align="center"><tr><td width="25%" align="center"><a target="_blank" href="ضع هنا الرابط/" >ضع هنا النص الاول</a></td><td width="25%" align="center"><a target="_blank" href="الرابط الثاني/" >النص الثاني</a></td><td width="25%" align="center"><a target="_blank" href="الرابط الثالث/" >النص الثالث</a></td><td width="25%" align="center"><a target="_blank" href="الرابط الرابع" >النص الرابع</a></tr></table><table width="100%" align="center"><tr><td width="25%" align="center"><a target="_blank" href="الرابط الخامس/" > النص الخامس</a></td><td width="25%" align="center"><a target="_blank" href="الرابط السادس/" >النص السادس</a></td><td width="25%" align="center"><a target="_blank" href="الرابط السابع/" > النص السابع</a></td><td width="25%" align="center"><a target="_blank" href="الرابط الثامن/" >النص الثامن</a></tr></table></ul><!-- / إعلانات نصية -->
ونعمل حفظ للأداة
بعد مانعمل التعديلات عليها
بعد ذلك نتجه للوحة التحكم
نختار القالب
تخصيص
ثم نختار الخيار(متقدم)
ونختار أخر خيار وهو (أضافة css)
ونضع داخل الصندوق
هذا الكود css يوضع في تعاريف CSS
#navlist { margin: 0px auto 0px auto; padding: 0px; list-style-type: none; float: center; display: block;}#navlist a { background-color:#FCFCFC; border: 1px solid #EDEDED; font-family: TAhoma; font-size: 9pt; text-decoration: none; color: #CCCCFF; display: block; text-align: center; line-height: 30px; padding-right: 0px; margin-right: 0px;}#navlist a:hover { background-color:#F5F5F5; border: 1px solid #E0E0E0; font-family: TAhoma; font-size: 9pt; text-decoration: none; color: #FF99FF; display: block; text-align: center; line-height: 30px; padding-right: 0px; margin-right: 0px;}
ولتغير لون الروابط قبل مرور الموس=color: #CCCCFF;
لتغير لون الروابط بعد مرور الموس=color: #FF99FF;
لتغير لون الخلفية قبل مرور الموس=background-color:#FCFCFC;
لتغير لون الخلفية قبل مرور الموس=background-color:#F5F5F5;
ونعمل حفظ في أعلى الصفحة يسار(تطبيق على هذه المدونة)
وسلام عليكم ورحمة الله وبركاته
ليست هناك تعليقات :
إرسال تعليق