Tuesday, August 17, 2010

اضافة مواضيع مشابهه او related post الي مدونتك



related posts with thumbnails for blogger
هذه هي الصورة التي ستكون اسفل المدونة الخاصه بيك بعد تركيب هذه الاضافة




  1. ادخل علي dashboard  او الاعدادات ثم Layout > Edit HTML وقم بتوسيع القالب عن طريق الضغط علي علامة صح اعلي صفحة الاسكربتات .
  2. ابحث عن الكود التالي </head>
  3. ثم قم باستبداله بهذا الكود



<!--Related Posts with thumbnails Scripts and Styles Start-->

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>

<style type="text/css">

#related-posts {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;

padding-left:5px;

}

#related-posts h2{

font-size: 1.6em;

font-weight: bold;

color: black;

font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;

margin-bottom: 0.75em;

margin-top: 0em;

padding-top: 0em;

}

#related-posts a{

color:black;

}

#related-posts a:hover{

color:black;

}

#related-posts  a:hover {

background-color:#d4eaf2;

}

</style>

<script type='text/javascript'>

var defaultnoimage="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";

var maxresults=5;

var splittercolor="#d4eaf2";

var relatedpoststitle="Related Posts";

</script>

<script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>

<!-- remove --></b:if>

<!--Related Posts with thumbnails Scripts and Styles End-->


</head>




الان ابحث عن الكود التالي..
<div class='post-footer-line post-footer-line-1'>

اذا لم تجد هذا الكود قم بالبحث عن الكود التالي.
<p class='post-footer-line post-footer-line-1'>

بعدما تجد الكود الذي بحثت عنه ضع الكود التالي.












<!-- Related Posts with Thumbnails Code Start-->

<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != &quot;true&quot;'>

</b:if>

<script expr:src='&quot;/feeds/posts/default/-/&quot;   data:label.name   &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>

<script type='text/javascript'>

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);

</script>

</div><div style='clear:both'/>

<!-- remove --></b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>

<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>

</b:if></b:if>


<!-- Related Posts with Thumbnails Code End-->









الان انتهينا من وضع الاكواد ونأتي الي تعديل الشكل العام للاضافه



  1. لزيادة او تقليل عدد خانات الصور قم بالبحث عن الكود التالي







    var maxresults=5;
ثم قلل او زود العدد حسبما تريد

  • لتعديل اسم الاضافة الذي سيظهر في اعلي الاضافة ابحث عن الكود التالي 








    var relatedpoststitle="Related Posts"  

  •  ثم غير كلمة   
    
    
       Related Posts


    0 comments:

    Post a Comment