اضافة معلومات عن التدوينة بدون اخطاء


السلام عليكم .... �� , معنا أضافه مميزة ⭐ لمدونات بلوجر , أضافة معلومات عن التدوينة في السايد بار لقوالب بلوجر , هذه الاضافة طالبني بها الكثير من متابعينا الاعزاء بسبب الكثير من التدوينات المتاحة فى الويب وعند اضافتها لاتعمل جيدا او حتى لا تعمل نهائيا واليوم اقدمها بين ايدكمبدون اخطاء.

الكثير منا يريدون ان يسهلون على الزائر فى عرفة تفاصيل التدونية ومعلوماتها لذلك هذة الاضافة تسهل على الزائر معرفة تفاصيل التدوينة ومعلوماتها كاملة من حيث تاريخ نشرها وتسهل للزائر الابلاغ عن التدوينة اذا كان بها اخطاء او رابط لا يعمل وكذلك تتيح للزائر التعرف على سياسة خصوصية المدونة وكما تريد ان تسهل للزائر من بعض الصفحات المهمة وكذلك تتيح للزائر معرفة ناشر التدوينة بالاخص فى المدونات الجماعية التى بها اكثر من مدون.
 تجعل هذه الاضافه مدونتك اكثر احترافية , لانها تتوفر على عدد التعليقات بشكل جميل وايضا كاتب الموضوع والوقت والاقسام وعدد مشاهدات الموضوع والكثير سوف تشاهدونة �� باذن الله , كي لا اطيل ⌚ عليكم ننتقل الى طريقة التركيب .


avatar شرح الطريقة
الخطوة الاولى
ادخل للمدونة » القالب » تحرير html » إبحث عن </body>
» ثم ضف الكود التالى فوقها

الكود

