126- إضافة أداة التبادل الإعلاني في السايد بار

السلام عليكم ورحمة الله وبركاته

أحبابي في الله اليوم سوف أشرح لكم

إضافة أداة التبادل الإعلاني في السايد بار

هذه الأداة عصرية وذات شكل رائع جدا ويتغير شكل المربع الإعلاني عند تمرير الماوس عليها ويفضل ان يكون حجم البنر للمعلن 125*125

الفضل كله للأستاذ جلال البعداني

طريقة التركيب: سهلة جدا وبسيطة تابع الخطوات معي بالضبط

خذ نسخة من القالب إحتياطية

- Layout >> Add Gadget - أ- تتوجه إلى لوحة تحكم القالب إلى "تخطيط" 

 - HTML & javascript - ب- تتوجه إلى تبويب

جـ- تكتب في المربع الكود التالي

<!-- اضافة اداة التبادل الإعلاني الى مدونة بلوجر  -->
    <style>
    .FoulsCode-Ads ul{
    list-style-type:none;
    margin: 0px auto;
    padding: 10px 0px 10px 0px;
    width:270px;
    overflow:hidden;
    }
    .FoulsCode-Ads ul li{
    list-style-type:none;
    margin: 0px 5px 10px 5px;
    float:left;
    display:inline;
    background:orange;
    -webkit-transition:all 0.2s ease;
    -moz-transition:all 0.2s ease;
    -o-transition:all 0.2s ease;
    border-radius:100%;
    -webkit-border-radius:100%;
    -moz-border-radius:100%;
    -o-border-radius:100%;
    }
    .FoulsCode-Ads ul li:hover {
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    -o-transition:all 0.3s ease;
    -o-border-radius:15%;
    -webkit-border-radius:15%;
    -moz-border-radius:15%;
    border-radius:15%;
    }
    .FoulsCode-Ads ul li:active {
    -webkit-transition:all 0.2s ease;
    -moz-transition:all 0.2s ease;
    -o-transition:all 0.2s ease;
    -o-border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    }
    .FoulsCode-Ads ul li a img{
    -webkit-box-shadow:0 0 8px rgba(0,0,0,0.5);
    -moz-box-shadow:0 0 8px rgba(0,0,0,0.5);
    box-shadow:0 0 8px rgba(0,0,0,0.5);
    padding:3px;
    }
    </style>
    <div class="FoulsCode-Ads">
    <ul>
    <li style="background:#e42b2b !important;">
    <a href="رابط المعلن الاول" rel="nofollow">
    <img height="120" src="رابط البنر للمعلن الاول%20title=" width="118" />
    </a></li>
    <li style="background:#FFE500 !important;">
    <a href="رابط المعلن الثاني" rel="nofollow">
    <img height="120" src="hرابط البنر للمعلن الثاني%20title=" width="118" />
    </a></li>
    <li style="background:#a800ff !important;">
    <a href="رابط المعلن الثالث" rel="nofollow">
    <img height="120" src="رابط البنر للمعلن الثالث%20title=" width="118" />
    </a></li>
    <li style="background:#41d05f !important;">
    <a href=" رابط المعلن الرابع " rel="nofollow">
    <img height="125" src="رابط البنر للمعلن الرابع%20title=" width="118" />
    </a></li>
    </ul>
    </div>
<!-- اضافة اداة التبادل الإعلاني الى مدونة بلوجر  -->

ثم قم بتغيير رابط المعلن الأول

ثم قم بتغيير رابط البانر للمعلن الأول وهكذا في الأربع معلنين

ثم قم بحفط الأداة ثم قم بعرض مدونتك ولاحظ الفرق في السايد بار ستجد مربع التبادل الإعلاني قد ظهر

إذا واجهتك مشاكل في التركيب لا تردد في التعليق

مصدر الأكواد

albaadani.com

كيفية المساعدة التي حصلت عليها؟

فظيع

سيئة

حسنا

جيد

عظيم

بقلم : جيك حماده

أنا حماده محمد علي صلاح محب للمعلوميات ومصمم مونتاج وفوتوغرافيا و السلام عليكم ورحمة الله تعالى وبركاته

مواضيع ذات صلة

126- إضافة أداة التبادل الإعلاني في السايد بار

السلام عليكم ورحمة الله وبركاته أحبابي في الله اليوم سوف أشرح لكم إضافة أداة التبادل الإعلاني في السايد بار هذه الأداة عصرية و...

0