السلام عليكم و رحمة الله و بركاته اليوم نقدم لكم اضافة رائعة جدا تستخدم لتمييز موضوع أو تدوينة معينة بشكل جميل في واجهة المدونة ف...
السلام عليكم و رحمة الله و بركاته
اليوم نقدم لكم اضافة رائعة جدا تستخدم لتمييز موضوع أو تدوينة معينة
بشكل جميل في واجهة المدونة في السايدبار
تركيب الاضافة
• من لوحة التحكم اذهب التخطيط ثم إصافة اداة HTML/JavaScript
• ألصق هذا الكود :
<div class="Tech-ly_today_img"><img alt="تكنوليبي" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm2pEAaAlquVkP6_92pvPplTTYrav8j62B6TEbZiAFw3qAwKbddVULAytMGdN5FuAQfBpOJ3XVbUIVK97hJgLT1QTPoTQz80QzNZmTNdxE1n8KzOXwzbRYYsJgFkOFwaG19p-8-6D0xLi4/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>
• غير ما باللون الاحمر بـ "اسم التدوينة"
• عير ما باللون الاخضر بـ"رابط التدوينة"
• غير ما اللون الاصفر بـ"رابط صورة التدوينة"
:: كلمة شكر تدعمنا في إعطاء المزيد ::

1 التعليقات:
اضغط لإضافة التعليقاتtest
من الرائع ان تشاركنا تجربتك ورأيك، من فضلك لا تستخدم اي كلمات خارجة، روابط لا علاقة لها بالموضوع لانه سيتم حذفها فوراً. فالتعليقات خاضعة للإشراف، دعنا نجعل التعليقات ساحة لتبادل الخبرات والنقاش , واحب ان انبهك انه عند تعليقك تستطيع متابعة التعليق من خلال " إعلامي " الموجودة اسفل يسار الصندوق.
تحويل الأكوادإغلاق التعبيراتإخفاء