إضافة تعليقات بلوجر وجوجل بلس معا فى مدونات بلوجر

إضافة تعليقات بلوجر وجوجل بلس معا فى مدونات بلوجر

بسم الله وصلاة وسلام على رسول الله اما بعد، احبتي متابعي مدونة هشام هاشم للملعوميات والتقنيات ، اليوم في قسم دروس بلوجر سوف نقدم لكم احد الخدمات التي يكون عليها الطلب كثيرا لانها ضرورية في اي قالب بلوجر ، وهذه الخدمة التي في صدد تقديمها لن تكون فقط في اضافة تعليق بلوجر بل حتى اضافة تعليق جوجل + بطريقة احترافية ، وهذا ما سوف نتعرف عليه في هذه التدوينة المباركة .

العديد من مستخدمي بلوجر تعاني من مشكلة ربما تجعلهم يغيرون القالب من اجلها ولو كان القالب من افضل القوالب شكلا ، وهذه المشكلة في الحقيقة قليل من يقع فيها لان غالب المحترفين يركزون على اظهار صندوق التعليق الخاص بمدونة بلوجر او اي موقع ، ولكن هذا لا يدل على ان قوالب بلوجر تتوفر على صندوق التعليق الخاص بي بلوجر او حتى جوجل + ، ولهذا احيانا تكون ملزم بالبحث عن حل مشكلة عدم ظهور صندوق التعليقات في اسفل مواضيع المدونة .

لاشك انك تقدم وتنشر العديد من المواضيع في العديد من المجالات التي ينتفع بها الناس ، ولكن الناس احيانا تريد ان تقدم لك الشكر على العمل وربما هناك من لم يفهم الموضوع ، كما يمكنك اضافة تعليق خاص بكلمة مفتاحية ، ولكن بدون اضافة صندوق التعليقات سواء الخاص بي بلوجر و جوجل بلس او حتى الفيس بوك لا يمكن ان تجد تفاعل مع الزوار ، ولهذا سوف نقدم لكم حل هذه المشكلة التي يعاني منها من لا يتوفر على اداة التعليقات .

ولكن هذه المره سوف نقدم لكم اضافة في منتهى الروعة ، وهي اضافة تعليقات بلوجر مع صندوق تعليقات جوجل + في مكان واحد بطريقة جد احترافية ، كما ان هذه الاضافة يمكن ان يستعملها اي مدون ولو كان يتوفر على صندوق تعليقات بلوجر سابقا .

إضافة تعليقات بلوجر وجوجل بلس معا فى مدونات بلوجر :

اولا يجب عليك ان تدخل الى المدونة ثم تختار الاعدادات و تقوم بإلغاء تعليق +google بتغير كلمة " نعم " الى " لا " كما في الصورة .

1 - بعدها ندخل الى القالب >> تحريرHTML >> بعدها نفتح اداة البحث عن طريق نقر على CTRL+F ونبحث عن كود <b:include data='post' name='post'/>

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

<!-- start blogger and google comments by www.info-sati.com -->
<b:if cond='data:blog.pageType == "item"'>
<style>#comments, #gplus-comments-visibility {display:none;} .comments-icons {background: #fff no-repeat; font-size: 20px; font-family: "Arial Narrow",Arial,sans-serif; color: #555; font-weight: bold; padding: 12px 15px 0; height: 44px; } .comments-icons a img {vertical-align: middle;}</style>
<div class='comments-icons'>
اظهر تعليقات : جوجل بلس <a class='show-hide-comments' href='javascript:void();' onclick='$("#gplus-comments-visibility").slideToggle();$("#comments").hide();'><img class='gplus-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqjc4NwpQZg-plnbbZ09IY8olWqdSmSjTdxc3s1mTIZ_GbfRvFelC16I9Tt_XY-Ny8AqakaIW8fL7lgUxEjnnOhKfzOiuwARFKz6jJfx9PueDwuYmE_GkUmM-F0KKfyZS5naBeCXU8d0tI/s1600/google-plus-logo.png' width='35'/></a>  تعليقات بلوجر <a class='show-hide-comments' href='javascript:void();' onclick='$("#comments").slideToggle();$("#gplus-comments-visibility").hide();'><img class='blogger-icon' height='35' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk3c2DD9lmMI6oblc59lUOAsRdWo70LTX6jRkCSDW7PBsGl1idbh11QPrPASIWAmCuXBzOJka5hXMVY_84WvjZ_QzX87A_oeh1Xex8f88g7qxeJIKkLROlGX8w6_fElTUjGByBaujBxz3I/s1600/blogger-logo.png' width='35'/></a>
</div>
<div id='gplus-comments-visibility'>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='725' expr:data-href='data:post.url'/>
</div>
</b:if>
<!-- end blogger and google comments by www.info-sati.com -->

