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

الاثنين، 25 أبريل 2016

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

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

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/hasni28professional'><i class='fa fa-facebook'/> تابع</a></li>
<li class='ggl'><p> إنظم إلينا عبر جوجل + وتابع كل جديدنا خطوة بخطوة.</p><a class='p2' href='https://www.facebook.com/hasni28professional'><i class='fa fa-google-plus'/> تابع</a></li>
<li class='twt'><p>إنظم إلينا على تويتر وتابع كل ممقالاتنا وأخبارنا خطوة خطوة.</p><a class='p3 ' href='https://www.facebook.com/hasni28professional'><i class='fa fa-twitter'/> تابع</a></li>
<li class='ytb'><p>إنظم إلينا على تويتر وتابع كل ممقالاتنا وأخبارنا خطوة خطوة.</p><a class='p4' href='https://www.facebook.com/hasni28professional'><i class='fa fa-youtube'/> تابع</a></li>
</ul>
</div>
</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='enter-posts'><div id='entry-post-content'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimpqus3r-t-1qDsPucNqU01slglrS09aw4fIzzYtSTjSspYdT5MwkyqlZqib1koQ1j3zNg1AZAkEk0KuKiffwa7SUMW33QzNOZaeSf9XirSB0-kH2yjIn9TmWtXiWEIRcN__vpxVDLsZg/s1600/home.jpg'/>
<div class='post-meta-entry'>
<div class='po454d'>
<img class='katib-src' src='http://store2.up-00.com/2016-04/146114104142921.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://hasni28professional.blogspot.com/' itemprop='url'/>
<a class='g-profile' data-gapiattached='true' data-gapiscan='true' data-onload='true' href='http://hasni28professional.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://hasni28professional.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>

واتساب

الكاتب : Unknown

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

حسني للمعلوميات

الاثنين، 25 أبريل 2016