غير شكل التعليقات في مدونتك إلى شكل رائع

الآن بإمكانك تركيب الشكل الجديد للتعليقات أسفل التدينات على مدونات البلوجر وبشكل رائع وأنيق ويستحق الإضافة لكون الألوان التي يتكون منها رائعة تفظي جمالية على قالبك.

لتركيب هاته الإضافة :

1. قم بالذهاب للوحة التحكم بمدونتك

2. ثم إختر قالب من القائمة الجانبية

3. ثم إختر تحرير HTML

4. بعد ذلك قم بالبحث في القالب عن:

]]></b:skin>

بإستعمال CTRL+F

5. قم بنسخ ولصق الكود التالي فوق الكود الذي وجدته:

.comments-tabs.simpleTab .tab-content{background-color:transparent;padding:0;margin-top:20px}
.comments-tabs.simpleTab{border:1px solid #EEE;padding:15px;margin-top:25px;margin-bottom:25px}
.comments-tabs.simpleTab .tab-wrapper li a{border-radius:3px;text-transform:uppercase;background-color:#BBB}
.comments-tabs.simpleTab .tab-wrapper li a.activeTab{background-color:$(main.color)}

.comment-form p{background:#fff;padding:5px;width:98%;border:1px solid #f1f1f1;color:#777;font:14px Droid Arabic Naskh;margin:0 auto;margin-top:10px;line-height:21px;}
.comment-form p:before{content:'\f05a';float:right;font:39px fontawesome;width:41px;color:#ccc;height:41px;margin:0 5px;}
.comments-content{background:#f9f9f9;padding:5px;border:1px solid #DDD;margin:5px;position:relative;}
.comments .avatar-image-container{float:right;max-height:50px;overflow:hidden;width:50px;padding:2px;background:#fff;border:1px solid #eee;margin:0 7px;}
.comments .avatar-image-container img{width:100%;max-width:100%;}
.comments .comment-block {
background: none repeat scroll 0% 0% #F6F6F6;
margin: 0px 73px 0 14px !important;
position: relative;
border: 1px solid rgba(200, 200, 200, 0.54);
color: #818F96;
}
.comment-header a {
color: #999;
text-shadow: 1px 1px #FFF;
font-size: 13px;
font-weight: 100;
line-height: 1.6;
font-family: ge_hiliregular;
}
.comments .comment-block:after {
content: "";
position: absolute;
bottom: -3px;
right: 0px;
color: #468847;
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNsC-1x6v6M6a0js8qiz8Hie1MrODs0euk6o1bL83otp7XjQJoUQFpYWHsMCVoiTdAduoYI18yly9HzClZ04pCiMJdbd3L4r6tOWh6uvssvpb-n7IdFyXglg9UvD5rPOfbYWqLsIjJgPw/s1600/bg_color.png') repeat scroll 0% 0% transparent;
height: 3px;
width: 100%;
}
.comments .comments-content .comment:first-child {
padding-top: 0px;
}
.comments .comments-content .comment {
margin-bottom: 3px;
padding-bottom: 0px;
}
.comment-header{display:inline-block;border:1px solid #eee;border-right:0;border-top:0;padding:1px 10px 0 10px;}
.comments .comment-block:before{content:'\f0da';position:absolute;font:30px fontawesome;top:15px;right:-11px;color:#E8E8E8;}.comment-content{padding:20px;}
.comment-actions a{
background:#fff;
color:#6F6F6F;
padding:0 10px;
padding-top:2px !important;
padding-left:10px !important;
font-size:12px !important;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
margin:2px;
border:1px solid #eee;
display:inline-block;
}
.comments .comments-content .user a {
float: right;
margin: -1px -10px 0px 10px;
padding: 0px 5px;
height: 23px;
color: #468847;
background-color: #DFF0D8;
border-color: #D6E9C6;
}
.comments .comments-content .user a:before{
content:'\f0d9';
font: 19px fontawesome;
float: left;
position: relative;
left: -12px;
top: 2px;
color: #DFF0D8;
text-shadow: none;}
.comments .comments-content .user a:after{
content:'\f14b';
font: 17px fontawesome;
float: right;
margin: 0px 0px 0px 8px;
position: relative;
top: 2px;
padding: 0px 2px;
color: #468847;
text-shadow: none;
}
.comments .item-control {
display: inline-block;
}

.comments .continue a {
font-family:normal 14px GESSTwoMediumRegular,tahoma, arial;
font-size:12px;
font-weight:normal;
color:#888888;
}
.comments .comment-actions a,.comments .comment-replies .comment-actions a {
margin-top:8px;
margin-bottom:8px;
}
.comments .comment .comment-actions a,.comments .comment .comment-replies .comment-actions a {
font-weight: normal;
padding: 3px 15px;
background: #fff;
color: #6F6F6F;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: 2px;
border: 1px solid #eee;
display: inline-block;
font-family: ge_hiliregular;
font-size: 15px;
}
.comments .comment-actions a:before {
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
line-height:11px;
font-size:11px;
color:#888;
}
.comments .comment-actions a:before {
content:"\f112";
margin: 0 0 0 5px;
color: #888 !important;
}
.comments .continue a:before {
font-family:FontAwesome;
font-style:normal;
font-weight:normal;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
line-height:11px;
font-size:11px;
color:#888;
}
.comments .continue a:before {
content:"\f112";
color: #888 !important;
}
span.item-control.blog-admin a:before{content:'\f014';font:14px fontawesome;margin:0 0 0 5px;color:#ccc;}
.comments .continue a{background:#fff;color:#6F6F6F;padding:3px 10px!important;font-size:15px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;font-weight:500!important;border:1px solid #eee;display:inline-block;font-family: ge_hiliregular;}
.comments .continue a:before{content:'\f124';font:12px fontawesome;margin:0 0 0 10px;display:inline-block;color:#ccc;}
.comments .comment .comment-actions a:hover,.comments .continue a:hover{
text-decoration:none;background:#eee;}
.comments {
background: none repeat scroll 0% 0% #F9F9F9;
padding: 15px;
border: 1px solid #DDD;
margin: 5px 0 0 0;
position: relative;
}

.feed-links {
display: none;
}
.top-comment-widget-menu {
background: none repeat scroll 0px 0px #FFF;
border-color: #DDD;
border-style: solid;
border-width: 1px 1px 5px;
float: right;
margin: 20px 0px;
width: 953px;
}
.top-comment {
float: right;text-align: center;
font-family: "ge_ss_threeregular";
font-size: 14px;
list-style: none outside none;
margin: 10px 0;
text-transform: uppercase;
width: 50%;
cursor: pointer;
}
.top-comment.selected {
cursor: pointer;
}
#comments h4 {
display: inline;
padding: 4px 8px;
line-height: 45px;
}
#comments h4,.comments.comment-header,.comments .comment-thread.inline-thread .comment{position:relative}#comments h4{background:#73C4D1}
#comments h4{font-size:17px}
#comments h4{font-weight:normal;color:#fff}
#comments h4:after {
content: "";
position: absolute;
bottom: -10px;
right: 10px;
border-top: 10px solid #73C4D1;
border-left: 20px solid transparent;
width: 0px;
height: 0px;
line-height: 0;
}
.icon.blog-author:after {
content: "الكاتب";
background: #f66;
color: #FFF;
padding: 2px 16px;
border-radius: 1px;
position: absolute;
left: 0px;
margin-top: -3px;
font-size: 14px;
font-family: ge_hiliregular;
}
.comment-content {
padding: 20px;
font-family: ge_hiliregular;
}
.top-comment.blogico:before {
content: "\f0d5";
font-family: fontawesome;
font-size: 18px;
margin-left: 15px;
color: #F66;
}
.top-comment.faceico:before {
content: "\f09a";
font-family: fontawesome;
font-size: 18px;
margin-left: 15px;
color: #627AAC;
}
.comments .comments-content .comment:first-child{padding-top:0}

6. قم بحفظ قالب ومبروك عليك الإضافة.

كلمات دلالية:

قالب, قوالب بلوجر, لوجر, بلوجر, تعريب, قوالب معربة , قوالب مدفوعة, قوالب مجانية, سكربت, سكربتات, سكربتات مدفوعة, سكربتات مجانية, قوالب عربية, تعريب قوالب, برمجة, قوالب لمنصة بلوجر,إضافات, تصاميم, مونتاج, إنتروهات, فيديوهات, مجانيات, مسابقات, ووردربيس, ثيمات,

غير شكل التعليقات في مدونتك إلى شكل رائع

0 التعليقات:

إرسال تعليق

الأكتر تصفحا هذا الشهر

التسميات

عن المدونة

إتصل بنا

الأكتر مشاهدة هذا الأسبوع