Ads 300×250px
حصريا إضافة معلومات التدوينة فى العمود الجانبى لمدونات بلوجر - بلو ويب |
بسم الله الرحمن الرحيم
السلام عليكم زوار مدونة بلو ويب هل رأيت مدونات تضع معلومات التدوينة فى العمود الجانبى وتمنيت ان تضع معلومات التدوينة لديك بهذا الشكل لا تقلق فقد منحتك بلو ويب هذا الشرف وهذة الاضافة الجميلة تابعوا الموضوع وارجو التعليق تقديرا لمجهودى.
معاينة الاضافة
الكود الاول :ادخل للمدونة » القالب » تحرير html » إضغط ctrl +f » إبحث عن </body> » ثم ضف الكود التالى فوقها
<script> $(document).ready(function(){ $("div.post-info2").replaceWith($("div.post-info")); $("div.blo1web-links2").replaceWith($("div.blo1web-links")); }); </script> <script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'></script> <script> $.each($('a[name]'), function(i, e) { var elem = $(e).parent().find('#postviews,#blo1webviews').addClass('mbtloading'); var blogStats = new Firebase("https://blo1web.firebaseio.com/pages/id/" + $(e).attr('name')); blogStats.once('value', 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('name'); isnew = true; } elem.removeClass('mbtloading').text(data.value); data.value++; if (window.location.pathname != '/') { if (isnew) {blogStats.set(data);} else blogStats.child('value').set(data.value); } }); }); </script> <style> #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='10'); 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: '\f06e';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:'\f019';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:'\f019';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;} .blo1web-links {clear: both;margin-bottom: 15px;} .blo1web-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;} .blo1web-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;} .blo1web-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;} .blo1web-links .download2:hover{background-color: #F54C3E;color:#fff} .blo1web-links .download2:before {content: '\f0ed';} .blo1web-links .download3:hover{background-color: #4399CD;color:#fff} .blo1web-links .buy:hover{background-color: #F9C83D;color:#fff} .blo1web-links .link:hover{background-color: #616975;color:#fff} .blo1web-links .download3:before {content: '\f0ed';} .blo1web-links .link:before {content: '\f0c1';} .blo1web-links .demo1:before {content: '\f135';} .blo1web-links .buy:before {content: '\f09d';} .blo1web-links .trial:before {content: "\f20a";} .fa-cc:before {content: "\f20a";} .blo1web-links a span {white-space: nowrap;overflow: hidden;display: block;} .blo1web-links a:hover span {display: none;} .blo1web-links a:hover {background-color: #848181;color: #FFF;} .blo1web-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 > div > span.post-tags, .post-info > div > span.post-author, .post-info > div > span.post-timestamp, .post-info > div > span.post-comment-cnt , .post-info > div > span.post-broken,.post-info > div > 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 > div > span.post-tag, .post-inf > div > span.post-autho, .post-inf > div > span.post-timestam, .post-inf > div > span.post-comment-cn , .post-inf > div > span.post-broke {display: block;float: none;clear: both;min-height: 32px;margin-bottom: 4px;background: #EBEBEB;font-size: 13px;} .post-inf > div a {color: #408696;} .post-inf > div > 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 > div > span .fa-file-archive-o {background: #E92648;} .post-inf > div > span .fa-tachometer {background: orange;} .post-inf > div > span .fa-copyright {background: #12ACE0;} .post-inf > div > span .fa-toggle-off {background: #514069;} .col-tag {display: none;} .post-info > div a {color: #408696;} .post-info > div > span .fa {width: 32px;height: 32px;color: #FFF;text-align: center;font-size: 22px;margin-left: 10px;padding-top: 5px;vertical-align: middle;} .post-info > div > span .fa-calendar {background: #7F93A2;} .post-info > div > span .fa-comment {background: orange;} .post-info > div > span .fa-comment-o {background: #4d90fe;} .post-info > div > span .fa-user {background: #E55048;} .post-info > div > span .fa-tags {background: #81e058;} .post-info > div > span .fa-eye {background: #0ebeff;} .post-info > div > span .fa-link {background: #974EE5;} .post-info > div > span .fa-chain-broken {background: #fcd000;} #views-container{ display: inline-block; } .post-timestamp { margin-right: 0em; } .blo1web-links a:hover { color: rgba(0, 0, 0, 0) !important; } .blo1web-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; } .blo1web-links .link:before { content: '\f0c1'; } .blo1web-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; } blo1web-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;} blo1web-postinfo {max-width: 100%;width:initial;margin-right:0;border: none;border-bottom: 1px solid #F5F5F5;} </style>
الكود الثانى : الان ابحث عن كود السايد بار غالبا ما يكون بهذا الشكل <div id='sidebar-wrapper'>
واضف بعدة الكود التالى
الان ابحث عن <div class='post-header'> واضف بعدة الكود التالى
قد يكون مكرر كثيرا جرهم واحد واحد حتى يتفعل الكود
مبروك عليك الاضافة وانتظرونا بإذن الله فى الدرس القادم وسيكون عن اضافة ازرار التحميل والمعاينة فى العمود الجانبى
اذا واجهتك اى مشكلة ضعها فى تعليق او فى قسم الحلول والمشاكل
اخر تحديث للموضوع يوم 6/5/2016
كلمة شكر تكفى وتحفزنى لن تخسر من وقتك كثير اارجو التعليق
واضف بعدة الكود التالى
<b:if cond='data:blog.pageType == "item"'> <b:section class='sideinfo' id='sideinfo' showaddelement='yes'> <b:widget id='HTML998' locked='false' title='post info' type='HTML'> <b:includable id='main'> <!-- only display title if it's non-empty --> <b:if cond='data:title != ""'> <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'> <b:includable id='main'> <!-- only display title if it's non-empty --> <div class='widget-content'> <div class='blo1web-links2'/> </div> <b:include name='quickedit'/> </b:includable> </b:widget> </b:section> </b:if>
قد يكون مكرر كثيرا جرهم واحد واحد حتى يتفعل الكود
<b:if cond='data:blog.pageType == "item"'> <div style="display:none;"> <div class='post-info' id='new-post-info'> <div class='cl-item-page' id='fixe-blo1web'> <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 + "?max-results=8"' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != "true"'>،</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://en.blo1web.com/p/broken-link.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://en.blo1web.com/p/privacy-policy.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>
مبروك عليك الاضافة وانتظرونا بإذن الله فى الدرس القادم وسيكون عن اضافة ازرار التحميل والمعاينة فى العمود الجانبى
اذا واجهتك اى مشكلة ضعها فى تعليق او فى قسم الحلول والمشاكل
اخر تحديث للموضوع يوم 6/5/2016
كلمة شكر تكفى وتحفزنى لن تخسر من وقتك كثير اارجو التعليق
روووووعه وشكلها جميل جدا احسنت
ردحذفشكرا لك مرورك هو الاروع
حذفالسلام عليكم اخي ممكن طريقة ازارار التحميل مثل عرب ويب ضروري مجتاجها
ردحذفتفضلhttp://www.blo1web.com/2016/02/downloaf-in-sidebar-for-blogger.html
حذفقريبا باذن الله اخى
ردحذفالكود لا يعمل لا يظهر شئ
ردحذفقد يتعارض معه كود من اكواد مدونتك
ردحذفلا يظهر شئ بعد الحفظ
ردحذفلينك المدونه
حذفتم تعديل الشرح
حذفchokran
ردحذفالشكر لله صديقي :e06:
حذفشكرا
ردحذفالشكر لله وشكرا علي مرورك
حذفقمت بتجربته علي قالب المحترف الجديد 2016 ولم يتم الاضافة تواصل معي https://www.facebook.com/1AhmedElnagamy1
ردحذفيمكنك ارسال رابط المعاينة او رسال القالب لتركيب الاضافة لك على الاميل
حذفcompulack@gmail.com
اشكرك اضافة ممتازة بسنسيت تقول تغيير الرابط من موقعك الى موقع الشخص الزى سيركب الاضافة وكذلك اسم الاداة فى موقع جلب الحصائيات firebase.com
ردحذفليس شررط تغير رابط firebase.com اخى
حذف