الاثنين، 10 يونيو 2013

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


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

قد ترى وأنت تتصفح الكثير من المدونات ما يسمة بـ مواضيع ذات صلة أو قد تهمك أيضا هذه المواضيع أو قد تستفيد من هذه المواضيع وما تراه يكون بعض المواضيع التى تكون فى القسم الذى تشاهد به موضوعك فمثلا أنت تقرأ موضوع فى دروس بلوجر فما سيأتى فى مواضيع ذات صلة تكون المواضيع التى تحت قسم أو تصنيف دروس بلوجر أيضا وهذه الإضافة فائتدها أنها تجعل الزائر يقرأ أكثر من موضوع فى مدونتك مما سيزيد مرات مشاهدة الصفحة لمدونتك أو ما يسمى بالـ Page views وأنا سأقدم لكم اليوم طريقة عمل هذه المواضيع ذات الصلة Related posts تحت كل تدوينة من تدويناتك فى بلوجر وتكون متحركة وتعطى شكل أنيق لمدونتك..

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

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


ثالثا: اختر تحرير Html كما هو موضح فى هذه الصورة:



رابعا: ابحث عن هذا الكود 
</head>  بالإستعانة بـ Ctrl + f ثم ضع أسفله هذا الكود:

<b:if cond='data:blog.pageType == &quot;item&quot;'> <style type='text/css'> #related-posts { float:center; text-transform:none; height:100%; width:100% min-height:100%; padding-top:5px; padding-right:5px; } #related-posts h2{ background: #FFF!important; 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:#d4eaf2; } </style> <script src='http://balitraveltips.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if> <script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: 'en'} </script>

ثم ابحث عن هذا الكود:

<data:post.body/>

وضع أسفله هذا الكود:

<br/><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> <b:if cond='data:blog.pageType == &quot;item&quot;'> <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=7&quot;' type='text/javascript'/></b:if></b:loop> <h3 style='border-bottom: 3px #5D7D91 solid;padding-bottom:10px!important'><b>ربما تفيد من هذه المواضيع كذلك :</b></h3> <marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'> <script type='text/javascript'> var currentposturl=&quot;<data:post.url/>&quot;; var maxresults=10; var relatedpoststitle=&quot;&quot;; removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(); </script></marquee> </div> </b:if>
وفى النهاية أرجو أن تكونوا أنشأتموها فى مدوناتكم وأن تكون الإضافة أعجبتكم..
لا تنس إخبارنا برأيك..

هناك 3 تعليقات: