recent
أخبار ساخنة

اضافة رابط مختصر للمقلات

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

معاينة الإضافة



شرح تركيب الإضافة



الإضافاة سهل التركيب فهى تتمثل فى ثلاث خطوات فقط



  1. اولا : قم بالبحث فى قالب مدونتك عن الوسم ]]></b:skin>ثم قم بوضع الكود التالى فوقه.
div#shoternUrl {
  background-color: #CB2027;
  height: 60px;
  margin: 10px;
}
div#shorternh2 {
  float: right;
  margin-right: 15px;
  color: #FFF;
  padding-top: 14px;
}
input.textinpo {
  float: left;
  margin: 9px 0 0 10px;
  border: 1px solid #FFF;
  padding: 5px;
  background-color: #55ACEE;
  color: #FFF;
  margin-left: 250px;
}
.author-wdbloog {
float: left;
  padding: 6px;
  margin-top: 7px;
  margin-left:-419px;
  background-color: #fff;
}
.author-wdbloog a{
  display: inline-block;
  text-align: center;
  font-size: 15px;
  margin-right: 0px;
}
.author-wdbloog a i{
  font-family: Fontawesome;
  width: 30px;
  height: 30px;
  line-height: 20px;
  padding: 5px;
  display: block;
  opacity: 1;
  transition: all .3s;
}
.author-wdbloog a:nth-child(1) i {
background:#2d609b;color:#fff;
}
.author-wdbloog a:nth-child(2) i {
background:#19bfe5;color:#fff;
}
.author-wdbloog a:nth-child(3) i {
background:#eb4026;color:#fff;
}
.author-wdbloog a:hover:nth-child(1) i,.author-wdbloog a:hover:nth-child(2) i,.author-wdbloog a:hover:nth-child(3) i {
opacity:0.90;
}
div#shorternhwdbloog {
  float: left;
  color: #FFF;
  padding-top: 14px;
  margin-left: -306px;
}


  1. ثانيا : قم بالبحث عن الوسم </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>


ثالثا : الأن مع المكود الذى سوف يمكنك من اظهار الإضافة قم بالبحث عن الوسم هذا <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-wdbloog'>
  <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>


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



بالتوفيق لكم وفى امان الله
google-playkhamsatmostaqltradent