-->

اضافت شكل تعليقات موقع نت مصر 2016





اضافت شكل تعليقات موقع نت مصر 2016
اليوم اشرح ان شاء الله كود CSS لتجديد شكل صندوق التعليقات الخاص بالمدونة إضافة الى ADMIN ,
وخاصة صندوق التعليقات الذي يعتبر واجهة وعلاقة الزائر بالمدونة. الصورة فى أول التدوينة 
هى النتيجة لهذا الكود اذا أعجبتك قم بإضافتها


شرح و كيفية تركيب الاضافة :
    1. داخل القالب تحرير html
    2. فوق هذا الوسم  <b:skin/>  نضع الكود التالي
/* CSS Comments */ #comments{background:#fff;clear:both;margin:20px 10px;line-height:1em;padding:20px;border:1px solid #e9e9e9;} #comments h3{ font-size: 20px; background: #128DC4; color: #FFF; padding: 11px 0px; width: 766px;} #emo-box {clear: both;margin: 0 30px;}#comments .click-comment{background:#fff;color:#fff;float:left;text-decoration:none;display:inline;line-height:20px;margin-bottom:20px;margin-top:-20px;margin-left:-20px;font-family:Lobster,ge_dinar_tworegular,sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;padding:10px 0;border:1px solid #e9e9e9;border-top:none;border-left:none;} .fa-arrow-circle-down:before {content: "\f0ab";color: #999999;margin-left: 35px;font-size: 18px;} .comment_avatar_wrap{ height: 60px;} #comments .comment_avatar {position: absolute; overflow: hidden; top: 0;} .comment_avatar img{ height: 60px; background: url(//4.bp.blogspot.com/-hLqBXiTrm0Q/VJ7pie2jM3I/AAAAAAAABwI/aHQypgTLHu8/s1600/avatwisted.png) no-repeat; overflow: hidden;} .comment_name a{color: #39465F; text-decoration: none;} .comment_child .comment_name a{color:#39465F;} .comment_child .comment_name a:hover {color:#128DC4;} .comment_name{ font-size: 16px; position: absolute; top: 0; padding: 20px; right: 70px; display: inline;} .comment_name:hover,.comment_name a:hover,.comment_admin .comment_name a:hover,.comment_admin .comment_name:hover{color:#F74047;} .comment_service{ position: absolute; left: 0; top: 0; padding: 22px; background: #F5F5F5;} .item-control {display:block;} .comment_date a{ font-size: 15px; color: #F74047!important; text-align: center;} .comment_date a:hover{color:#F74047!important;} .comment-delete{position:absolute;display:inline-block;top:-2px;left:50px; color:#666!important;text-align:center;font-family:Lobster,ge_dinar_tworegular;font-size:11px;padding:2px 6px;opacity:0.9;transition:all .3s ease-out;} .comment-delete:hover{color:#128DC4!important;} .comment_body{margin:20px 0;padding:0;position:relative;} .comment_body p{ line-height: 1.6em; color: #666; font-size: 13px; font-family: cursive,Lobster,ge_dinar_tworegular; word-wrap: break-word; background: #fafafa; margin-top: 0px; padding: 30px 20px; position: relative; box-shadow: 0 0 0 1px #e9e9e9; transition: all .3s ease-out; text-align: right;} .comment_child .comment_body p{color:#666;} .comment_body p img{vertical-align:middle;margin:0 5px;} .comment_body p:hover{box-shadow:0 0 0 1px #ccc;} .comment_body p:hover:before {border-bottom-color:#aaa;} .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; background: #446FAA; color: #fff!important; text-align: center; font-family: Lobster,ge_dinar_tworegular; font-size: 14px; padding: 6px 20px 5px 16px; opacity: 0.9; border-radius: 0px 9px 0 0; float: left; margin-top: -30px;} .comment_reply:hover{text-decoration:none!important;background:#128DC4;color:#fff!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:Lobster,ge_dinar_tworegular,sans-serif;font-size:15px;color:#F74047} #comment-editor{width:103%!important;background:url(//4.bp.blogspot.com/-jSUS8v5kwpQ/U8Z_6Ufr-PI/AAAAAAAAEYY/o4cQPKvt8vQ/s1600/loading.gif) no-repeat 50% 25%;position:relative;margin-right:-8px;margin-top:-15px} .comment-form p:after {display: inline-block; content: ''; position: absolute; margin-top: 7px; height: 0; width: 0; border: 9px solid transparent; border-top-color: #555454;} .comment-form p:before {border-color:rgba(221,221,221,0);border-top-color:transparent;border-width:11px;margin-right:-11px;transition:all .3s ease-out;} .comment_reply_form{padding:0 0 0 7%} .comment_reply_form .comment-form{width:100%} .comment_emo_list .item{float: right; margin: 15px;} img.comment_emo {width: 16px; height: 16px;} .comment_emo_list span{display:block;font-weight:400;font-size:11px;letter-spacing:1px;color:#666} .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: 9px; color: #FFF; text-align: center; top: 0; background: #128DC4; padding: 5px; border-radius: 2px;;} .comment_child .comment_admin .comment_author_flag {color:#fff;left:-40%;} .spammer-detected{font-size:14px!important;color:#fff!important;background:#5cb0d8!important;margin:25px; display:inline-block;padding:10px 15px!important;} .deleted-comment{display:inline-block;color:#999;word-wrap:break-word;background:#f9f9f9;margin-top:20px;padding:10px;font-size:13px;font-family:Lobster,ge_dinar_tworegular,sans-serif;border-radius:3px;opacity:1;} 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:#666;padding:5px 10px; color:#fff;transition:all .3s ease-out} .paging-control-container a:hover{background:#e6ae48;color:#fff;} .comment_header { background: #FAFAFA;} .comment_child .comment_header {padding:0;}

      1. ملاحظة: ادا قمت من قبل بوضع كود تعليقات بلوجر
      2. يجب عليك حدف الاكواد السابقة اولا
      3. ثم ضع كود هده الاضافة, و التعديلات سهلة جدا

    مواضيع ذات صلة

    تعليقات الموقع

    هناك تعليق واحد:

    يسعدنا تفاعلكم بالتعليق، لكن يرجى عدم وضع أي روابط خارجية أو إشهارية حتى ينشر التعليق

    عن الموقع

    Nama Blog

    مدونة نت مصر

    مدونة نت مصر موقع شخصي يضم بعضا من الشروحات والقوالب الحصرية والمقالات. أحاول من خلال هدا الموقع ان أشارككم كل مكتسباتي و معارفي المتواضعة في مجال المعلوميات و كدلك لإثراء المحتوى العربي .

    تبادل أعلاني

    أعلن هنا أعلن هنا أعلن هنا أعلن هنا أعلن هنا أعلن هنا

    إشترك فى النشرة البريدية

    إجمالي مرات مشاهدة الصفحة

    مهم!يجب الاشتراك في المدونة لكي يصلك كل جديد من قوالب بلوجرمن هنا
    انضم الى متابعي المدونة الأوفياء ليصلك جديد مدونتنا !
    إنضم الان