اضافة ازرار التنقل بين المواضيع لمدونات بلوجر [ التالي - السابق ] كتبها: المدون التقني

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

السلام عليكم ورحمة الله تعالى وبركاته أهلا بكم متابعي وأصدقاء الخبير عامر بشير ، مرحبا بك أخي / أختي القاريء (ة) في موضوع تقني جديد لهذا اليوم، نتمنى لكم الاستفادة ومتابعة ممتعة للجميع.

السلام عليكم ومرحبا بكم في مدونة الخبير عامر بشير اقدم لكم اليوم اضافة رائعة لمدونات بلوجر وتتمثل في اورار تنقل بين المواضيع التالية و السابقة

يمكنكم معاينة الاضافة من هنا

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

إبحث على وضع الكود التالي فوقه مباشرة

<b:if cond='data:view.isPost'><style type='text/css'>/*<![CDATA[*/ /* ------ Navigation ------ */ .topic-nav{clear:both;margin-top:20px;display:block;padding:20px;border:1px solid #eeeeee} .topic-nav-wrap{position:relative} .topic-nav-cont{overflow:hidden;font-size:0} .topic-nav-cont a{width:50%;padding:15px;text-align:center;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;position:relative} .topic-nav-cont a:hover{position:static;background:-webkit-linear-gradient(45deg,#d24949,#9e44c9);background:-o-linear-gradient(45deg,#d24949,#9e44c9);background:-moz-linear-gradient(45deg,#d24949,#9e44c9);background:linear-gradient(45deg,#d24949,#9e44c9)} .topic-nav .next{float:left;border-right:1px solid #eeeeee} .topic-nav .prev{float:right;margin-right:-1px;border-left:1px solid #eeeeee} .topic-nav-cont span{display:block;width:120px;margin:0 auto;font-size:12px;color:#777777;position:relative;font-weight:700;padding:5px 0;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;background:#eeeeee} .topic-nav-cont a:hover span{background-color:#FFF;color:#d24949} .topic-nav-cont h4{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out;font-size:16px;margin:10px 0 0;overflow:hidden;color:#222222;max-height:50px;line-height:1.5em} .topic-nav-cont a:hover h4{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out;color:#FFF} .topic-nav .topic-img{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out;opacity:0;width:49.9%;height:180px;border:10px solid #9e44c9;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;position:absolute;bottom:150%;z-index:1} .topic-nav .topic-img img{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;width:100%;height:100%;margin:0} .topic-nav-cont a:hover .topic-img{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out;opacity:1;bottom:120%} .topic-nav .next .topic-img{left:0} .topic-nav .prev .topic-img{right:0} .topic-nav .topic-img:after{content:"";display:block;border-width:19px;border-style:solid;border-color:#9e44c9 transparent transparent;position:absolute;left:-webkit-calc(50% - 19px);left:-moz-calc(50% - 19px);left:calc(50% - 19px);top:100%} @media screen and (max-width:480px){.topic-nav-cont a.next,.topic-nav-cont a.prev{float:none;width:100%;border:none;display:block}.topic-nav .topic-img{display:none!important}} @media print{.topic-nav{display:none}} /*]]>*/ </style></b:if>

إبحث على وضع الكود التالي فوقه

<b:if cond='data:view.isPost'><script type='text/javascript'>/*<![CDATA[*/ var next_text ='الموضوع التالي'; var prev_text='الموضوع السابق'; var noimg ='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb9o6Y1EkWxoHPTG2xUqTIyP5g4Go-1AgblUYFzXGVLgO1M8URc3w5sm3oTNSUpAplGqGXOFJJrAaHgmKj_x5HUf0Gq-XRwatKGZZ8v7BgC_vBhwbwIoPjnL_279MKZATjPHr_gIS5KT4/s1600/90.jpg'; $(document).ready(function(){var t=$(".topic-nav .next"),a=$(".topic-nav .prev") $.get(t.attr("href"),function(a){var r=$(a).find("h1.entry-title").text(),i=$(a).find(".post .separator img") try{var n='<img src="'+i[0].src+'"  alt="'+r+'" />'}catch(c){var n='<img src="'+noimg+'" alt="'+r+'"/>'}t.html('<span class="next-txt">'+next_text+"</span><h4>"+r+'</h4><div class="topic-img">'+n+"</div>")},"html"),$.get(a.attr("href"),function(t){var r=$(t).find("h1.entry-title").text(),i=$(t).find(".post .separator img") try{var n='<img src="'+i[0].src+'"  alt="'+r+'" />'}catch(c){var n='<img src="'+noimg+'" alt="'+r+'"/>'}a.html('<span class="prev-txt">'+prev_text+"</span><h4>"+r+'</h4><div class="topic-img">'+n+"</div>")},"html")}) //]]></script></b:if>

الان في الخطوة الاخيرة و هوا الكود الذي سوف يظهر في الاضافة وعادة ما تكون الاضافة فوق المواضيع ذات صلة او اسفل ازرار النشر لذا حاول البحث على هذه الاضافات ووضع الكود التالي فوقها او اسفلها

الكلمات المفتاحية : اضافات بلوجر بلوجر

Written by you: Technical blogger AMER BACHIR

URL Of Post:

https://ab-expert.blogspot.com/2018/11/blog-post_18.html

HTML Code Of Post:

<a href="https://ab-expert.blogspot.com/2018/11/blog-post_18.html">اضافة ازرار التنقل بين المواضيع لمدونات بلوجر [ التالي - السابق ] كتبها: المدون التقني  - الخبير عامر بشير</a>

الموضوع من قسم:

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

عن المدونة

مدونة الخبير عامر بشير للمعلوميات مختصة في مجال التكنلوجيا و التقنيات و كل ما يخص الهواتف الذكية و الحواسيب ، و هدفنا هو تصحيح االأفكار و الدروس الخاطئة في المحتوى العربي عن طريق دروس و حلقات في قناتنا على اليوتيوب ، و يسهر على إشراف و سير الموقع الشاب الجزائري ' عامر بشير' الذي يحيكم و يشجعكم على الزيارة الدائمة و الإشتراك في موقعنا لتتوصل بكل جديد منا .