اضافة اداة المسابقات والمواضيع المميزة مثل مدونة تقني الانترنت

مرحبا بكم مجددا على مدونة تقني الانترنت بعد عدة طلبات من زوار مدونتي المخلصين لنشر اداة المسابقات والخدمات المجانية مثل التي في مدونتي للاستفادة منها  نقوم اليوم بشرح اضافة هاته الاداة وهي اداة رائعة يمكنك وضع عليها افضل المواضيع او المواضيع المميزة وايضا يمكنك  الترويج للمسابقات التي تضعها في المدونة ولها خصائص كثيرا يمكنك استعماله على هاته الاضافة .

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

شرح طريقة التركيب

اولا :

1. تسجيل حسابك في Blogger

2. على لوحة التحكم الرئيسية اختر  قالب » تحرير Html

3. ابحث بإستعمال CTRL+F عن :  ]]></b:skin>

4. أضف الكود التالى قبله ( فوقه )

الكود

#recomanim {    margin: 1% 1% 0px;margin-top: 50px;}
.stat {position: absolute;z-index: 10;color: #FFF;padding: 3px 6px;font-size: 10px;border-radius: 3px;top: 5px;right: 5px;}
.recobox {margin-bottom: 10px;padding: 5px;background-image: linear-gradient(to bottom, #E8E8E8 0px, #F5F5F5 100%);background-repeat: repeat-x;border: 1px solid #DBDBDB;box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.05) inset, 0px 1px 0px rgba(255, 255, 255, 0.1);}
.anim {float: right;margin: 16px;border: 1px solid #CCC;border-radius: 3px;position: relative;width: 122px;height: 171px;overflow: hidden;font-family: ge_ss_threeregular;}
.stat.ongo {background: none repeat scroll 0% 0% #E75040;}
.anim a {display: block;font-size: 0px;}
.anim img {width: 100%;height: 100%;cursor: url(//ar1web-com.googlecode.com/svn/Hm/cursormicky.png),pointer;}
.anim img:hover {opacity: 0.9;margin-top: -11px;transition: all 0.3s ease;}
.anim p {margin: 0px;font-size: 11px;background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.5);color: #FFF;position: absolute;bottom: 0px;z-index: 200;padding: 4px 6px 5px;width: 110px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: right;}

5. قم بحفظ القالب

ثانيا :

اضف الكود التالي في اداة في التخطيط او في اي مكان في القالب

<div class='recobox'> <div class='anim'> <span class='stat ongo'>200 زائر</span> <a href='http://www.tech1net.com/p/200.html'> <img alt='' src='http://s27.postimg.org/f473ravmb/Color.png' title=''/> <p> مجانا</p> </a> </div> <div class='anim'> <span class='stat ongo'>مسابقة</span> <a href='http://goo.gl/OrTlU0'> <img alt='' src='http://goo.gl/Q4aOWo' title=''/> <p> اشترك الان</p> </a> </div> <div class='anim'> <span class='stat ongo'>تبادل اعلاني</span> <a href='http://tknielantrnat.blogspot.com/p/blog-page_12.html'> <img alt='' src='http://goo.gl/5VcmdL' title=''/> <p> اضف موقعك الان</p> </a> </div> <div class='anim'> <span class='stat ongo'>خدمة مجانية</span> <a href='http://www.tech1net.com/p/blog-page_20.html'> <img alt='' src='http://goo.gl/AarnOE' title=''/> <p> تصميم شعار</p> </a> </div> <div class='clear'/> </div> </div>

التغيرات سهلة فاعطينا مثال على الاول فالملون بالصفر غيره بما تريد من كتابة والملون بالاحمر برابط الصورة والازرق برابط الصفحة 

ومبروك عليك الاضافة