اضافة اداة اختصار روابط مقالات مدونتك مع مواقع التواصل

السلام عليكم .... �� , اليوم لدينا اضافة جديدة من أضافات بلوجر الا وهي اضافة اداة اختصار روابط مقالات مدونتك مع مواقع التواصل  ، هي اضافة جميلة تتيح لزوارك اخذ رابط �� مختصر لتدويناتك ونشرها بكل سهولة علي مواقع التواصل الاجتماعي ، مع ازرار المتابعة ، تتميز �� هذه الاضافة بشكل جميل وغير مزعجة اطلاقاً ، كي لا نطيل اليكم المعاينة ومن ثم طريقة التركيب .


شرح طريقة التركيب
1. قم بالبحث فى قالب مدونتك عن الوسم ]]></b:skin> ثم قم بوضع الكود التالى فوقه

الكود

<!-- short urls by www.Pro7web.com -->
div#shoternUrl {
  background-color: #505050;
  height: 60px;
  margin-top: 15px;
  border-radius: 5px;
}
div#shorternh2 {
  float: right;
  margin-right: 15px;
  color: #FFF;
  padding-top: 14px;
}
input.textinpo {
  float: left;
  margin: 15px 0 0 10px;
  border: 0px solid #FFF;
  padding: 5px;
  background-color: #333;
  color: #FFF;
  margin-left: 250px;
}
.author-Pro7web {
float: left;
  padding: 6px;
  margin-top: 7px;
  margin-left:-419px;
}
.author-Pro7web a{
  display: inline-block;
  text-align: center;
  font-size: 15px;
  margin-right: 0px;
}
.author-Pro7web a i{
  font-family: Fontawesome;
  width: 30px;
  height: 30px;
  line-height: 20px;
  padding: 5px;
  display: block;
  opacity: 1;
  transition: all .3s;
}
.author-Pro7web a:nth-child(1) i {
background:#2d609b;color:#fff;
}
.author-Pro7web a:nth-child(2) i {
background:#19bfe5;color:#fff;
}
.author-Pro7web a:nth-child(3) i {
background:#eb4026;color:#fff;
}
.author-Pro7web a:hover:nth-child(1) i,.author-Pro7web a:hover:nth-child(2) i,.author-Pro7web a:hover:nth-child(3) i {
opacity:0.90;
}
div#shorternhwdbloog {
  float: left;
  color: #FFF;
  padding-top: 14px;
  margin-left: -306px;
}

2. الأن مع المكود الذى سوف يمكنك من اظهار الإضافة قم بالبحث عن الوسم هذا <data:post.body/> سوف تجده مكرر ثلاث مرات الوسم الثالث هو المقصود ثم قم بوضع الكود التالى فوقه اذا تريد اظهار الإضافة فى اول الموضوع او ضع الكود اسفله اذا تريد اظهار الإضافة اسفل الموضوع .

الكود

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div id='shoternUrl'>
  <form id='shorturl'/>
<div id='shorternhwdbloog'>تابعونا على</div>
<div class='author-Pro7web'>
  <a class='facebook-wdbloog' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<a class='twitter-wdbloog' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<a class='google-plus-wdbloog' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
</div>
</div>
</b:if>

3. قم بالبحث عن الوسم </body> ثم قم بوضع الكود التالى فوقه .

الكود

<script src='http://bit.ly/javascript-api.js?version=latest&amp;login=wahatinfo&amp;apiKey=R_6795ee07e9a640488d62f80f0ac2e5d5' type='text/javascript'/>
  <script type='text/javascript'>
    BitlyClient.addPageLoadEvent(function(){
      BitlyCB.myShortenCallback = function(data) {
        // this is how to get a result of shortening a single url
        var result;
        for (var r in data.results) {
          result = data.results[r];
          result[&#39;longUrl&#39;] = r;
                 break;
                 }
                 document.getElementById(&quot;shorturl&quot;).innerHTML = &quot;<div id='shorternh2'>رابط مختصر للمقال</div> &lt;input type=&#39;text&#39;  class=&#39;textinpo&#39; value=&#39;&quot; + result[&#39;shortUrl&#39;] + &quot;&#39; name=&#39;bitlyurl&#39;/&gt;&quot;;}
                 BitlyClient.shorten(document.location, &#39;BitlyCB.myShortenCallback&#39;);
                 });
  </script>

قم بحفظ القالب ومبروك عليك الإضافة.

لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق
شارك المقال على :

التعليقات

لا توجد تعليقات حتى الآن، كن أول من يعلق

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة

المشاركات الشائعة

أحدث التعليقات

رسالة!

نأسف بشده عن عدم الرد علي بعض تعليقاتكم ورسائلكم ، نظرا لانشغالي بالامتحانات ، اتمني منكم الدعاء لي بالنجاح ، واتمني لقم قضاء أجمل الاوقات معنا في " برو ويب " وسوف اعود لكم في 24/6

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