Top Ad unit 728 × 90

مواضيع ساخنة

تقنية

بلوجر: طريقة اضافة أداة التبادل الإعلاني مع تأثيرات CSS عند تمرير مؤشر الماوس

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

1.أولا قم بنسخ الكود التالي:

<center><font color="#444444"></font>
<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:95px; height:95px; padding-right:0px; padding-top: 3px; position:relative; text-decoration:none; } .adss a strong { font-weight:normal; position:absolute; left:-5px; top:-1px; color:#fff; padding:2px; 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: 95px; max-width: 95px; } #adsanime:hover { opacity:0.5; } #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:-30px; } </style> <center> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'>

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'>

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'>

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'>

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> <div class="adss" id='adsanime'> 

<a href="http://astu-tech.blogspot.com/p/exchange-ad_2679.html"> <img src="http://3.bp.blogspot.com/-9clWM8XpzwA/U4dBeIiSOaI/AAAAAAAAB38/XFVZE1OfgDw/s1600/tabadol+i3lani+150x150.png" /> <strong>ضع اعلانك هنا مجّانا</strong></a> </div> 
</center></center>
  • أو قم بتحميله من هنا 
ملاحظة:
عليك بتغيير ما هو ملوّن:
بالأحمر: رابط صفحة التبادل الإعلاني الخاص بمدونتنا إلى رابط التبادل الإعلاني لمدونتك (قم بإنشاء صفحة سمها تبادل إعلاني تضع فيها شروطك ثم إنسخ رابطها هنا، هذه الصفحة تعتبر مكان يضع فيها الراغبون في التبادل الإعلاني معك رابط مدوناتهم و و البانر الخاص بهم، شاهد مثال من هنا ولكن عند عمل تبادل الإعلاني قم بوضع رابط المدونة التي تريد التبادل معها)
بالأخضر: رابط البانر (الصورة).
بالأزرق: إسم المدونة.

2.توجه إلى لوحة التحكم بلوجر ثم قم باختيار المدونة المستهدفة، كما في الصورة
إختار-مدونتك

3.إختر على اليسار تخطيط أو Layout
تخطيط

4.ثم إضافة أداة أو Add a Gadget
إضافة أداة

5.إختار HTML/ JavaScript
HTML/ JavaScript

6.قم بلصق الكود الذي نسخته من قبل في المكان المخصص له ويمكنك كتابة في العنوان: "مدونات صديقة" أو "تبادل إعلاني"
إلصق الكود

ملاحظات:
1.الأداة تأخد نفس عرض المكان الذي توضع فيه
2.يمكنك تغيير حجم البانر بتغيير قيم max-width ،max-height، width، height 
3.يمكنك إضافة أماكن إعلانية أخرى (مربعات) أو حذفها بإضافة أو حذف فقرات كما في الصورة

إضافة أو حذف مساحة إعلانية
مبروك عليكم الإضافة...
بلوجر: طريقة اضافة أداة التبادل الإعلاني مع تأثيرات CSS عند تمرير مؤشر الماوس Reviewed by Hocine Kaidi on 3:39:00 م Rating: 5

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

جميع الحقوق محفوظة مدونة استوتك © 2013 - 2016

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

يتم التشغيل بواسطة Blogger.