في هذا المقال يسعدني ان اقدم لكم الطريقة الصحيحة لتركيب انظمة
التعليقات في مدونات بلوجر , بحيث يستطيع الزائر التعليق باي نظام شاء ,
سواءا كان نظام مدونات بلوجر الافتراضي او نظام تعليقات ديسكوس او نظما تعليقات الفيس بوك .
التعليقات في مدونات بلوجر , بحيث يستطيع الزائر التعليق باي نظام شاء ,
سواءا كان نظام مدونات بلوجر الافتراضي او نظام تعليقات ديسكوس او نظما تعليقات الفيس بوك .
لمعاينة الاضافة " من هنا "
ملحوظة مهمة :
تركيب اكثر من نظام تعليق على مدونتك يؤثر على سرعة تحميل القالب فانا
لا انصح بهذه الامور وانما هي كمالية , فنظام تعليقات بلوجر يسمح
لكل من يمتلك حساب في جوجل بالتعليق , وهو كافي .
لا انصح بهذه الامور وانما هي كمالية , فنظام تعليقات بلوجر يسمح
لكل من يمتلك حساب في جوجل بالتعليق , وهو كافي .
الشرح
نتوجه الى لوحة التحكم في بلوجر ← القالب ← تحرير HTML ← ثم نضغط على Ctrl+f ونبحث عن الوسم <head/> ونلصق فوقه الكود التالي :
script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script>jQuery(document).ready(function($) { $("#tabs").tabs();});</script>
ثم نبحث عن الوسم ]]></b:skin> ونلصق فوقه الكود التالي :
#tabs {
background-color: #fff;border:2px solid #9F3F3F;border-radius:5px; box-shadow: 0 0 0 1px #ddd inset; margin: 0 0 20px; padding: 0 0 10px;}.cnmu-multicomm { background-color: #fff;border-radius:0px;border : 2px solid #9F3F3F;-moz-box-shadow: 0 15px 10px -12px black; box-shadow: 0 15px 10px -12px black;
display: block; height: 32px; line-height: 32px !important; list-style: outside none none; margin: 0 0 10px !important; overflow: hidden; padding: 0 !important;}.cnmu-multicomm li { float: right; margin: 0 !important; padding: 0 !important; width: 33.3%;}.cnmu-multicomm li a { color: #9F3F3F;font-family: elmessiri-bold ; display: block; float: right; height: 100%; line-height: 32px; text-align: center; text-decoration: none; width: 100%;}.ui-tabs-active.ui-state-active .blogger-comm {color: #fff;background-color: #fc5400;}.ui-tabs-active.ui-state-active .fb-comm {color: #fff;background-color: #3f5c9a;}.ui-tabs-active.ui-state-active .dis-comm {color: #fff;background-color: #229CFF;}
ثم نبحث عن السطر <b:includable id='comments' var='post'> ونقوم بعمل توسعه له ونقوم بالتظليل من <b:includable id='comments' var='post'> الى الوسم </b:includable> ونستبدل السطور المظللة بالكود التالي :
<b:includable id='comments' var='post'>
<div id='tabs'><ul class='cnmu-multicomm'><li><a class='blogger-comm' href='#tabs-1'>تعليقات بلوجر</a></li><li><a class='fb-comm' href='#tabs-2'>تعليقات فيسبوك</a></li><li><a class='dis-comm' href='#tabs-3'>Disqus تعليقات</a></li></ul><div style='margin:0 10px;'><!-- تعليقات بلوجر --><div id='tabs-1'><div class='comments' id='comments'><a name='comments'/><h4><data:post.commentLabelFull/>:</h4><div class='comments-content'><b:include cond='data:post.embedCommentForm' data='post' name='threaded_comment_js'/><div id='comment-holder'><data:post.commentHtml/></div></div><p class='comment-footer'><b:if cond='data:post.allowNewComments'><b:include data='post' name='threaded-comment-form'/><b:else/><data:post.noNewCommentsText/></b:if></p><b:if cond='data:showCmtPopup'><div id='comment-popup'><iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'></iframe></div></b:if><div id='backlinks-container'><div expr:id='data:widget.instanceId + "_backlinks-container"'><b:include cond='data:post.showBacklinks' data='post' name='backlinks'/></div></div></div></div><!-- نهاية تعليقات بلوجر --><!-- تعليقات فيس بوك --><div id='tabs-2'><script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' migrated='1' width='100%'/><div id='fb-root'/><script>window.fbAsyncInit = function() {FB.init({xfbml: true, appId: معرف فيسبوك });};(function() {var e = document.createElement('script'); e.async = true;e.src = document.location.protocol +'//connect.facebook.net/ar_AR/all.js'document.getElementById('fb-root').appendChild(e);}());</script></div><!-- نهاية تعليقات فيس بوك --><!-- تعليقات Disqus --><div id='tabs-3'><div id='disqus_thread'/><script type='text/javascript'>/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */var disqus_shortname = 'archer-1'; // required: replace example with your forum shortname/* * * DON'T EDIT BELOW THIS LINE * * */(function() {var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);})();</script><noscript>Please enable JavaScript to view the <a href='http://disqus.com/?ref_noscript'>comments powered by Disqus.</a></noscript><script type='text/javascript'>/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */var disqus_shortname = 'archer-1'; // required: replace example with your forum shortname/* * * DON'T EDIT BELOW THIS LINE * * */(function () {var s = document.createElement('script'); s.async = true;s.type = 'text/javascript';s.src = '//' + disqus_shortname + '.disqus.com/count.js';(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);}());</script></div><!-- نهاية تعليقات Disqus --></div></div></b:includable>
ونقوم باستبدال عبارة Archer-1 المكتوبة باللون الاحمر الى معرف حسابك في Disqus .
بعد ذلك نقوم بالبحث عن السطر <b:includable id='threaded_comments' var='post'> ونستبدله بالسطر التالي <b:includable id='threaded_comments' var='post'> , ثم نقوم بحفظ القالب وبذلك تكون قد انتهيت من تركيب ثلاثة انظمة للتعليقات في مدونتك .
0 تعليقات على " الطريقة الصحيحة لتركيب انظمة التعليقات في بلوجر "