كيفية إضافة الروابط الأوتوماتيكية خاصة بتدويناتك على البلوجر عند نهاية كل موضوع

سنتعرف في درسنا اليوم على كيفية إضافة الروابط الأوتوماتيكية خاصة بتدويناتك على البلوجر عند نهاية كل موضوع، بحيث يتم عرضها مرتبة على جدول أسفل كل تدوينة، وتشمل الإضافة ثلاث صيغ من الروابط الخاصة بالموضوع وهي :
- رابط عادي URL،

- رابط خاص بـ HTML،

- رابط للمنتديات BBCode.
 

بدون الإطالة عليكم أترككم مع كيفية تركيب هذه الإضافة.

1- اتجه إلى لوحة تحكم البلوجر الخاصة بك و اضغط على تصميم من القائمة الجانبية، ثم على تعديل القالب "Edit HTML".
*لا تنسى أخذ نسخة احتياطية من القالب
2- اضغط على CTRL+F للبحث عن السطر التالي :

]]></b:skin>

3- وقم بلصق الكود التالي فوقه :

#table {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 13px;
    margin: 10px -12px;
    width: 580px;
    text-align: left;
    border-collapse: collapse;
   direction:ltr;
}
#table th {
    font-size: 13px;
    font-weight: normal;
    padding: 8px;
    background: #b9c9fe url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXJSFNXougsivQU383nxRlaRBuR4VeijTrm_Ej3J9AIQQd8mKBuaV9j_rbKR5JS23XEUVoncvilZZNtawtFQALKt3E8Wpf9CvLBaqMgGi3nmibNOEERTt1gIkxOv6x_DJeTV50yN9IH-gu/s1600/gradhead.png') repeat-x;
    border-top: 2px solid #d3ddff;
    border-bottom: 1px solid #fff;
    color: #039;

}
#table td {
    padding: 8px;
    border-bottom: 1px solid #fff;
    color: #4c4c4c;
    border-top: 1px solid #fff;
    background: #e8edff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7Pns7Qyu3Pb22KJIjAQxRDNpWwTE_ZehCI3TrjjMW8ZqiYFsYAuSmcHgyH3q2q1oeuPrLhzBgeLqPF9o1m1t-xMPL2bmxKc2CkAYo8OGp5erAdVFDrBYCkc-WEYI_GG5-VLrQEXA-oYEE/s1600/gradback.png') repeat-x;
}
#table tfoot tr td {
    background: #e8edff;
    font-size: 20px;
    color: #99c;
    text-align:center;
}
#table tbody tr:hover td {
    background: #d0dafd url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPj7uv0vDtC1cQ4a1OuHJeRZfXsU-_XqIe29ymYG424vTW8vXhQ8MY5gnt5jZXst10j4sUGTUTsvtvBwl1U-YaGweYqDO-3NkZDgihl6_pWSJW_JRWcI847d1DsTNfiYWcpxYMZYgbWSpB/s1600/gradhover.png') repeat-x;
    color: #339;
}
#table a:hover {
    text-decoration:underline;
}

4- والآن قم بالضغط على CTRL+F للبحث عن السطر التالي :

<data:post.body/>

* إن وجدته أكثر من مرة فالأخير هو المقصود

5- ثم ألصق تحته الكود التالي (كما هو موضح في الصورة بالأسفل - اضغط على الصورة للتكبير) :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<table id='table' summary='روابط الموضوع'>
  <tfoot>
    <tr>
      <td colspan='2'>روابط هذه التدوينة قابلة للنسخ واللصق</td>
    </tr>
  </tfoot>
<tr>
  <td>URL</td>
  <td><input expr:value='data:post.canonicalUrl' onclick='this.focus(); this.select();' readonly='readonly' style='width: 560px;' type='text'/></td>
</tr><tr>
  <td>HTML</td>
  <td><input expr:value='&quot;&lt;a href=&amp;quot;&quot; + data:post.canonicalUrl + &quot;&amp;quot; title=&amp;quot;&quot; + data:post.title + &quot;&amp;quot;&gt;&quot; + data:post.title + &quot;&lt;/a&gt;&quot;' onclick='this.focus(); this.select();' readonly='readonly' style='width: 560px;' type='text'/></td>
</tr><tr>
  <td>BBCode</td>
  <td><input expr:value='&quot;[url=&quot; + data:post.canonicalUrl + &quot;]&quot; + data:post.title + &quot;[/url]&quot;' onclick='this.focus(); this.select();' readonly='readonly' style='width: 560px;' type='text'/></td>
</tr>
</table> </b:if>

6- وفي الأخير لا تنسى حفظ القالب.

*! أتمنى أن أكون قد وفقت في إيصال المعلومة لكم بدون تعقيدات ;)
و إذا واجهت أي مشكل أو لديك أي استفسار لا تتردد في طرح سؤالك وذلك بالرد بتعليق، سأجيب بالتأكيد! إن شاء الله ...

و دمتم في رعاية الله وحفضه