اضافة كود التبادل الاعلاني بتقنية الCSS


السلام عليكم ورحمة الله تعالى وبركاته زوار واعضاء المدونة ها نحن نأتيكم باضافة اخرى الا وهي كود التبادل الاعلاني بتقنية CSS والكثير من طلب هذا الكود لانها بصراحة اكثر من رااائع وانا الان اقدم لكم هذا الكود بين ايديكم.. ما فائدة هذا الكود؟ انا سأخبركم فائدة هذا الكود بانهوا يعطي لمسة جمالية للمدونة كما انه يوفر مساحة اعلانية للكثير من المدونة ويوفر مساحة للمدونة.. الان اقدم لكم الكود .. طريقة التركيب سهلة جداً, اذهب الى لوحة التحكم الخاصة بمدونتك وبعدها اذهب الى تخطيط, وبعدها اضافة اداة, HTML/Javascirpt وضع هذا الكود


<style> #advertise{ margin: auto; } .adss { list-style:none; margin-top:5px auto; margin: 0 1px 2px 1px; display:inline-block; text-align: center; } .adss a { display:block; width:75px; height:75px; padding-right:0px; padding-top: 3px; position:relative; text-decoration:none; } .adss a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);} .adss img { max-height: 75px; max-width: 75px; } #adsanime:hover { opacity:0.2; } #adsanime a strong { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms; -moz-transition-property: opacity; -moz-transition-duration: 500ms; } #adsanime a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; } #adsanime { opacity:0.5; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; } #adsanime:hover { opacity:1; } #adsanime:hover a strong { opacity:1; top:-10px; } </style> <center> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src=" رابط الصورة " /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src=" رابط الصورة " /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة" /> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> <div class="adss" id='adsanime'> <a href="رابط المدونة"> <img src="رابط الصورة" /> <strong>اسم المدونة</strong></a> </div> </center>


مع تغيير 
ما باللون الاحمر برابط المدونة
واللون الاخضر برابط الصورة (البانر 125×125)
واللون الازرق بإسم المدونة

والان اظغط على حفظ ومبرووكـ .. عليك الاضافة ..
*الرجاء من الجميع عند النقل ذكر المصدر .. بالتوفيق للجميع !!

هناك 8 تعليقات :

  1. إضافة جميلة الله يكثر من خيرك
    العاب
    clavier arabe

    ردحذف
  2. كود جميل لكن عندما اضغط على اى صوره من صور التبادل الاعلانى لا تفتح فى صفحة جديده كما فى مدونتك هل يمكنك مساعدتى بهذه المشكلة

    ردحذف
    الردود
    1. اخوي تأكد من اضافة هذا الكود قبل رابط المدونة http://

      حذف
  3. موجود ال http:// لكن لا تفتح فى صفحة جديده هذه مدونتى
    http://eng-planet.blogspot.com/

    ردحذف
    الردود
    1. اخوي الكود شغال في مدونتك ويفتح الروابط! مثل ما يفتح عندي!

      حذف
  4. أزال المؤلف هذا التعليق.

    ردحذف

جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).