إضافة التبادل الإعلاني النصي بتقنية CSS
بسم الله الرحمن الرحيم
إضافة التبادل الإعلاني النصي بتقنية CSS
الموضوع
السلام عليكم ورحمة الله وبركاته
مرحباً بكم زوار ومتابعين مدونة يوسف للمعلوميات
اليوم سوف نشرح موضوع جديد جميل وهو كيفية إضافة التبادل الإعلاني النصي بتقنية CSS الرائعة بحيث يمكنك لك أن تعمل تبادل إعلاني نصي وتبهر متابعيك بهذه الإضافة الجميلة جداً الذي قام بتطويرها مدونة يوسف للمعلوميات
الشرح
الخطوة الأولى : الذهاب الى لوحة التحكم الخاصة ببلوجر ومن ثم الى التخطيط بعد ذلك أضافة اداة HTML/JavaScriptوأضف الكود التالي
<div class='widget-content'><div style=" padding: 10px;background-color:Transparent;border-radius:10px;box-shadow:0px 5px 5px 0px rgba(0, 0, 0, 0.5),0px 5px 5px 0px rgba(200, 200, 200, 0.5) inset;">
<style type="text/css">
#navlist {
margin: 0px auto 0px auto;
padding: 0px;
list-style-type: none;
float: center;
display: block;
}
#navlist a {
font-family: "DroidKufi-Bold";
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color:#ffa221; border: 1px solid #F8FAF3;
font-size: 18px;
text-decoration: none;
color: #fff;
display: block;
text-align: center;
line-height: 30px;
padding-right: 0px;
margin-right: 0px;
}
#navlist a:hover {
font-family: "DroidKufi-Bold";
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color:#2a3239; border:1px solid #ff000;
font-size: 18px;
text-decoration: none;
color: #FFFFFF; display: block;
text-align: center;
line-height: 30px;
padding-right: 0px;
margin-right: 0px;
border-right-color: #ffa221;
border-right-style: solid;
border-right-width: 3px;
}
</style>
<ul id="navlist">
<table width="100 %" align="center">
<tr>
<table width="100%" align="center"><a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
</table></tr></table>
<table width="100%" align="center">
<tr>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td></tr>
<table width="100%" align="center">
<tr>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td></tr>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
</table>
<table width="100%" align="center">
<tr>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td></tr>
<table width="100%" align="center">
<tr>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td>
<td width="25%" align="center">
<a dir="rtl" href="http://www.infoyusif.com/p/blog-page_51.html" rel="nofollow" target="_blank">أعلن هنا الأن</a>
</td></tr>
</table></table></table></ul></div></div>
وبعد إضافة الكود نضغط على حفظ ونتمتع بالإضافة الجميلة
النهاية
