تغيير شكل التعليقات بلوجر إلى شكل رائع





انشاء الله درس مفصل اليوم حنشرح طريقة فى ازاى نركب صندوق التعليق + الرد علىى التعليق يلا بينا نتابع







لنبدأ على بركة الله

المرحلة الأولى : ضبط إعدادت التعليقات المترابطة من لوحة التحكم
1 - قم بتسجيل الدخول إلى لوحة التحكم الخاص بمدونتك بلوجر.
2 - الأن توجه إلى إعدادت.
3 - بعد الدخول إلى إعدادات في القائمة الجانبية أنقر على أخرى.
4 - في السماح بخلاصات المدونة blog إجعلها كامل كما في الصورة بعدها قم بحفظ.





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











المرحلة الثانية: إضافة الكود code إلى القالب template
1-في لوحة التحكم الخاصة بمدونتك توجه إلى قالب template بعدها تحرير HTML ثم أنقر على متابعة.
2- ثم إعمل علامة على توسيع قوالب عناصر واجهة interface المستخدم.
3- الأن قم بالبحث عن :


رمز Code:
<b:include data='post' name='comments'/>
قم باستبداله بـهذا الكود code


رمز Code:
<b:if cond='dataost.showThreadedComments'> <b:include data='post' name='threaded_comments'/> <b:else/> <b:include data='post' name='comments'/></b:if>
ملاحظة : إذا وجدت كود codeين او اكتر استبدلهم جميعا



4-الأن قم بالبحث مرة أخرى عن :

رمز Code:
]]></b:skin>
وقم بإضافة الكود code قبله :

رمز Code:
.comments { clear: both; margin-top: 10px; margin-bottom: 0px; line-height: 1em; } .comments .comments-content { font-size: 14px; margin-bottom: 16px; font-family: Verdana; font-weight: normal; text-align:right; line-height: 1.4em; } .comments .continue a, .comments .comment .comment-actions a { display:inline; font-family:Arial, Helvetica, sans-serif; font-size:13px; padding: 2px 5px; text-decoration: none; text-shadow:0 1px 1px rgba(0,0,0,.3); color:#FFF; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2); box-shadow: 0 1px 2px rgba(0,0,0,.2); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-right: 10px; border: 1px solid #3079ED; background: #0066FF; background: -webkit-gradient(linear, left top, left bottom, from(#0099FF), to(#009999)); background: -moz-linear-gradient(top, #0099FF, #009999); filter: progidXImageTransform.Microsoft.gradient(startCo lorstr='#0099FF', endColorstr='#009999'); } .comments .continue a:hover, .comments .comment .comment-actions a:hover { text-decoration: none; background:#0099FF; background: -webkit-gradient(linear, left top, left bottom, from(#009999), to(#0099FF)); background: -moz-linear-gradient(top, #009999, #0099FF); filter: progidXImageTransform.Microsoft.gradient(startCo lorstr='#009999', endColorstr='#0099FF'); } .comments .continue a:active, .comments .comment .comment-actions a:active { position: relative; top:1px; background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#0099CC)); background: -moz-linear-gradient(top, #0066FF, #0099CC); filter: progidXImageTransform.Microsoft.gradient(startCo lorstr='#0066FF', endColorstr='#0099CC'); } .comments .comments-content .comment-thread ol { list-style-type: none; padding: 0; text-align: none; } .comments .comments-content .inline-thread { padding: 0.5em 1em 0 1em; } .comments .comments-content .comment-thread { margin: 8px 0px 0px 0px; } .comments .comments-content .comment-thread:empty { display: none; } .comments .comments-content .comment-replies { margin-top: 1em; margin-left: 40px; font-size:12px; } .comments .comments-content .comment { padding-bottom:8px; margin-bottom: 0px } .comments .comments-content .comment:first-child { padding-top:16px; } .comments .comments-content .comment:last-child { border-bottom:0; padding-bottom:0; } .comments .comments-content .comment-body { position:relative; } .comments .comments-content .user { font-style:normal; font-weight:bold; } .comments .comments-content .user a { color: #444; } .comments .comments-content .user a:hover { text-decoration: none; color: #555; } .comments .comments-content .icon.blog-author { width: 18px; height: 18px; display: inline-block; margin: 0 0 6px -4px; } .comments .comments-content .datetime { margin-left:6px; color: #999; font-style: italic; font-size: 12px; float: left; } .comments .comments-content .comment-content { font-family: Arial, sans-serif; font-size: 15px; line-height: 19px; } .comments .comments-content .comment-content { font-family: Arial, sans-serif; font-size: 15px; line-height: 19px; text-align:none; margin: 15px 0 15px; } .comments .comments-content .owner-actions { position:absolute; right:0; top:0; } .comments .comments-replybox { border: none; height: 250px; width: 100%; } .comments .comment-replybox-single { margin-top: 5px; margin-left: 48px; } .comments .comment-replybox-thread { margin-top: 5px; } .comments .comments-content .loadmore a { display: block; padding: 10px 16px; text-align: center; } .comments .thread-toggle { cursor: pointer; display: inline-block; } .comments .comments-content .loadmore { cursor: pointer; max-height: 3em; margin-top: 3em; } .comments .comments-content .loadmore.loaded { max-height: 0px; opacity: 0; overflow: hidden; } .comments .thread-chrome.thread-collapsed { display: none; } .comments .thread-toggle { display: inline-block; } .comments .thread-toggle .thread-arrow { display: inline-block; height: 6px; width: 7px; overflow: visible; margin: 0.3em; padding-right: 4px; } .comments .thread-expanded .thread-arrow { background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC&quot no-repeat scroll 0 0 transparent; } .comments .thread-collapsed .thread-arrow { background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==&quot no-repeat scroll 0 0 transparent; } .comments .avatar-image-container { float: right; overflow: hidden; } .comments .avatar-image-container img { width: 36px; } .comments .comment-block { margin-right: 48px; position: relative; padding: 20px 15px 20px 15px; background: #F7F7F7; border: 1px solid #E4E4E4; overflow: hidden; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-image: initial; }

وبكداا تم انتهاء الدرس مفصل بانتظر تعليقاتكم على معمل الالكترونيات

المصدر - تغيير شكل التعليقات بلوجر إلى شكل رائع | معمل الالكترونيات







©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©