اضافة صناديق الاشتراك مثل مدونة المحترف

Unknown 9:47 ص

إضافة صناديق الإشتراك التابعة للمحترف 2016

بسم بالله الرحمن الرحيم ايوم اضافة صناديق الاشتراك التابعة للمحترف

1. نذهب اولا للقالب
2. تحرير Html
3. ابحث عن </b:skin>

ثم ضع هذا الكود فوقه مباشرة 

/*======================add social================*/ #social ul li{float:right; width:20%; padding:13px 0; padding-bottom:20px} #social ul li p{ display:block; padding:10px 15px; transition:0.4s; color:#fff; font-size:19px; text-align:center} #social ul li a{ display:block; background:#1f376c; padding:8px 0; transition:0.4s; width:100px; color:#fff; margin:0 auto; font-size:16px; text-align:center} li.fb{ background:#366299 !important} li.ggl{ background:#CB2027 !important} li.twt{ background:#4099FF !important} li.ytb{ background:#D1252A !important} li.inst{ background:#c08d64 !important} .p1{ background:#2F5686 !important} .p2{ background:#AF1A20 !important} .p3{ background:#3A8DEC !important} .p4{ background:#BB1E23 !important} .p5{ background:#c08541 !important} div#social{ overflow:hidden; margin:7px auto} #social li a:hover i{ -webkit-animation:rubberBand .8s 1; -moz-animation:rubberBand .8s 1; -o-animation:rubberBand .8s 1; animation:rubberBand .8s 1} #social i{ width:30px; height:30px; background:rgba(0,0,0,0.13); line-height:30px; border-radius:50%; margin-left:2px; font-size:14px} /* =====================كود تحريك الايقونات===================== */ .spinner .bounce1{-webkit-animation-delay:-.32s; animation-delay:-.32s}.spinner .bounce2{-webkit-animation-delay:-.16s; animation-delay:-.16s}@-webkit-keyframes bouncedelay{0%,80%,100%{-webkit-transform:scale(1.0)}40%{-webkit-transform:scale(0.4)}}@keyframes bouncedelay{0%,80%,100%{transform:scale(0.0); -webkit-transform:scale(1.0)}40%{transform:scale(1.0); -webkit-transform:scale(0.4)}}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.15,0.9,1); transform:scale3d(1.15,0.9,1)}40%{-webkit-transform:scale3d(0.8,1.15,1); transform:scale3d(0.8,1.15,1)}50%{-webkit-transform:scale3d(1.15,0.85,1); transform:scale3d(1.15,0.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1); transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1); transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)}}@keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.15,0.9,1); transform:scale3d(1.15,0.9,1)}40%{-webkit-transform:scale3d(0.8,1.15,1); transform:scale3d(0.8,1.15,1)}50%{-webkit-transform:scale3d(1.15,0.85,1); transform:scale3d(1.15,0.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1); transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1); transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation:rubberBand .8s 1; -moz-animation:rubberBand .8s 1; -o-animation:rubberBand .8s 1; animation:rubberBand .8s 1}

ثم ضع هذا الكود فى المكان المناسب سواء فى القالب فى اداة html

<div id="social"> <ul> <li class="fb"><p> إنضم لأكثر من مليون و نصف معجب عبر صفحتنا على الفيسبوك.</p> <a class="p1" href="http://facebook.com/Th3.professional" target="_blank"><i class="fa fa-facebook"></i> تابع</a></li> <li class="ggl"><p> إنضم إلينا عبر جوجل + حيث أكثر من 33 ألف يتابعنا.</p> <a class="p2" href="https://plus.google.com/b/110712684116503407942/+th3pro/posts" target="_blank"><i class="fa fa-google-plus"></i> تابع</a></li> <li class="twt"><p> إنضم لأزيد من 40 ألف متابع لنا عبر تويتر.</p> <a class="p3" href="http://www.twitter.com/mr_raghib" target="_blank"><i class="fa fa-twitter"></i> تابع</a></li> <li class="ytb"><p> تابعنا على يوتيوب حيث أكثر من مليون و 300 ألف متابع لفيدوهاتنا.</p> <a class="p4" href="http://youtube.com/geekraghib" target="_blank"><i class="fa fa-youtube"></i> تابع</a></li> </ul> </div>

ثم بالأخير استبدل الروابط بالروابط الخاصة بك

نتمنى ان تكونوا استفتدوا

ولا تنسوا تقييمنا والاشتراك بمدونتنا

شارك الموضوع :

عن الكاتب: Unknown

مواضيع ذات صلة :