اضافة أيقونات التواصل الاجتماعي لقوالب بلوجر 2016.

اضافة أيقونات التواصل الاجتماعي لقوالب بلوجر 2016.

اضافة أيقونات التواصل الاجتماعي لقوالب بلوجر: اضافة ايقونات التواصل الاجتماعي أو الروابط الإجتماعية اليوم اصبحت أكثر شئ مهم في مدونات بلوجر يمكنك رؤية ذلك في اكبر المدونات في العالم بل كلها لاتتخلى عن ذلك ، وكل مدون يستعمل طريقة لجلب نظر المستخدم ليكون من متابعيه، على المواقع الاجتماعية للوصول لاخر مواضيعه
اضافة أيقونات التواصل الاجتماعي لقوالب بلوجر 2016.
اضافة أيقونات التواصل الاجتماعي لقوالب بلوجر 2016.

- اليوم نقدم لكم واحدة من اضافات بلوجر الرائعة الخاصة بالمواقع الاجتماعية الخاصة بك ، صندوق ايقونات التواصل الاجتماعي  الذي يسهل للمدون ربط حساباته الإجتماعية بمدونته بطريقة سهلة وأنيقة، يمكنك وضعها في مكان جيد في سيدبار قالب بلوجرلأن ذلك مهم جدا لإستهداف أكبر فئة ممكنة من الزوار عن طريق متابعتك في الفايسبوك والتويتر .

- من أروع الإضافات أيضا :

اضافة أزرار المشاركة بشكل دائري جذاب لمدونات بلوجر 2016.
اضافة روابط المواقع الاجتماعية مع عداد المتابعين 2016.
اضافة ازرار المشاركة فلات لمدونات بلوجر 2016.
- مميزات الاضافة :
1-اضافة  ايقونات التواصل الاجتماعي مصممة لثلاثة مواقع اجتماعية تعتبر هي الأكبر في الأنترنت ، الفايسبوك ، التويتر، وقوقل بليس .
2- تأثير حائم بشكل رائع .
3- إمكانية وضعها في اي مكان تريد أن تظهر فيه على سيدبار قالب بلوجر الخاص بك .
4- الرائع في هاته اضافة  ايقونات التواصل الاجتماعي هو اعتمادها على العلامات فقط لعرض المواقع الاجتماعية الثلاثة يعني في الكثير من الاضافات تجد أنهم يكتبون الاسم كاملا حيب رأيي أن هاته الاضافة افضل أغلبية الناس تعرف هاته المواقع الغنية عن التعريف بدون ايعاز وكفى بالعلامة دليلا لذلك .
5- الآن سوف نبدأ في تركيب الإضافة خطوة خطوة لذا أنصح بأخذ نسخة إحتياطية تحسبا لأي طارئ .
6- لنسخ الكود إضغط مرتين وسطه.
1- الخطوة الأولى : قم بالذهاب للوحة التحكم- القالب - تعديل HTML
  - قم بتحميل كود Css الخاص باضافة  ايقونات التواصل الاجتماعي التالي من هنا
  -أو قم بنسخ كود CSS التالي وضعه فوق  <style/>

 .icon {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  margin: 4px;
  width: 92px;
  height: 96px;
  font-size: 0;
  text-indent: -9999px;
  background-color: #404040;
}

.icon-border {
  position: relative;
}

.icon-border::before,
.icon-border::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: &quot;&quot;;
}

.icon-border::before {
  z-index: 1;
  -webkit-transition: box-shadow 0.3s;
          transition: box-shadow 0.3s;
}

.icon-border::after {
  z-index: 2;
  background: url(&quot;http://i.imgur.com/gOZiqfy.png&quot;);
  background-image: url(&quot;http://callmenick.com/_development/icons-css3-transitions/img/icons4.svg&quot;), none;
}

/* facebook */
.icon-border.facebook::before {
  box-shadow: inset 0 0 0 48px #3b5998;
}

.icon-border.facebook:hover::before {
  box-shadow: inset 0 0 0 4px #3b5998;
}

.icon-border.facebook::after {
  background-position: 0 0;
}

/* twitter */
.icon-border.twitter::before {
  box-shadow: inset 0 0 0 48px #4099ff;
}

.icon-border.twitter:hover::before {
  box-shadow: inset 0 0 0 4px #4099ff;
}

.icon-border.twitter::after {
  background-position: -96px 0;
}

/* google plus */
.icon-border.googleplus::before {
  box-shadow: inset 0 0 0 48px #d34836;
}

.icon-border.googleplus:hover::before {
  box-shadow: inset 0 0 0 4px #d34836;
}

.icon-border.googleplus::after {
  background-position: -192px 0;
} 
- قم بحفظ القالب .
2- الخطوة الثانية : من لوحة التحكم قم بالذهاب إلى التخطيط - افتح نافذة جديدة وإخترHTML/Javascript  ثم قم بتحميل الكود التالي في ملف Text 
أو قم بنسخ الكود وضعه داخل الأداة الخاصة بتخطيط قالب بلوجر.
HTML/Javascript 
 <a href="#" class="icon icon-border facebook">facebook</a>
<a href="#" class="icon icon-border twitter">twitter</a>
<a href="#" class="icon icon-border googleplus">google+</a> 

-  غير علامة دياز # بروابط حساباتك الشخصية أو صفحاتك في المواقع المعنية .

- قم بحفظ الاضافة ثم حفظ التخطيط واستمتع بالنتيجة .
How to hire a Java developer V3
السابق
التالي

الكاتب :

حمــزة قري مدون جزائري هاوي ولست مختص ربما تجد بعض الأخطاء آسف لذلك

: هناك تعليقان (2)

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

    ردحذف
  2. موضوع فعلا رائع واستفد منه الله يباركلك

    ردحذف