اختصر روابط مقالات مدونتك بشكل تلقائي

بسم الله الرحمان الرحيم 

السلام عليكم ورحمة الله وبركاته 

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

الهاك مهمته هو توليد رابط مختصر لأي تدوينة بشكل تلقائي عبر خدمة بيتلي

صورة لذلك :

وايضا يمكنك مشاهدة مثال حي :

• 
  

الان ناتي الى شرح  كيفية اضافة الهاك :

 اولا نحمل نسخة احتياطية للقالب ثم نتجه نحو design ثم Edit html 

 الخطوة الاولى ثم نوسع القالب ونبحث عن السطر التالي :

</head>

 قبلها مباشرة نلصق الكود الموالي :

<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&amp;login=YOURUSERNAME&amp;apiKey=YOURAPIKEY"></script>

<script type="text/javascript" charset="utf-8">

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['longUrl'] = r;

break;

}

document.getElementById("shorturl").innerHTML = "Share this link: &lt;input type='text' value='" + result['shortUrl'] + "' name='bitlyurl'/&gt;";

}

BitlyClient.shorten(document.location, 'BitlyCB.myShortenCallback');

});

</script>

هنا عليك استبدال

YOURUSERNAME

باسم حاسبك في موقع بيتلي

وايضا عليك تعديل 

YOURAPIKEY

بالــAPI KEY الخاص بحسابك في بيتلي 

الان الخطوة الثانية   مرحلة اضافة اكواد CSS 

سنبحث عن :

]]></b:skin> 

قبلها مباشرة نضيف :

form#shorturl {

color:#666;

font-size:11px

}#shorturl input {
color:#999;
border:1px inset #CDCDCD;
padding:1px 5px;
}

 الان ناتي الى الخطوة الثالثة :

نبحث عن السطر التالي :

<div class='post-footer-line post-footer-line-3'>

الان ومباشرة تحت السطر اعلاه نضيف 

<b:if cond='data:blog.pageType == "item"'><form id='shorturl'/></b:if>

 ثم نضغط :

Save Template

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

اولا سجل دخولك الى حسابك في بيتلي 

ثم نتجه الى الاعدادات

ثم

 اي استفسار نحن في الخدمة

 انتهى بحمد الله 

This article from http://www.3alymni.info/2010/12/design-edit-html-typetextjavascript.html#ixzz19i3brbAv

التصنيفات: اضافات بلوجر