اداة مواقع التواصل الاجتماعي كما في مدونة المحترف
تركيب الإضافة :
اولا قم بأخذ نسخة احتياطية من قالب مدونتك لنجنب حدوث اى مشكلة .
1- قم بالبحث عن الوسم ]]></b:skin> ثم قم بوضع فوقه الكود التالى ( قبله )
div#social { overflow: hidden; margin: 7px auto; margin-top: -5px; margin-right: -15px; width: 1103px; } #social ul li { float: right; width: 25%; padding: 13px 0; padding-bottom: 20px; } li.fb { background: #366299 !important; } li.ggl { background: #CB2027 !important; } li.twt { background: #4099FF !important; } ul li { list-style: none; } #social ul li p { display: block; padding: 10px 15px; transition: 0.4s; color: #fff; font-size: 16px; text-align: center; font-weight: 400; font-family: Electrolize,ge_dinar_oneregular; } #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;font-weight: 400; font-family: Electrolize,ge_dinar_oneregular; } #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; } .fa-facebook:before { content: "\f09a"; margin-left: 0px; } li.ytb { background: #D1252A !important; } .p2 { background: #AF1A20 !important; } .p3 { background: #3A8DEC !important; } .p4 { background: #BB1E23 !important; } .p1 { background: #2F5686 !important; }
2- الكود الخاص بالإضافة هذا الكود يتم وضعه فى المكان الذى تراه مناسب ومن الممكن ان يضف أسفل القائمة الرئيسية مثل ما فى المعاينة .
<b:if cond='data:blog.url == data:blog.homepageUrl'> <div id='social'> <ul> <li class='fb'><p>إنظم لأكثر من مليون و نصف معجب عبر صفحتنا على الفيسبوك.</p><a class='p1' href='https://www.facebook.com/wdbloog'><i class='fa fa-facebook'/> تابع</a></li> <li class='ggl'><p>إنظم إلينا عبر جوجل + حيث أكثر من 33 ألف يتابعنا.</p><a class='p2' href='https://www.facebook.com/wdbloog'><i class='fa fa-google-plus'/> تابع</a></li> <li class='twt'><p>إنظم لأزيد من 40 ألف متابع لنا عبر تويتر.</p><a class='p3 ' href='https://www.facebook.com/wdbloog'><i class='fa fa-twitter'/> تابع</a></li> <li class='ytb'><p>تابعنا على يوتيوب حيث أكثر من مليون و 300 ألف متابع لفيدوهاتنا.</p><a class='p4' href='https://www.facebook.com/wdbloog'><i class='fa fa-youtube'/> تابع</a></li> </ul> </div> </b:if> <b:if cond='data:blog.pageType == "item"'> <div id='enter-posts'><div id='entry-post-content'> <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-Zm4zoFoOXMzCQ07w5xOc6Oz-eeX0h6AffHlsBN9n2tClTNqWI0a5ayemsNmAi6vHLauy4oJT2aa4klvZKReQbsrfEA9Mog6kyf3wfBwuOhueVKUjxgMnuSOvJV5qqYsvMwZkOCBf9nQ/s1600/home.jpg'/> <div class='post-meta-entry'> <div class='po454d'> <img class='katib-src' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9CfIfx88H92EZIIiP6uwbW6BDEwMgJF5Qidipg70z8DgdYElJZUbmsGzu4_UKTWmQpYfG7iZT7XueYsAd_UQQNS5guiFdJ7BJrQTboMjp8UciM5hfHS7wIFc1b8K9ZnWLXAAGFv8ylu0/s1600/10401879_463780717160047_3223573746725786489_n.png'/> </div> <h3 class='post-title entry-title' style='color: #FFFFFF;'>المحترف: شروحات برامج مكتوبة ومصورة بالفيديو | Almohtarif</h3> <span class='post-author-th3'> <i class='fa fa-user'/> <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'> <meta content='http://wdbloog.blogspot.com/' itemprop='url'/> <a class='g-profile' data-gapiattached='true' data-gapiscan='true' data-onload='true' href='http://wdbloog.blogspot.com/' rel='author' style='color: #FFFFFF;font-family: Electrolize,hacen_saudi_arabiaregular;' title='عالم المدون'> عالم المدون </a> </span> </span> <span class='post-timestamp'> <i class='fa fa-clock-o'/> <meta content='' itemprop='url'/> <a class='timestamp-link' href='http://wdbloog.blogspot.com/' rel='bookmark' title='permanent link'><abbr class='published timeago' itemprop='datePublished' style='color: #FFFFFF; font-family: Electrolize,hacen_saudi_arabiaregular;' title='2016-04-14T10:19:00+01:00'>10:19 م</abbr></a> </span> </div> </div> </div> </b:if>
يمكنك تعديل على وصف كل موقع من مواقع التوصل وعدد المتابعين بما تريد .
اضف تعليقاً عبر:
الابتسامات