<script>
$(document).ready(function(){
        $(&quot;div.post-info2&quot;).replaceWith($(&quot;div.post-info&quot;));
        $(&quot;div.cn1gk-links2&quot;).replaceWith($(&quot;div.cn1gk-links&quot;));
});
</script>
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($(&#39;a[name]&#39;), function(i, e) {
 var elem = $(e).parent().find(&#39;#postviews,#cn1gkviews&#39;).addClass(&#39;mbtloading&#39;);
 var blogStats = new Firebase(&quot;https://cn1gk.firebaseio.com/pages/id/&quot; + $(e).attr(&#39;name&#39;));
 blogStats.once(&#39;value&#39;, function(snapshot) {
  var data = snapshot.val();
  var isnew = false;
  if (data == null) {
   data = {};
   data.value = 0;
   data.url = window.location.href;
   data.id = $(e).attr(&#39;name&#39;);
   isnew = true;
  }
  elem.removeClass(&#39;mbtloading&#39;).text(data.value);
  data.value++;
  if (window.location.pathname != &#39;/&#39;) {
   if (isnew) {blogStats.set(data);}
   else
            blogStats.child(&#39;value&#39;).set(data.value);
  }
 });
});
</script>
<style>
.sideinfo .widget{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibtD66TNVkEEnjKP9uo5J4Ly-H5Kfult4oG7U-W7tU_Qo6kbfLtC8zHIBfAe4E9zltZcJftEkazhRKxy8SiDvOmNnt8giLaS3NSrx2kmUibyvm0wxVHpO5VRKNkkkeD2-WfExu52Ntv7Eb/s1600/tr.png) no-repeat !important;transition: box-shadow .25s;border-radius: 2px;box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);background-color: #fbfbfb !important;background-size: cover !important;background-attachment: fixed !important;margin-left: 0px;}#post_media_permalink_container {margin: -70px -10px 0px 0px;padding: 0;position: relative;width: 102%;height: 599px;background: #F9F9F9;overflow: hidden;background-repeat: no-repeat;background-size: cover;}.post_media_permalink {top: 0;left: 0;width: 100%;height: 100%;background-size: cover !important; opacity: 1;background-position: 0px 0px;background-repeat: no-repeat;position: relative;}.post_media_permalink img {filter: blur(10px);-webkit-filter: blur(6px);-moz-filter: blur(10px);-o-filter: blur(10px);-ms-filter: blur(10px);filter: url(https://googledrive.com/host/0BzhmjN6UOoj5MTV3d0NwaUJHVHc?dl=1#blur);filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=&#39;10&#39;);background-repeat: no-repeat;}.demo:hover,.download1:hover,.download:hover {background:rgba(0, 0, 0, 0.6);text-shadow:0 0 1px #222;color:#fff;}.button{float:right;list-style:none;text-align:center;width:95%;margin:10px;padding:2px;font-size:14px;clear:both;-webkit-box-reflect:below -3px -webkit-gradient(linear,left top,left bottom,from(transparent),color-stop(75%,transparent),to(rgba(255,255,255,0.4)))}.button ul {margin:0;padding:0}.button li{display:inline;margin:0;padding:0}.demo {opacity:1;padding:5px 14px!important;background:#9eb2c0;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;text-decoration: none!important;}.download {opacity:1;padding:5px 14px!important;background:#fe4e3f;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;    text-decoration: none!important;}.demo:before {content: &#39;\f06e&#39;;display: inline-block;margin-left: 5px;width: 16px;height: 31px;line-height: 24px;color: #fff;font-family: fontawesome;transition: all 0.5s ease-in-out;padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}.download:before {content:&#39;\f019&#39;;display: inline-block;margin-left: 5px;width: 16px;height: 31px;line-height: 24px;color: #fff;font-family: fontawesome;transition: all 0.5s ease-in-out;padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}.download1 {opacity:1;padding:5px 14px!important;background:#3FA2FE;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;text-decoration: none!important;}.download1:before {content:&#39;\f019&#39;;display:inline-block;margin-left:5px;width:16px;height:31px;line-height:24px;color:#fff;font-family:fontawesome;transition:all 0.5s ease-in-out;padding:3px;background:rgba(0, 0, 0, 0.2)padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}.cn1gk-links {clear: both;margin-bottom: 15px;}.cn1gk-links a {display: block;overflow: hidden;margin-bottom: -15px;white-space: nowrap;text-align: center;position: relative;height: 60px;line-height: 60px;padding: 0 30px;color: #fff;    text-transform: uppercase;font-weight: bold;text-decoration: none!important;border-radius: 2px!important;}.cn1gk-links a:before {display: inline;font: normal normal normal 14px/1 FontAwesome;vertical-align: middle;position: absolute;left: 50%;width: 20px;height: 20px;margin-left: -10px;top: 50%;margin-top: -10px;opacity: 0;-webkit-transform: scale(10);-moz-transform: scale(10);-o-transform: scale(10);-ms-transform: scale(10);color: #FFF;font-size: 20px;}.cn1gk-links a:hover:before {opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transition: all .2s ease;-webkit-transition: all .2s ease;-moz-transition: all .2s ease;-o-transition: all .2s ease;-ms-transition: all .2s ease;}a.download2 {background-color: #fe4e3f;}a.download3 {background-color:#3FA2FE;}a.demo1 {background-color: #9A9898;}a.buy {background-color: #FFCD3F;}a.link {background-color: #6E7784;}.cn1gk-links.download2:hover{background-color: #F54C3E;color:#fff}.cn1gk-links .download2:before {content: &#39;\f0ed&#39;;}.cn1gk-links .download3:hover{background-color: #4399CD;color:#fff}.cn1gk-links .buy:hover{background-color: #F9C83D;color:#fff}.cn1gk-links .link:hover{background-color: #616975;color:#fff}.cn1gk-links .download3:before {content: &#39;\f0ed&#39;;}.cn1gk-links .link:before {content: &#39;\f0c1&#39;;}.cn1gk-links .demo1:before {content: &#39;\f135&#39;;}.cn1gk-links .buy:before {content: &#39;\f09d&#39;;}.cn1gk-links .trial:before {content: &quot;\f20a&quot;;}.fa-cc:before {content: &quot;\f20a&quot;;}.cn1gk-links a span {white-space: nowrap;overflow: hidden;display: block;}.cn1gk-links a:hover span {display: none;}.cn1gk-links a:hover {background-color: #848181;color: #FFF;}.cn1gk-links a:hover span {color: #FFF;}.temp-ftr {position: relative;font-size: 13.5px;}.temp-ftr ul{list-style:none;}.temp-ftr li{    white-space: nowrap;border: 1px solid #EAE9E9;padding: 10px;margin: 0;    border-bottom: none;}.temp-ftr li:last-child{border-top: 1px solid #EFEFEF; border-bottom: 1px solid #EFEFEF;}.temp-ftr li i{border-left: 1px solid #ddd;padding-left: 7px;margin-left: 5px;color: #ddd;width: 21px;text-align: center;}.temp-ftr li:hover{cursor:pointer;}.temp-ftr li:nth-child(2n+2){background-color:#f9f9f9;    border-bottom: none;}.temp-ftr li:hover .fa-check{color:#61a136;}.temp-ftr li:hover .fa-tasks{color:#e84c4a;}.temp-ftr a{line-height: 0!important;background: none!important;color: #448AFF;overflow: visible!important;padding: 0!important;margin: 0!important;text-align: initial;height: 0!important;font-weight: normal;display: inline-table;font-family: tahoma;}.temp-ftr li:hover .fa-copyright,.temp-ftr li:hover .fa-cc,.temp-ftr li:hover .fa-file-image-o,.temp-ftr li:hover .fa-folder-o {color: #ddd;}.temp-ftr a:hover,.temp-ftr li:hover .fa-file-archive-o{color: #3F80EC;}.post-info &gt; div &gt; span.post-tags, .post-info &gt; div &gt; span.post-author, .post-info &gt; div &gt; span.post-timestamp, .post-info &gt; div &gt; span.post-comment-cnt , .post-info &gt; div &gt; span.post-broken,.post-info &gt; div &gt; span.post-disqus-cnt{display: block;float: none;clear: both;min-height: 32px;margin-bottom: 4px;background: rgba(245, 244, 244, 0.7);font-size: 13px;}.post-inf &gt; div &gt; span.post-tag, .post-inf &gt; div &gt; span.post-autho, .post-inf &gt; div &gt; span.post-timestam, .post-inf &gt; div &gt; span.post-comment-cn , .post-inf &gt; div &gt; span.post-broke {display: block;float: none;clear: both;min-height: 32px;margin-bottom: 4px;background: #EBEBEB;font-size: 13px;}.post-inf &gt; div a {color: #408696;}.post-inf &gt; div &gt; span .fa {width: 32px;height: 32px;color: #FFF;text-align: center;font-size: 22px;margin-left: 10px;padding-top: 5px;vertical-align: middle;}.post-inf &gt; div &gt; span .fa-file-archive-o {background: #E92648;}.post-inf &gt; div &gt; span .fa-tachometer {background: orange;}.post-inf &gt; div &gt; span .fa-copyright {background: #12ACE0;}.post-inf &gt; div &gt; span .fa-toggle-off {background: #514069;}.col-tag {display: none;}.post-info &gt; div a {color: #408696;}.post-info &gt; div &gt; span .fa {width: 32px;height: 32px;color: #FFF;text-align: center;font-size: 22px;margin-left: 10px;padding-top: 9px;vertical-align: middle;}.post-info &gt; div &gt; span .fa-calendar {background: #7F93A2;padding: 9px 0px 0px 0px;}.post-info &gt; div &gt; span .fa-comment {background: orange;}.post-info &gt; div &gt; span .fa-comment-o {background: #4d90fe;}.post-info &gt; div &gt; span .fa-user {background: #E55048;}.post-info &gt; div &gt; span .fa-tags {background: #81e058;}.post-info &gt; div &gt; span .fa-eye {background: #0ebeff;}.post-info &gt; div &gt; span .fa-link {background: #974EE5;}.post-info &gt; div &gt; span .fa-chain-broken {background: #fcd000;}#views-container{display: inline-block;}.post-timestamp {margin-right: 0em;}.cn1gk-links a:hover {color: rgba(0, 0, 0, 0) !important;}.cn1gk-links a:hover:before {opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transition: all .2s ease;-webkit-transition: all .2s ease;-moz-transition: all .2s ease;-o-transition: all .2s ease;-ms-transition: all .2s ease;}.cn1gk-links .link:before {content: &#39;\f0c1&#39;;}.cn1gk-links a:before {display: inline;font: normal normal normal 14px/1 FontAwesome;vertical-align: middle;position: absolute;left: 50%;width: 20px;height: 20px;margin-left: -10px;top: 50%;margin-top: -10px;opacity: 0;-webkit-transform: scale(10);-moz-transform: scale(10);-o-transform: scale(10);-ms-transform: scale(10);color: #FFF;font-size: 20px;}.cn1gk-postinfo{background: #FFF;border: 1px solid #E7E7E7;color: #555;display: block;max-width: 47%;text-align: right;height: 250px;margin-top: 20px;margin-right: 7px;}.cn1gk-postinfo {max-width: 100%;width:initial;margin-right:0;border: none;border-bottom: 1px solid #F5F5F5;}
</style>
الان ابحث عن كود السايد بار غالبا ما يكون بهذا الشكل <div id='sidebar-wrapper'>
واضف الكود التالى بعدة مباشرةً

الكود

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <b:section class='sideinfo' id='sideinfo' showaddelement='yes'>
    <b:widget id='HTML998' locked='false' title='معلومات التدوينة' type='HTML' version='1' visible='true'>
      <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
<div class='post-info2'/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
    </b:widget>
    <b:widget id='HTML997' locked='false' title='post tools' type='HTML' version='1' visible='true'>
      <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <div class='widget-content'>
    <div class='cn1gk-links2'/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
    </b:widget>
  </b:section>
    </b:if>
الان ابحث عن <div class='post-header'>
*ملحوظة: سوف تجد اكثر من واحد غالبا الثانى او الاخير هو المطلوب لذلك ان لم تنجح فى المرة الاولى حاول فى الباقى
واضف الكود التالى بعدة مباشرةً
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='display:none;'>
<div class='post-info' id='new-post-info'>
<div class='cl-item-page' id='fixe-cn1gk'>
<span class='post-comment-cnt vcard'><i class='fa fa-comment'>
</i>التعليقات : <data:post.numComments/></span>
<span class='post-author vcard'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<i class='fa fa-user'>
</i>الكاتب : 
<span itemprop='name'><data:post.author/></span>
</span>
</span>
<span class='post-timestamp'>
<i class='fa fa-calendar'>
</i>التاريخ:
<data:post.timestamp/>
</span>
<span class='post-comment-link'>
</span>
<span class='post-tags'>
<i class='fa fa-tags'>
</i>التسميات:
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a class='first' expr:href='data:label.url + &quot;?max-results=8&quot;' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>&#1548;</b:if>
</b:loop>
</b:if>
</span>
<span class='post-comment-cnt'><i class='fa fa-eye'/>
عدد المشاهدات : <div id='views-container'>
<span class='views-icon'/>
<div class='views-text'/>
  <span class='mbt-loading viewscount' id='postviews'/>
</div></span>
<span class='post-broken'><i class='fa fa-chain-broken'>
</i>قم بالابلاغ عن رابط معطوب<a href='http://www.cn1gk.com/p/chat.html' style='color #F56C27;text-decoration: underline;padding: 3px;font-size: 11px;' target='_blank'>هنا</a></span>
<span class='post-instructions'><i class='fa fa-link'>
</i>سياسة الخصوصية <a href='http://www.cn1gk.com/p/blog-page_57.html' style='color #F56C27;text-decoration: underline;padding: 3px;font-size: 11px;' target='_blank'>هنا</a></span>
<span class='post-icons'>
</span>
  </div></div></div>
</b:if>
احفظ القالب

تعليقات

  1. ممكن تضعوا لنا قالب بالماتريال ؟
    يكون خفيف الظل

    ردحذف
  2. لم تشتغل معي الإضافة

    ردحذف
  3. الاضافه جميله لكن لم تشتغل معى عدد المشاهدات ممكن حل
    ودا رابط الموقع www.elhrm4.com

    ردحذف

الأرشيف

نموذج الاتصال

إرسال