العملية الثانية :

ايضا هناك طريقة اخرى نفعت مع احد القوالب ولم تنفع مع بعض القوالب اخرى .

نقوم بالبحث عن هذا الكود : <b:includable id='threaded_comments' var='post'> ونحدده الى ان نصل كود </b:includable> ونستبدله بهذا الكود .

<b:includable id='threaded_comments' var='post'>
  <div id='com-header'>
<h6>
قم بالتعليق بواسطة</h6>
<img class='com-on' id='com-norm' src='https://lh3.googleusercontent.com/-nfrkoUYsV-E/UXVi6W7CI8I/AAAAAAAAILo/uCS3thePKXU/s50/blogger_on.png' title='تعليقات بلوجر'/><h6>
أو</h6>
<image id='com-gplus' src='http://lh6.googleusercontent.com/-wnTb7SHAGEE/UXVi6xoHXAI/AAAAAAAAILY/6vx5Em5w8MI/s50/plus_off.png' title='تعليقات جوجل بلس'/><h6>
اختر نوع التعليق الذي يعجبك</h6>
<div id='copyrigtsmbl'>
<a href='http://www.abu-iyad.com' id='mblrights'>احصل على هذه الإضافة</a></div>
</div>
<div id='comment-zone'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <h4>
<data:post.commentLabelFull/>:</h4>
<div class='comments-content'>
      <b:if cond='data:post.embedCommentForm'>
        <b:include data='post' name='threaded_comment_js'/>
      </b:if>
      <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:if cond='data:post.showBacklinks'>
         <b:include data='post' name='backlinks'/>
       </b:if>
    </div>
</div>
</div>
<div id='gcontainer'>
<div id='gcomments'/>
</div>
<script src='http://apis.google.com/js/plusone.js'/>
<script src='https://googledrive.com/host/0B0WJjcJEFNziQU01STJVc3RzeWc'/>
<style>
#gcontainer {
display:none;
  }
#com-norm,#com-gplus {
cursor:pointer;
padding:0 5px;
float:right
  }
#com-header {
border: 1px solid #d2d2d2;
padding: 10px;
float: right;
width: 580px;
margin-bottom: 20px;
background: #f5f5f5;
  }
#com-header h6{
font-size: 16px;
text-transform: uppercase;
font-weight: bold;
float: right;
padding-top: 15px;
margin: 0px;
margin-right: 7px;
margin-left: 7px;
  }
#copyrigtsmbl {
float: left;
margin-top: 20px;
border-top: 1px solid #d2d2d2;
margin-right: -10px;
padding-right: 10px;
padding-top: 5px;
padding-left: 10px;
border-left: 1px solid #d2d2d2;
padding-bottom: 5px;
margin-bottom: -10px;
font-size:11px;
background: #fff;
  }
#copyrigtsmbl a {
text-decoration:none;
color:111!important;
  }
</style>
</div>
</b:includable>

ثم نقوم بالبحث عن كود : <b:includable id='comment_picker' var='post'> ونحدده الى ات تصل كود </b:includable> ونستبدله بهذا الكود .

<b:includable id='comment_picker' var='post'>
  <b:if cond='data:post.forceIframeComments'>
    <b:include data='post' name='iframe_comments'/>
    <b:if cond='data:post.showThreadedComments'>
      <b:include data='post' name='threaded_comments'/>
    <b:else/>
      <b:include data='post' name='comments'/>
    </b:if>
  <b:else/>
    <b:if cond='data:post.commentSource == 1'>
      <b:include data='post' name='iframe_comments'/>
    <b:else/>
      <b:if cond='data:post.showThreadedComments'>
        <b:include data='post' name='threaded_comments'/>
      <b:else/>
        <b:include data='post' name='threaded_comments'/>
      </b:if>
    </b:if>
  </b:if>
</b:includable>

ومن هنا ننتهي من الدرس .

وهذا مثال في كلمة تحديد من <b:includable id='comment_picker' var='post'> الى </b:includable> التي ذكرت لكم اذا شتكل عنك الامر .