تغيير شكل التعليقات V2

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات

أهلا ومرحبا بكل زائر بمداونتكم المتواضعة 👔 نكمل اليوم مع إضافات بلوجر وخصيصا مع تغيير شكل التعليقات والتي سبق وقدمنا فيها الشكل الأول، الآن فيما يخص الشكل الثاني فهو جد مغاير لشكل الأول من حيث الإبتسامات 😊 وعرض التعليقات
نمط التعليق هذه المرة حديث جدا، بسيط وأنيق يحتوي على إبتسامات تويتر رموز تعبيرية جميلة كالتي هنا.
هل أنت مستعد لرؤية المعاينة؟ فلتتجه لزر 🚀 وجرب بنفسك

معاينة

شرح طريقة التركيب

1 . توجه لقالب >> تحرير
2. ابحث عن ]]></b:skin> ضع الكود التالي فوقه أو ضعه بين <style> </style> فوق </head>

/* CSS Comments Style2 Ar1web.com */
#allHolder {margin-right: 20px!important;}
#comments{  background: #fff;clear: both;margin: 10px 7px 0 9px;line-height: 1em;padding: 10px;border: 1px solid #eee;}
#comments h3{background:#fff;display:none;line-height:20px;margin-bottom:20px;margin-top:0;font-family:&#39;Open Sans&#39;,sans-serif;font-size:14px;position:absolute;color:#333;font-weight:700;text-transform:uppercase;padding:10px 20px 10px 50px;border:1px solid #eaeaea;}
#comments h3:before {font-family:fontawesome;content:&quot;\f086&quot;;margin-left:10px;font-size:20px;padding:10px 15px;position:absolute;right:0;top:0;}
.comment_avatar_wrap{border-radius:10%;width:46px;height:46px;border:none;background:none;text-align:center;padding:0;overflow:hidden;}
#comments .comment_avatar img {border-radius:100%;width:70px;height:70px;max-width:70px;max-height: 70px;float:right;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS2U7W_vCg9HV0jHkn3wmK_ZPXIeFLv1xWEIscPcccTQBpaDrpOsT5OnysiF5vWED1iyN5ZgLx_v0fWB7KCgY3PyNKe6xc3ES2VnpiD1ccY7YpJIpJ1KBOe0eBg3hHxyivH0hx9RAWmoD2/s1600/backcomments.png) no-repeat;overflow:hidden;}
.comment_avatar img{border-radius:10%;width:46px;height:46px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS2U7W_vCg9HV0jHkn3wmK_ZPXIeFLv1xWEIscPcccTQBpaDrpOsT5OnysiF5vWED1iyN5ZgLx_v0fWB7KCgY3PyNKe6xc3ES2VnpiD1ccY7YpJIpJ1KBOe0eBg3hHxyivH0hx9RAWmoD2/s1600/backcomments.png) no-repeat;overflow:hidden;}
.comment_name a{font-family:&#39;Open Sans&#39;,sans-serif;font-weight:700;font-size:15px;padding:5px 0;color:#333;text-decoration:none}
.comment_child .comment_name a{color:#333;}
.comment_child .comment_name a:hover {color:#07ACEC;}
.comment_admin .comment_name{background:#fff;padding:0 20px 0 15px;right:5px;top:10px;display:inline;font-weight:700;font-size:16px;font-family:&#39;Open Sans&#39;,sans-serif;text-decoration:none;border-radius:3px;}
.comment_admin .comment_date{font-weight:300;font-size:12px;}
.comment_name{font-size:16px;font-family:&#39;Open Sans&#39;,sans-serif;font-weight:700;padding:0 20px 0 20px;position:absolute;right:5px;top:10px;display:inline;line-height:35px;transition:all .3s ease-out;}
.comment_name:hover,.comment_name a:hover,.comment_admin .comment_name a:hover,.comment_admin .comment_name:hover{color:#07ACEC;}
.comment_service{position:absolute;top:-35px;left:0;z-index:9;}
.item-control {display:block;}
.comment_date a{font-size:11px;font-weight:400;text-transform:none;text-decoration:initial;
color:#aaa!important;text-align:center;padding:1px 6px;opacity:0.9;transition:all .3s ease-out;}
.comment_date a:hover{color:#07ACEC!important;}
.comment-delete{position:absolute;display:inline-block;z-index:1;top:40px;left:0;
color:#aaa!important;text-align:center;font-family:&#39;Open Sans&#39;;font-size:11px;padding:2px 6px;opacity:0.9;transition:all .3s ease-out;}
.comment-delete:hover{color:#07ACEC!important;}
.comment_body{margin:5px 0;padding:0;position:relative;}
.comment_king{margin:20px 0;margin-right:90px;padding:0;position:relative;border:1px solid #eee}
.comment_king:before, .comment_king:after {content: &quot; &quot;;border-top-color: transparent !important;border-bottom-color: transparent !important;border-right-color: transparent !important;border-left-color: #fff;border-style: solid;border-width: 8px;height: 0;width: 0;right: -16px;top: 20px;position: absolute;}
.kingz:before {border-color: #9E9E9E;}
.comment_body p{line-height:1.6em;color:#444;font-size:14px;font-family:cursive,&#39;Droid Arabic Naskh&#39;;word-wrap:break-word;padding:20px;padding-top:30px;position:relative;transition:all .3s ease-out;text-align: right;}
.comment_child .comment_body p{color:#444;}
.comment_body p img{vertical-align:middle;margin:0 5px;}
.comment_inner{padding-bottom:5px;margin:5px 0}
.comment_child .comment_wrap{padding-right:7%}
.comment_child .comment_body{margin-top:-15px;}
.comment_reply{display:inline-block;color:#555!important;text-align:center;
font-family:&#39;Open Sans&#39;;font-size:11px;margin:0;padding:4px 6px 6px 6px;opacity:0.9;border-radius:2px;position:absolute;top:40px;left:25px;}
.comment_reply:hover{text-decoration:none!important;color:#222!important;}
.comment-form{width:100%;max-width:100%;margin-bottom:10px;padding:0;}
.comment_form a{text-decoration:none;text-transform:uppercase;font-weight:700;font-family:Arial,Helvetica,sans-serif;font-size:15px;color:#444}
#comment-editor{width:103%!important;background:url(&#39;http://4.bp.blogspot.com/-jSUS8v5kwpQ/U8Z_6Ufr-PI/AAAAAAAAEYY/o4cQPKvt8vQ/s1600/loading.gif&#39;) no-repeat 50% 25%;position:relative;margin-right:-8px;margin-top:-15px}
.comment-form p{  position: relative;background: #fff;color: #908C8C;font-size: 14px;font-family: droid arabic kufi;line-height: 1.5em;padding: 15px;border: 1px solid #E5E5E5;transition: all .3s ease-out;text-align:right;}
.comment-form p:after, .comment-form p:before {top:100%;right:9%;border:solid transparent;
content:&quot; &quot;;height:0;width:0;position:absolute;pointer-events:none;}
.comment-form p:after {border-color:rgba(68,68,68,0);border-top-color:#fff;border-width:12px;margin-right:-12px;}
.comment-form p:before {border-color:rgba(221,221,221,0);border-top-color:#cdd5b7;border-width:13px;margin-right:-13px;transition:all .3s ease-out;}
.comment-form p:hover:before{border-top-color:#b9c1a3;}
.comment_reply_form{padding:0 0 0 7%}
.comment_reply_form .comment-form{width:100%}
.comment_emo_list .item{float:right;text-align:center;height:40px;width:41px;margin:0 0 10px;}
.comment_emo_list span{display:block;font-weight:400;font-size:11px;letter-spacing:1px;color:#444}
img.comment_emo { margin : 0; padding : 0; vertical-align : middle; width : 25px;height : 25px;}
.comment_youtube{max-width:100%!important;width:400px;height:225px;display:block;margin:auto}
.comment_img{max-width:100%!important}
#respond{overflow:hidden;padding-right:10px;clear:both}
.unneeded-paging-control,.comment_author_flag{display:none}
.comment_admin .comment_author_flag {display:inline-block;font-size:8px;color:#fff;background:#22A1C4;padding:5px;text-align:center;border-radius:4px;line-height:normal;font-family: cursive;}
.comment_child .comment_admin .comment_author_flag {color:#fff;}
.spammer-detected{font-size:14px!important;color:#fff!important;background:#5cb0d8!important;margin:25px;
display:inline-block;padding:10px 15px!important;}
.deleted-comment{display:block;color:#fff;word-wrap:break-word;background:#07A;margin-top:10px;padding:10px;font-size:14px; font-family:&#39;Open Sans&#39;,Helvetica,Arial,sans-serif;opacity:.99!important}
iframe{border:none;overflow:hidden}
.paging-control-container{text-align:center;margin:0 0 0 25%;}
.paging-control-container a{text-align:center;margin:0 auto;background:#444;padding:5px 10px;
color:#fff;transition:all .3s ease-out}
.paging-control-container a:hover{background:#e6ae48;color:#fff;}
.comment_header {padding:0;}
.comment_child .comment_header {padding:0;}
#konversi-box, #hide-konversi,#emo-box,#hide-emo {display:none}
#konversi-box {width:100%;color:#eee;background:none;line-height:1.6em;margin-bottom:20px;padding:0;text-align:right;}
.checkbox{font:11px Tahoma,Verdana,Arial,Sans-Serif;line-height:1.6em;color:#eee;}
#codes{border:none;width:100%;height:200px;display:block;background-color:#333;color:#aaa;font:normal 12px &#39;Courier New&#39;,Monospace;margin:7px 0 10px;padding:8px;box-shadow:inset 0 0 0 1px #ddd;transition:all 0.5s linear;}
#codes:focus{background-color:#303030;color:#aaa;border:none;outline:none;transition:all 0.3s linear;}
.button-group{float:left;text-align:right;margin:0 auto}
button,button[disabled]:active{border:none;font-size:12px;font-family:&#39;Open Sans&#39;;font-weight:400;padding:4px 10px;text-decoration:none;background:#eee;color:#aaa;display:inline-block;transition:initial;cursor:pointer;border:0;}
button:hover{background:#aaa;color:#fff;}
button:active{background:#aaa;color:#fff;}
button[disabled],button[disabled]:active{color:#fff;cursor:default}
#opt1,#opt2,#opt3,#opt4,#opt5{display:inline-block;vertical-align:middle;border:none;outline:none;margin:0 10px 0 0}
.small-button a,.small-button1 a {font-size:12px;cursor:pointer;font-weight:700;margin:10px 5px 5px 0;text-decoration:none;text-transform:none;text-shadow:none;display:inline-block;color:#fff;padding:4px 10px;cursor:pointer;border-radius:2px;transition: all 0.3s ease-out;}
.small-button1 a {background-color:#22a1c4;transition: all 0.3s ease-out;font-family: droid arabic kufi;}
.small-button1:hover a {background-color:#1D95B6;color:#fff;}
span.small-button,span.small-button1 {text-align: right;display: inline-block;float: left;margin-top: -10px;font-weight: normal;}

4. إبحث عن <b:includable id='comments' var='post'>...</b:includable> إذا لم تجده إبحث عنه هكذا <b:includable id='comments' var='post'>
5. حدد الكود بالكامل كما هو موجود بالأول وضع بدله هذا الكود:

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<b:if cond='data:post.allowComments'>
  <b:if cond='data:post.numComments != 0'>
   <h3>
    <b:if cond='data:post.numComments == 1'>1 <data:commentLabel/>:
     <b:else/>
     <data:post.numComments/> <data:commentLabelPlural/>
    </b:if>
   </h3>
  </b:if>
               
  <b:if cond='data:post.commentPagingRequired'>
   <span class='paging-control-container'>
    <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl' expr:title='data:post.oldestLinkText'><data:post.oldestLinkText/></a>
    &#160;
    <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl' expr:title='data:post.olderLinkText'><data:post.olderLinkText/></a>
    &#160;
    <data:post.commentRangeText/>
    &#160;
    <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl' expr:title='data:post.newerLinkText'><data:post.newerLinkText/></a>
    &#160;
    <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl' expr:title='data:post.newestLinkText'><data:post.newestLinkText/></a>
   </span>
  </b:if>
                       
  <div class='clear'/>
  <div id='comment_block'>
   <b:loop values='data:post.comments' var='comment'>
                                                                             
   <div data-level='0' expr:class='data:comment.adminClass' expr:id='data:comment.anchorName'>                                                                                      
      <b:if cond='data:post.adminClass == data:comment.adminClass'>
       &lt;div class=&#39;comment_inner comment_admin&#39;&gt;
       <b:else/>
                            &lt;div class=&#39;comment_inner&#39;&gt;
      </b:if>
         
    <div class='comment_body'>
<div class='comment_avatar'>
      <img alt='avatar' expr:src='data:comment.authorAvatarSrc' expr:title='data:comment.author'/>
              </div>
<div class='comment_king kingz'>
     <div class='comment_name'>
      <b:if cond='data:comment.authorUrl'>
       <a expr:href='data:comment.authorUrl' expr:title='data:comment.author' rel='nofollow' target='_blank'><data:comment.author/></a>
       <b:else/>
       <data:comment.author/>
      </b:if>
<span class='comment_date'><a expr:href='data:comment.url' rel='nofollow' title='comment permalink'>
                  <data:comment.timestamp/>
                </a></span>
<div class='comment_author_flag'>المشرف</div>
</div>
<span class='comment_service'>
<b:include data='comment' name='commentDeleteIcon'/>
<a class='comment_reply' expr:href='&quot;#r_&quot;+data:comment.anchorName' expr:id='&quot;r&quot;+data:comment.anchorName' onclick='javascript:Display_Reply_Form(this)' title='Reply'><i class='fa fa-reply'/></a>
  </span>
     <b:if cond='data:comment.isDeleted'>
      <span class='deleted-comment'><data:comment.body/></span>
      <b:else/>
      <p><data:comment.body/></p>

                        <div class='clear'/>
                    </b:if>                                    
      </div></div>                      
     <div class='clear'/>
     &lt;/div&gt;
     <div class='clear'/>
           
    <div class='comment_child'/>
    <div class='comment_reply_form' expr:id='&quot;r_f_&quot;+data:comment.anchorName'/>              
    </div>
   </b:loop>              
   </div>    
    <div class='clear'/>
    <b:if cond='data:post.commentPagingRequired'>
     <span class='paging-control-container'>
       <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl' expr:title='data:post.oldestLinkText'><data:post.oldestLinkText/></a>
       &#160;
       <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl' expr:title='data:post.olderLinkText'><data:post.olderLinkText/></a>
       &#160;
       <data:post.commentRangeText/>
       &#160;
       <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl' expr:title='data:post.newerLinkText'><data:post.newerLinkText/></a>
       &#160;
       <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl' expr:title='data:post.newestLinkText'><data:post.newestLinkText/></a>
     </span>
    </b:if>
    <div class='clear'/>
  <div class='comment_form' id='comment-form'>         
         
   <b:if cond='data:post.embedCommentForm'>
    <b:if cond='data:post.allowNewComments'>   
     <b:include data='post' name='threaded-comment-form'/>
       <b:else/>
       <data:post.noNewCommentsText/>
    </b:if>
    <b:else/>
    <b:if cond='data:post.allowComments'>
     <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' expr:title='data:postCommentMsg'><data:postCommentMsg/></a>
    </b:if>
   </b:if>
  </div>
 </b:if>
</div>                
       <script type='text/javascript'>
       //<![CDATA[
       if (typeof(jQuery) == 'undefined') {
 //output the script (load it from google api)
 document.write("<scr" + "ipt type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js\"></scr" + "ipt>");
}
       //]]>
       </script>
     
       <script async='async' src='//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js' type='text/javascript'/>
       <script type='text/javascript'>
      
         <b:if cond='data:post.numComments != 0'>
         var Items = <data:post.commentJso/>;
         var Msgs = <data:post.commentMsgs/>;
         var Config = <data:post.commentConfig/>;
        <b:else/>
         var Items = {};
         var Msgs = {};
         var Config = {&#39;maxThreadDepth&#39;:&#39;0&#39;};
        </b:if>
       //<![CDATA[
       //Global setting
        Config.maxThreadDepth = 3;//Kedalaman tingkat threaded comment
        Display_Emo = true;//Tampilkan emoticon? ketik "false" untuk menyembunyikan
        Replace_Youtube_Link = false;//Embed video YouTube, ketik "false" untuk mendisable
        Replace_Image_Link = false;//Auto replace link image,  ketik "false" untuk mendisable.
        Replace_Force_Tag = false;//Auto replace virtual tag contoh: [pre] menjadi <pre>, dan [/pre] menjadi </pre>, apabila salah menulis, tidak akan berfungsi
        Replace_Image_Ext = ['JPG', 'GIF', 'PNG', 'BMP'];//(support: jpg, gif, png, bmp),hanya berfungsi apabila Replace_Image_Link=true
      
        //Pengaturan Emoticon
        Emo_List = [
':)'   ,'http://twemoji.maxcdn.com/36x36/1f600.png',
':('   ,'http://twemoji.maxcdn.com/36x36/1f615.png',
'hihi'  ,'http://twemoji.maxcdn.com/36x36/1f601.png',
':-)'   ,'http://twemoji.maxcdn.com/36x36/1f60f.png',
':D'   ,'http://twemoji.maxcdn.com/36x36/1f603.png',
'=D'   ,'http://twemoji.maxcdn.com/36x36/1f62c.png',
':-d'   ,'http://twemoji.maxcdn.com/36x36/1f604.png',
';('   ,'http://twemoji.maxcdn.com/36x36/1f61e.png',
';-('   ,'http://twemoji.maxcdn.com/36x36/1f62d.png',
'@-)'   ,'http://twemoji.maxcdn.com/36x36/1f616.png',
':P'   ,'http://twemoji.maxcdn.com/36x36/1f61c.png',
':o' ,'http://twemoji.maxcdn.com/36x36/1f62e.png',     
':&gt;)','http://twemoji.maxcdn.com/36x36/1f606.png',     
'(o)' ,'http://twemoji.maxcdn.com/36x36/1f609.png',     
'[-(' ,'http://twemoji.maxcdn.com/36x36/1f614.png',     
':-?' ,'http://twemoji.maxcdn.com/36x36/2753.png', 
'(p)' ,'http://twemoji.maxcdn.com/36x36/1f619.png', 
':-s' ,'http://twemoji.maxcdn.com/36x36/1f625.png',
'(m)' ,'http://twemoji.maxcdn.com/36x36/1f620.png',
'8-)' ,'http://twemoji.maxcdn.com/36x36/1f60e.png',
':-t' ,'http://twemoji.maxcdn.com/36x36/1f624.png',
':-b' ,'http://twemoji.maxcdn.com/36x36/1f634.png',
'b-(' ,'http://twemoji.maxcdn.com/36x36/1f635.png',
':-#' ,'http://twemoji.maxcdn.com/36x36/1f637.png',
'=p~' ,'http://twemoji.maxcdn.com/36x36/1f35c.png',
'$-)' ,'http://twemoji.maxcdn.com/36x36/1f4b5.png',
'(y)' ,'http://twemoji.maxcdn.com/36x36/1f44d.png',
'(f)' ,'http://twemoji.maxcdn.com/36x36/1f33a.png',
'x-)' ,'http://twemoji.maxcdn.com/36x36/1f60d.png',
'(k)' ,'http://twemoji.maxcdn.com/36x36/1f496.png',
'(h)' ,'http://twemoji.maxcdn.com/36x36/1f44f.png',
'(c)' ,'http://twemoji.maxcdn.com/36x36/2615.png',
        ];
      
                             
                                //Config Force tag list, define all in lower case
                                Force_Tag = [
                                    '[pre]','<pre>',
                                    '[/pre]','</pre>',
                                    '<pre class="brush: plain; title: ; notranslate" title="">','&lt;code&gt;',
                                    '</pre>','</code>'
                                ];
    
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('3 o=\'.1c\';3 1b=$(\'#O-19\').G(\'A\');u 1l(F){3 1j=\' \\n\\r\\t\\f\\1D\\1G\\1F\\1E\\2l\\2k\\2i\\2f\\2c\\26\\25\\23\\1Y\\1S\\1N\\1L\\1H\\2v\\1M\\2p\\24\\22\\1R\';E(3 i=0;i<F.5;i++){9(1j.d(F.1Q(i))!=-1){F=F.b(0,i);11}}z F}$(\'#1P .1i p\').j(u(y,7){9(1J){3 l=\'1v://13.V.W/1y?v=\';3 8=7.d(l);D(8!=-1){1d=7.b(8);J=1l(1d);3 X=J.d(\'&\');3 N=\'\';9(X==-1){N=J.b(l.5)}Y{N=J.b(l.5,X)}3 1r=\'<1u B="1T" A="1v://13.V.W/1U/\'+N+\'?1V=1" 1W="0" 2w></1u>\';7=7.b(0,8)+1r+7.b(8+J.5);8=7.d(l);9(8==-1){l=\'1Z://13.V.W/1y?v=\';8=7.d(l)}}}9(21){3 Z=\'\';3 s=7;E(3 i=0;i<1w.5;i++){3 l=\'.\'+1w[i];3 m=s.C();3 8=m.d(l);D(8!=-1){k=s.b(0,8+l.5);m=k.C();3 q=\'2h://\';3 w=m.d(q);3 I=\'\';D(w!=-1){I=q.M();k=k.b(w+q.5);m=k.C();w=m.d(q)}q=\'2n://\';m=k.C();w=m.d(q);D(w!=-1){I=q.M();k=k.b(w+q.5);m=k.C();w=m.d(q)}9(I==\'\'||k.5<6){11}k=I+k;Z+=s.b(0,8+l.5-k.5)+\'<10 A="\'+k+\'" B="2r"/>\';s=s.b(8+l.5);m=s.C();8=m.d(l)}}7=Z+s}9(1A){3 5=x.5;9(5%2==1){5--}E(3 i=0;i<5;i+=2){3 S=\'<10 A="\'+x[i+1]+\'" B="1B"/>\';8=7.d(x[i]);D(8!=-1){7=7.b(0,8)+S+7.b(8+x[i].5);8=7.d(x[i])}}}9(1I){3 5=R.5;9(5%2==1){5--}E(3 i=0;i<5;i+=2){D(1){3 s=7.M();8=s.d(R[i]);9(8!=-1){7=7.b(0,8)+R[i+1]+7.b(8+R[i].5)}Y{11}}}}z 7});$(\'.1K\').j(u(y,7){9(1A){3 5=x.5;9(5%2==1){5--}3 12=\'\';E(3 i=0;i<5;i+=2){3 1e=\'<1f>\'+x[i]+\'</1f>\';3 S=\'<10 A="\'+x[i+1]+\'" B="1B"/>\';12+=\'<Q B="1O">\'+S+1e+\'</Q>\'}z 12}});$(\'.1g .1i p\').j(u(i,h){T=h.M();y=T.d(\'@<a U="#c\');9(y!=-1){14=T.d(\'</a>\',y);9(14!=-1){h=h.b(0,y)+h.b(14+4)}}z h});u 1k(g){r=g.d(\'c\');9(r!=-1)g=g.b(r+1);z g}u 1m(g){g=\'&1X=\'+g+\'#%1n\';1o=1b.20(/#%1n/,g);z 1o}u 1p(){j=$(o).j();$(o).j(\'\');o=\'.1c\';$(o).j(j);$(\'#O-19\').G(\'A\',1b)}u 1q(e){g=$(e).G(\'15\');g=1k(g);j=$(o).j();9(o==\'.1c\'){1s=\'<a U="#1t" 27="1p()">\'+28.29+\'</a><a 2a="1t"/>\';$(o).j(1s)}Y{$(o).j(\'\')}o=\'#2b\'+g;$(o).j(j);$(\'#O-19\').G(\'A\',1m(g))}16=2d.2e.U;17=\'#O-2g\';18=16.d(17);9(18!=-1){1x=16.b(18+17.5);1q(\'#2j\'+1x)}E(3 i=0;i<P.5;i++){9(\'1z\'2m P[i]){3 g=P[i].1z;3 1a=2o($(\'#c\'+g+\':L\').G(\'1C\'));$(\'#c\'+g+\' .2q:L\').j(u(y,7){3 H=P[i].15;9(1a>=2s.2t){$(\'#c\'+H+\':L .2u\').1h()}3 K=$(\'#c\'+H+\':L\').j();K=\'<Q B="1g" 15="c\'+H+\'" 1C="\'+(1a+1)+\'">\'+K+\'</Q>\';$(\'#c\'+H).1h();z(7+K)})}}',62,157,'|||var||length||oldhtml|check_index|if||substring||indexOf|||par_id|||html|img_src|search_key|upper_html||Cur_Cform_Hdr||http_search||temp_html||function||find_http|Emo_List|index|return|src|class|toUpperCase|while|for|str|attr|child_id|save_http|yt_link|child_html|first|toLowerCase|yt_code|comment|Items|div|Force_Tag|img_html|temp|href|youtube|com|yt_code_index|else|save_html|img|break|newhtml|www|index_tail|id|cur_url|search_formid|search_index|editor|par_level|Cur_Cform_Url|comment_form|ht|img_code|span|comment_wrap|remove|comment_body|whitespace|Valid_Par_Id|trim|Cform_Ins_ParID|7B|n_cform_url|Reset_Comment_Form|Display_Reply_Form|yt_video|reset_html|origin_cform|iframe|http|Replace_Image_Ext|ret_id|watch|parentId|Display_Emo|comment_emo|level|x5b|x7d|x7c|x5d|u2008|Replace_Force_Tag|Replace_Youtube_Link|comment_emo_list|u2007|u200a|u2006|item|comment_block|charAt|u3000|u2005|comment_youtube|embed|autohide|frameborder|parentID|u2004|https|replace|Replace_Image_Link|u2029|u2003|u2028|u2002|u2001|onclick|Msgs|addComment|name|r_f_c|u2000|window|location|xa0|form_|HTTP|x0b|rc|x3e|x3c|in|HTTPS|parseInt|u200b|comment_child|comment_img|Config|maxThreadDepth|comment_reply|u2009|allowfullscreen'.split('|'),0,{}))   
var avatar=$("#comments");
avatar.find('.comment_avatar img').each(function() {
        var ava = $(this).attr('src');
        $(this).show().attr('src', ava.replace(/\/s[0-9]+(\-c)?\//,"/s100-c/"));
});      
    //]]>
</script>
</b:includable>

6. إبحث عن <b:includable id='threaded-comment-form' var='post'>...</b:includable> ثم غيره بالكود التالي:

<b:includable id='threaded-comment-form' var='post'>
  <div class='comment-form'>
<div id='form-wrapper'>
    <b:if cond='data:mobile'>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>
      
        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>

        <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>

      <iframe class='blogger-iframe-colorize blogger-comment-from-post' height='410' id='comment-editor' name='comment-editor'/>

        </b:if>

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

        <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;postID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>

      <iframe class='blogger-iframe-colorize blogger-comment-from-post' height='410' id='comment-editor' name='comment-editor'/>

        </b:if>
    <b:else/>
<div id='threaded-comment-form'>
      <p><data:blogCommentMessage/>
<span class='small-button1'>
<span id='show-emo'><a class='emo-button' href='javascript:void(0)' onclick='document.getElementById(&apos;emo-box&apos;).style.display=&apos;inline-block&apos;;document.getElementById(&apos;hide-emo&apos;).style.display=&apos;inline-block&apos;;document.getElementById(&apos;show-emo&apos;).style.display=&apos;none&apos;' title='إظهار'>عب&#1617;ر عن تعليقك</a></span><span id='hide-emo'><a class='emo-button' href='javascript:void(0)' onclick='document.getElementById(&apos;emo-box&apos;).style.display=&apos;none&apos;;document.getElementById(&apos;hide-emo&apos;).style.display=&apos;none&apos;;document.getElementById(&apos;show-emo&apos;).style.display=&apos;inline-block&apos;' title='إخفاء'>الإبتسامات</a></span>
</span>
  </p>
<div id='emo-box'>
  <div class='comment_emo_list'/>
</div>
      <data:blogTeamBlogMessage/>
      
        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>

        <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>

      <iframe class='blogger-iframe-colorize blogger-comment-from-post' height='410' id='comment-editor' name='comment-editor'/>

        </b:if>

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

        <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;postID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>

      <iframe class='blogger-iframe-colorize blogger-comment-from-post' height='410' id='comment-editor' name='comment-editor'/>

        </b:if>
      </div>
    </b:if>
</div>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>
</b:includable>

إذا واجهت مشكلة في المظهر فتأكد من حذف ستايل التعليقات القديمة

ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 22 تعليقًا:

ahmed el naddar8/04/2015
رائع
ردحذف
الردود
ahmed el naddar8/05/2015
كتبت رمز من الرموز ولم يعمل
ردحذف
الردود
ahmed el naddar8/05/2015
اذا كان بالامكان حسابك على فيس بوك فلدى عمل رائع مشترك بينى وبينك
ردحذف
الردود
Thameur9/09/2015
الرموز لم تضهر
ردحذف
الردود
Karim Mahran‏9/28/2015
لدى مشكلة كبيرة فى الاضافه هذه
عملت كل الخطوات بانتظام
وحذفت اكواد التعليقات القديمة والمشكلة نفسها عندى
الخط بتاع المشاركة بايظ وايضا الرموز مش موجودة
http://www4.0zz0.com/2015/09/28/14/459708398.png
ردحذف
الردود
Ali Tariq9/28/2015
السلام عليكم اخي لم اجد كود ... في تحرير html ممكن الحل
ردحذف
الردود
Karim Mahran‏9/30/2015
الرموز ظهرت لما حذفت هذه الأكواد:
#konversi-box, #hide-konversi, #emo-box, #hide-emo {
display: none;
}

.comment_emo_list {
display: none;
}

ولاكن شكل الخط بايظ كما هوه
http://www11.0zz0.com/2015/09/30/15/500937152.png
ردحذف
الردود
Karim Mahran‏10/05/2015
هل يوجد حل لشكل الخط هذا اخى
http://www11.0zz0.com/2015/09/30/15/500937152.png
ردحذف
الردود
Unknown11/04/2015
أخى يا ريت شكل التعليق لمدونة عرب ويب
ردحذف
الردود
Ahmed Magdy12/21/2015
هل يمكن ان اجعلك مدير في موقعي وتقوم باضفتها
ردحذف
الردود
Unknown1/08/2016
انا عملت كل حاجه طهر المربع بتاعها بس ومفيش ابتسامات جواه
وخفت تعليقات الفيس بوك اللى مع تعليقات بلوجر
ردحذف
الردود
K1031/11/2016
السلام عليكم اخي حسام الاضافه لا تعمل على هذا القالب برجاء تركيب التعليقات ووضع ربط التحميل في تعليق انا في الانتظار http://www.ar1web.com/2014/09/tempalte-lycoris-for-blogger.html
ردحذف
الردود
خالد اندرويد9/20/2016
اجعلك مدير وتضيفها لمدونتي
ردحذف
الردود
غير معرف3/02/2017
اخي خربت مدونتي ممكن تعطيني الكود الخاص بالتعليقات القديمة لقالب ادوات
ردحذف
الردود
Islam Kamel3/02/2017
طبقت كل الخطوات ولكن تعليقات فيس بوك اختفت
ردحذف
الردود