تغيير شكل التعليقات في مدونة بلوجر إلى شكل إحترافي

بسم الله الرحمن الرحيم والصلاة علي رسول الله سيدنا محمد صلي الله عليه وسلم صله عليه اليوم اقدم لكم موضوع خاص ببلوجر عن طريقة تغير شكل التعليقات في مدونة بلوجر من مدونة عمرو ويب بطريقة جميلة غير تقليدية وافتراضية والان تابع معي شرح

اولا تقوم بذهاب الي <القالب<تحرير html ثم قم بضغط علي ctrl + f لتسهيل البحث عن الاكواد وابحث عن 

<b:include data='post' name='threaded_comments'/>

ثم قم بتغير الكود السابق بالكود التالي 

ثم قم بتغير الكود السابق بالكود التالي 

<b:include data='post' name='comments'/>

ثم ابحث عن الوسم ]]></b:skin الخاص بـcss وضع قبله الكود التالي 

#comment-editor{width:103%!important}
.comment-form{width:100%;max-width:100%}
#comments {}
#comments h3 {
margin-bottom:15px;
background: #343536;
padding: 10px 10px;
color: #fff;
font: normal 18px normal,Electrolize,ge_ss_threeregular;
}
.comment_avatar_wrap{
width:42px;
height:42px;
border: 1px solid #C4C4C4;
border-top-color: #E4E4E4;
border-right-color: #E4E4E4;
background:#fcfcfc;
padding:4px;
border-radius: 2px;
text-align:center;
margin-bottom:20px;
}
#comments .avatar-image-container {
float: right;
margin:0 0 0 10px;
width: 42px;
height: 42px;
max-width:42px;
max-height:42px;
padding: 0;
margin-bottom:10px;
}
#comments .avatar-image-container img {
width: 42px;
height: 42px;
max-width: 42px;
max-height: 42px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqpgG5goJQssSNXUEudBQbqLe52h_AAbWqnfxZ5H2Bj1KaR0Hq5uqnwfCwt1LtMJsxBxAPv1_zChv9j_yTFyjhLWoOTMBY5w8g7jfWUKAYBmzXDPASD3c78v0f3ER-lWBhCuHo-dmFdMyd/s1600/anon.jpg) no-repeat;
}
.comment_name a {
font-weight: bold;
padding:5px 0 0 0;
font-size: 13px;
text-decoration: none;
font-family: Electrolize,ge_ss_threeregular;
color: #fff;
}
.comment_admin .comment_name  {
font-weight: bold;
padding: 10px;
font-size: 13px;
text-decoration: none;
background:#EEEE83;
}
.comment_admin .comment_date  {
font-weight: normal;
font-size:11px;
}
.comment_name {
background:#E6E7E7;
padding:10px;
font-size:13px;
font-weight:bold;
position:relative;
}
.comment_service{
margin-top:5px
}
.comment_date {
color: #a9a9a9;
float:left;
font-size:11px;
font-weight:normal;
margin-top:-3px;
}
.comment_date a{
color: #fff;
float:left;
font-size:11px;
font-weight:normal;
}
.comment_date a:hover{
color: #a9a9a9;
text-decoration:none;
}
.comment_body{
margin-right:66px;
margin-top: -72px;
background:#fcfcfc;
border:1px solid #d1d1d1;
padding:10px;
border-radius: 2px;
}
.comment_body p {
line-height: 1.5em;
margin:5px 0 0 0;
color: #666;
border:1px solid #eee;
font-size: 13px;
word-wrap:break-word;
background:#fff;
padding:10px;
font-family: Electrolize,ge_ss_threeregular;
}
.comment_inner {
padding-bottom: 5px;
margin:5px 0 5px 0;
}
.comment_child .comment_wrap {padding-right: 7%;}
.comment_reply {
display: inline-block;
margin-top:8px;
margin-right:-5px;
padding: 1px 12px;
color: #fff !important;
text-align: center;
text-decoration: none;
border-radius: 2px;
background: #fff;
font: 11px/18px Electrolize,ge_ss_threeregular;
transition: background-color 1s ease-out 0s;
}

ثم قم بضغط علي حفظ النموذج وسوف تلاحظ تغير في شكل التعليقات واذا رائيت اي مشكلة في الاضافة قم بوضع تعليق واعملننا والان انتهي موضوعنا اتمني ان يكون قد نال اعجابكم انتظرونا في عديد من مواضيع وسلام عليكم ورحمته الله وبركاته

• شارك
• شارك
• شارك
• شارك

آدم مصطفى السبع

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