كود التبادل الاعلانى بطريقة جميلة ومميزة

بسم الله الرحمن الرحيم

إضافة كود إعلانات بطريقة مميزة ( CSS و HTML ) للتبادل الاعلاني

في هذه الإضافة تظهر بنرات الإعلانات بألوان باهته, و عند المرور فوقها بالماوس تأخد ألوانها الطبيعية مع ظهور تسمية البنر بطريقة مميزة .

اضافة كود إعلانات بطريقة مميزة ( CSS و HTML ) للتبادل الاعلاني

مثال

طريقة التركيب :

ادخل مدونتك .
ثم التخطيط .
ثم اختر اداة جديده HTML/JavaScript .
اخيرا انسخ الكود مع استبدال الروابط والصور بما يلزم .

كود:

<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="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdmAiA5iS7F4KzCTvupbebG1XFNWI5cxntDbf8v_5tJQ3n9wIconNUQH6DcU3h1mEevyvNOo6lOyh22PmHaEroZx5BPjxE2cW39FhhLY2VhaKX99KScNOU3UsfNO36bXjK48KnTCS6mzQ/s1600/%D8%A8%D8%AF%D9%88%D9%86-%D8%B9%D9%86%D9%88%D8%A7%D9%86-1.gif" />
<strong>مدونة حلول بلوجر</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
<div class="adss" id="adsanime">
<a href="http://7loll.blogspot.com/2013/01/blog-post_26.html">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzaDPGNMRbfzEi5qaX-au1zGSJ3JzM7_mKT7NA82O78RQQAwefvJTKFX_QfS7b6momCOX9ObtUiqfNRBrBzWxStotcex_Fc0bgvUc_cQeAnUCaSMN_XhAl7BnWQTB8ffvy0MDJ-yJW79X2/s1600/adschange_125-125.jpg" />
<strong>أعلن هنا</strong></a>
</div>
</center>
<a href="http://www.7loll.blogger.com/"></a>
للإعلان هنا يرجى الإتصال بنا <br />

الى اللقااااااااااااء

بقلم: محمود علام

نبذه قصيرة عن الكاتب
يمكنك متابعتي على: فيس بوك | تويتر | جوجل بلس | يوتيوب | الموقع.

كود التبادل الاعلانى بطريقة جميلة ومميزة

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

إرسال تعليق