اضافة اداة متابعة على مواقع التواصل الاجتماعي فى بلوجر

شرح طريقة اضافة اكواد HTML و SKIN لاداة المتابعة على مواقع التواصل الاجتماعي الفيسبوك , التويتر , جوجل بلس , اليوتيوب الشبيه لمدونة المحترف

اداة تواصل الاجتماعية اضافة تواصل الاجتماعية بلوجرة اضافات بلوجرة اداة متابعة مواقع التواصل الاجتماعية متابعة مواقع التواصل الاجتماعي بلوجرة bloggerة follow-up on social networkingة Add follow-up on social networking

الاكواد المستخدمة في الشرح :

الاكواد التى تضيفها اسفل <head>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>

=================================================================
الاكواد التى تضاف فوق كود </b:skin>

div#social {
  overflow: hidden;
  margin: 7px auto;
  margin-top: -5px;
  margin-right: -15px;
  width: 100%;
}
#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;
}

=================================================

اكواد  HTML في التخطيط مع تعديل الروابط

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='social'>
<ul>
<li class='fb'>
إنظم لأكثر من مليون و نصف معجب عبر صفحتنا على الفيسبوك.
<a class='p1' href='https://www.facebook.com/aboalkasima'> تابع</a></li>
<li class='ggl'>
إنظم إلينا عبر جوجل + حيث أكثر من 33 ألف يتابعنا.
<a class='p2' href='https://plus.google.com/u/0/+aboalkasima'> تابع</a></li>
<li class='twt'>
إنظم لأزيد من 40 ألف متابع لنا عبر تويتر.
<a class='p3 ' href='https://twitter.com/aboalkasima'> تابع</a></li>
<li class='ytb'>
تابعنا على يوتيوب حيث أكثر من مليون و 300 ألف متابع لفيدوهاتنا.
<a class='p4' href='https://www.youtube.com/aboalkasima'> تابع</a></li>
</ul>
</div>
</b:if>

++++++++++++++++++++++++++++++++++++

Blog Comments
Facebook Comments

ليست هناك تعليقات:

إرسال تعليق

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

Pay with PayPal or Card

aboalkasim_sidebar2_AdSense1_1x1_as

آخر الأخبار

التواصل واتساب

aboalkasim_main_Blog1_1x1_as

aboalkasim_sidebar2_AdSense1_1x1_as

نموذج الاتصال

Recent Posts

ads4

كود تتبع الموقع الزيارات

كود حظر مانع الاعلانات

إجمالي مرات مشاهدة الصفحة

Translate

من فضلك 👇🤳🏻أضغط متابعة ليصلكم كل ما هو جديد

تبعنا على👇🤳🏻 مواقع التواصل الإجتماعي الأخرى

فاصل إعلاني