اضافة مواضيع ذات صلة لمدونات بلوجر وبشكل رائع وجميل الخاصية تجعل زائر مدونتك يصل للمواضيع التي يبحت عنها بسهولة ويسر.
طريقة التركيب :
الدخول إلى القالب ثم تحرير HTML
نضيف الكود التالي قبل </head>
<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove -->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float: center;
text-transform: none;
height: 100%;
min-height: 100%;
padding-top: 5px;
padding-left: 5px;
font-size
}
#related-posts h2 {
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “
Times New Roman”, 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: #6E6E6E;
color: #ffffff;
}
</style>
<script type='text/javascript'> var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxdgfgjEt7bx67ydGbS3QimBRp3_MIHhw24pz_9f1Rf_MsNDvqVmLJs4NwG-XKMTNN6xIN6SGEZjAsKgNncQi1ivIHsWM6W2Suap5MHOGeCJM1EMAcYUrgWKVtvTVlPZbQqp6rSbWk7gg/s400/noimage.png"; var maxresults=5; var splittercolor="#d4eaf2"; var relatedpoststitle=""; </script>
<script src='http://code.helperblogger.com/hb-related-posts.js' type='text/javascript'/>>
<!-- remove -->
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
<!-- remove -->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float: center;
text-transform: none;
height: 100%;
min-height: 100%;
padding-top: 5px;
padding-left: 5px;
font-size
}
#related-posts h2 {
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “
Times New Roman”, 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: #6E6E6E;
color: #ffffff;
}
</style>
<script type='text/javascript'> var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxdgfgjEt7bx67ydGbS3QimBRp3_MIHhw24pz_9f1Rf_MsNDvqVmLJs4NwG-XKMTNN6xIN6SGEZjAsKgNncQi1ivIHsWM6W2Suap5MHOGeCJM1EMAcYUrgWKVtvTVlPZbQqp6rSbWk7gg/s400/noimage.png"; var maxresults=5; var splittercolor="#d4eaf2"; var relatedpoststitle=""; </script>
<script src='http://code.helperblogger.com/hb-related-posts.js' type='text/javascript'/>>
<!-- remove -->
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
ثم ابحث عن الكود التالي
<div class='post-footer-line post-footer-line-1'/>ثم ضع الكود التالي قبله مباشرة
<!-- Related Posts with Thumbnails Code Start--><!-- remove --><b:if cond='data:blog.pageType == "item"'><div id='related-posts'><b:loop values='data:post.labels' var='label'><b:if cond='data:label.isLast != "true"'></b:if><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=7"' type='text/javascript'/></b:loop> <script type='text/javascript'> removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs("<data:post.url/>"); </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 alt='Related Posts Widget For Blogger with Thumbnails' src='http://image.bloggerplugins.org/blogger-widgets.png' style='border: 0'/></a><a href='http://bloggertemplates.bloggerplugins.org/'><img alt='Blogger Templates' src='http://image.bloggerplugins.org/blogger-templates.png' style='border: 0'/></a></b:if></b:if><!-- Related Posts with Thumbnails Code End-->
واحفظ القالب وشاهد الاضافة
وفي الختام اشكركم على حسن تتبعكم









ليست هناك تعليقات:
إرسال تعليق