اضافة اداة موضوع مميز لمدونات بلوجر

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

اليوم نقدم لكم اضافة رائعة جدا تستخدم لتمييز موضوع أو تدوينة معينة  
بشكل جميل في واجهة المدونة في السايدبار 

تركيب الاضافة

• من لوحة التحكم اذهب التخطيط ثم إصافة اداة HTML/JavaScript

• ألصق هذا الكود : 

<div class="Tech-ly_today_img">

<img alt="تكنوليبي" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYvjp84aGoKwuu9ucwo74UJQCBcDOOyVdMIxArmSaN5eVDjTJcA7ElPVxl6RPrQgC-7eICsjC15QuwZp-zJqthQXFrfnTVfb6Ehb1YCdS2Nwr97a3WAgPcpYYaTElyZNLBIJOnT8fEx6uS/s1600/68c136fc-0833-44d7-9d74-dbb9042e3cb8-620x372.png" />

<a href="http://tech-ly.blogspot.com/2014/10/10-windows.html"><i class="fa  fa-arrows-alt"></i></a>

<p>تحميل ويندوز 10 Windows النسخة الأصلية مجانا</p>

</div>

<style>

.Tech-ly_today_img{position:relative;padding-top:5px}.Tech-ly_today_img img{width:100%;height:200px}.Tech-ly_today_img a{display:block;width:48px;height:48px;background:rgba(255,255,255,0.8);color:#e23a3e;font-size:20px;text-align:center;line-height:2.6;opacity:0;-webkit-transition:all .3s ease 0;-moz-transition:all .3s ease 0;-ms-transition:all .3s ease 0;-o-transition:all .3s ease 0;transition:all .3s ease 0;-webkit-transform:scale(0.2);-moz-transform:scale(0.2);-ms-transform:scale(0.2);-o-transform:scale(0.2);transform:scale(0.2);position:absolute;top:76px;left:126px;z-index:1001;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}.Tech-ly_today_img p{position:absolute;bottom:0;left:0;background: rgba(77, 135, 209, 0.6);

text-align: center;padding:12px 29px;margin:0;font-size:15.1px;color:#FFF;}.Tech-ly_today_img:hover a{opacity:1;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.Tech-ly_today_img:hover a:hover{color:#333}.Tech-ly_posts{float:right;width:730px;background:#FFF;margin:24px 0;-webkit-box-shadow:0 0 5px #DDD;-moz-box-shadow:0 0 5px #DDD;box-shadow:0 0 5px #DDD}.Tech-ly_post{position:relative;padding:24px;border-bottom:1px solid #EEE}.Tech-ly_post_title h1{padding:0;margin:0;font-size:24px;font-weight:400}

</style>

• غير ما باللون الاحمر بـ "اسم التدوينة"

• عير ما باللون الاخضر بـ"رابط التدوينة"

• غير ما اللون الاصفر بـ"رابط صورة التدوينة"

:: كلمة شكر تدعمنا في إعطاء المزيد ::

من فضلك اضغظ لايك لمشاهدة لينك التحميل

لا تبخل باعجــاب أو مشاركــة للمقــال

→ اعجــــاب

Tweet

→ مشــاركــة