مدونة حمزه ويب: اضافة اخر تعليقات بشكل مميزه وجميلة واحترافية

السلام عليكم ورحمه الله وبركاته

في هذا شرح جديد من حمزه ويب راح نتعلم

كيفية اضافة اخر تعليقات بشكل جميل واحترافي

شبية بالاختيارات كوكل بلس

والاشعارات

للتركيب اضافة

1. نتوجه الى المدونة ، قالب ، تحرير HTML

2. نبحث عن الكود

</head>

ونضيف هذا كود فوقة

#comments-container.cm-active {
position:fixed;
right:0;
top:61px;
}

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width: 7px;
    background-color: #111;border-radius:3px;
}
.vscrollerbar {
width: 7px;
background-color: #444;border-radius:3px;
}
.hscrollerbase {
height: 10px;
background-color: #111;border-radius:3px;
}
.hscrollerbar {
height: 10px;
background-color: #444;border-radius:3px;
}

.scrollerjogbox {
width: 10px;
height: 10px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background-color: gray;
}
.cm-outer {
  margin:0 auto;
  padding:0;
  font-size:11px;
  text-align:right;
}
  .cm-outer pre {background-color:#141414;font-size:11px;color:#7c7c7c}
.cm-outer li {
  padding:7px 10px 12px;
  list-style:none;
  clear:both;
  position:relative;
  border-top:1px solid #28313b;
  border-bottom:1px solid #111;
  margin-right:10px;
}
.cm-outer code {
 color:#a6a658;
    font-size:11px;
}

.cm-outer li.selected {
    border-left:4px solid #fffe8c;
}
  .cm-outer li:first-child {
  border-top:none;
}
  .cm-outer li:last-child {
  border-bottom:none;
}
.cm-text {color:#999;}
.cm-outer {margin:0 0 5px}
.cm-header {margin: 4px 0 8px 50px;font-size:12px;font-weight:normal !important;}
.cm-header a {color:#168980;text-decoration:none;font-size:12px;font-weight:normal}
.cm-header a:hover {color:#e6e6e6;text-decoration:none;}
.cm-outer .cm-content {overflow:hidden}
.cm-content {margin-left:50px}
.cm-outer img {
  display:block;
  float:left;
  background:#8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%;
  overflow:hidden;
  border-radius:100px;
  position:absolute;
  top:10px;
  left:0;
  border:3px solid #3d464f;
}
.cm-footer {margin-top:7px;}
.cm-footer a {color:#168980;text-decoration:none;}
.cm-footer a:hover {color:#e6e6e6;text-decoration:none;}
div.cm-header img[src='http://img1.blogblog.com/img/openid16-rounded.gif'] {
content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6C58F-aVmIjAvWR2cJBb5OYnCWcCNPXk3QAzxsuGOnhHLd4FnsjzhfKFiJwKl3fBY9LnD7BEtBbGpzvvxV7mqm0HJHVZRhoTNjwONgXuA59YQ2kHgpIiNYUBwi3oUmgmuJ3iR2HrUmwk/s80-c/gravatar.png);
}

.bg_hitam{
        display: none;
        position: absolute;
        position: fixed;
        top: 0%;
        left: 0%;
        width: 100%;
        height: 100%;
        background-color: #000;
        z-index:99;
        opacity:.30;
}
img.cm-smiley  {
  float:none;
  position:relative;
  display:inline-block;
    width:12px !important;
    height:12px !important;
    top:2px;
    border:none;
    border-radius:2px;
background:none;
}

.myframe {
  display:none;
  width:100%;
  height:265px;
  margin-bottom:5px;
  border-radius:5px;
}
.jsfiddle-demo {
  display:block;
  width:100%;
  height:250px;
  border:1px solid #bbb;
  background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNXDrDVUJxy2QEMPieraJIMEMHaotFS5_nK1wLtM19r1xQO5nZQY9VaMvxLLm_D3eHcMaOc411bUXDakGvKh0PsqrHlmGPdh8YRA8THU7aZr12RKqtXmkEzzRDdqPv_F7Tfin3jgv7KPA/s1600/kangis-loader.gif') no-repeat 50% 50%;
}
.sticky {  
    position: fixed;   
    top: 80px;  
    z-index: 100;  
    border-top: 0;  
} 
      /*-----Font Face-----*/
      /* latin-ext */
      @font-face {
        font-family: 'Oswald';
        font-style: normal;
        font-weight: 400;
        src: local('Oswald Regular'), local('Oswald-Regular'), url(http://fonts.gstatic.com/s/oswald/v9/RqRF4AQrkUh3ft98NHH2mA.woff2) format('woff2'), url(http://fonts.gstatic.com/s/oswald/v9/PyqsDANUgLi2UsdO-d4iZQ.woff) format('woff');
        unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
      }
      /* latin */
      @font-face {
        font-family: 'Oswald';
        font-style: normal;
        font-weight: 400;
        src: local('Oswald Regular'), local('Oswald-Regular'), url(http://fonts.gstatic.com/s/oswald/v9/pEobIV_lL25TKBpqVI_a2w.woff2) format('woff2'), url(http://fonts.gstatic.com/s/oswald/v9/-g5pDUSRgvxvOl5u-a_WHw.woff) format('woff');
        unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
      }     
  @font-face {
        font-family: 'DroidKufi-Bold';
        font-style: normal;
        font-weight: 700;
        src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot);
        src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),
        url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff2) format('x-woff2'),
        url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff) format('woff'),
        url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.ttf) format('truetype');
      }
</style>

ثم نبحث عن كود </body>

ونضيف هذا كود فوقة

وتقوم بتغيير رابط مدونتي برابط مدونتك

ومبروك عليك الاضافة

وانتظرو كل جديد من حمزه ويب

مدونة حمزه ويب

اضافة اخر تعليقات بشكل مميزه وجميلة واحترافية

Hamza Ibrahim

صندوق التدوينة

قالب حنان الزنبقي

المتابعون

التسميات

المشاركات الشائعة

أخر تعليقات

أرشيف المدونة الإلكترونية