24‏/07‏/2015

أهلا ومرحبا بكل زائر بمداونتكم المتواضعة 👔 نكمل اليوم مع إضافات بلوجر وخصيصا مع تغيير شكل التعليقات والتي سبق وقدمنا فيها الشكل الأول، الآن فيما يخص الشكل الثاني فهو جد مغاير لشكل الأول من حيث الإبتسامات 😊 وعرض التعليقات
نمط التعليق هذه المرة حديث جدا، بسيط وأنيق يحتوي على إبتسامات تويتر رموز تعبيرية جميلة كالتي هنا.
هل أنت مستعد لرؤية المعاينة؟ فلتتجه لزر 🚀 وجرب بنفسك
شرح طريقة التركيب
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(http://2.bp.blogspot.com/-KuovGZ0IXEU/VWMIvvKg90I/AAAAAAAACKY/5wV_WOXY2TI/s1600/backcomments.png) no-repeat;overflow:hidden;}
.comment_avatar img{border-radius:10%;width:46px;height:46px;background:url(http://2.bp.blogspot.com/-KuovGZ0IXEU/VWMIvvKg90I/AAAAAAAACKY/5wV_WOXY2TI/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. ابحث عن ]]></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(http://2.bp.blogspot.com/-KuovGZ0IXEU/VWMIvvKg90I/AAAAAAAACKY/5wV_WOXY2TI/s1600/backcomments.png) no-repeat;overflow:hidden;}
.comment_avatar img{border-radius:10%;width:46px;height:46px;background:url(http://2.bp.blogspot.com/-KuovGZ0IXEU/VWMIvvKg90I/AAAAAAAACKY/5wV_WOXY2TI/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>
إذا واجهت مشكلة في المظهر فتأكد من حذف ستايل التعليقات القديمة
20 Blogger تعليقات
Disqus
20 التعليقات
المشرف
avatar
المشرف
avatar

كتبت رمز من الرموز ولم يعمل

المشرف
avatar

اذا كان بالامكان حسابك على فيس بوك فلدى عمل رائع مشترك بينى وبينك

المشرف
avatar

تواصل عبر صفحتنا

المشرف
avatar
المشرف
avatar

احذف اكواد التعليقات القديمة بالبحث عن /* CSS Comments */ ثم حدد منه حتى هذا
.pencet:hover{background-color: #C84031;}

المشرف
avatar

لدى مشكلة كبيرة فى الاضافه هذه
عملت كل الخطوات بانتظام
وحذفت اكواد التعليقات القديمة والمشكلة نفسها عندى
الخط بتاع المشاركة بايظ وايضا الرموز مش موجودة
http://www4.0zz0.com/2015/09/28/14/459708398.png

المشرف
avatar

السلام عليكم اخي لم اجد كود ... في تحرير html ممكن الحل

المشرف
avatar

عليكم السلام ممكن تحدد أكثر؟

المشرف
avatar

احذف هذه الأكواد:
#konversi-box, #hide-konversi, #emo-box, #hide-emo {
display: none;
}

.comment_emo_list {
display: none;
}

المشرف
avatar

الرموز ظهرت لما حذفت هذه الأكواد:
#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

المشرف
avatar

اضف الكود التالي فوق </head>
<link href='http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css' rel='stylesheet' type='text/css'/>

المشرف
avatar

هل يوجد حل لشكل الخط هذا اخى
http://www11.0zz0.com/2015/09/30/15/500937152.png

المشرف
avatar

أخى يا ريت شكل التعليق لمدونة عرب ويب

المشرف
avatar
المشرف
avatar

هل يمكن ان اجعلك مدير في موقعي وتقوم باضفتها

المشرف
avatar

حسنا فقط اضفني وسأركبها لك عندما انتهي من أعمالي : info@ar1web.com

المشرف
avatar

انا عملت كل حاجه طهر المربع بتاعها بس ومفيش ابتسامات جواه
وخفت تعليقات الفيس بوك اللى مع تعليقات بلوجر

المشرف
avatar

السلام عليكم اخي حسام الاضافه لا تعمل على هذا القالب برجاء تركيب التعليقات ووضع ربط التحميل في تعليق انا في الانتظار http://www.ar1web.com/2014/09/tempalte-lycoris-for-blogger.html

المشرف
avatar

اجعلك مدير وتضيفها لمدونتي

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة