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

السلام عليكم ومرحبا بكم في مدونة عبدو تكنولوجي اقدم لكم اضافة جديدة في المدونة وهيا عبارة عن مواضيع ذات صلة تكون وسط الموضوع يضهر فيها مواضيع مع الصورة الخاصة بها

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

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

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

<b:if cond='data:view.isPost'><style type='text/css'>/*RelatedPost*/ .post-related_results{display:block;position:relative;background:#fff;padding:0;margin:15px auto 20px;width:100%} .post-related_results h4{background:#2b3946;padding:7px 10px;display:inline-block;font-size:12px;text-transform:uppercase;color:#fff;border-radius:3px;line-height:normal;border:0} .post-related_results h4:before{display:none} .post-related_results ul{margin:0;padding:0} .post-related_results ul li:hover{overflow:visible} .post-related_results ul li{list-style:none;padding:1px 0;line-height:1.5em;overflow:hidden;position:relative;z-index:1;position:relative} .post-related_results a{color:#2b3946;font-size:13px} .post-related_results a:hover{color:#000;text-decoration:underline} .post-related_img{position:absolute;top:-120%;border:10px solid #2b3946;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;left:102%;z-index:99999999;color:#fff;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.2),0 2px 5px 0 rgba(0,0,0,.2);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.2),0 2px 5px 0 rgba(0,0,0,.2);box-shadow:0 0 5px 0 rgba(0,0,0,.2),0 2px 5px 0 rgba(0,0,0,.2);background-color:#fff;-webkit-transition:-webkit-transform .25s .1s;transition:-webkit-transform .25s .1s;-o-transition:-o-transform .25s .1s;-moz-transition:transform .25s .1s,-moz-transform .25s .1s;transition:transform .25s .1s;transition:transform .25s .1s,-webkit-transform .25s .1s,-moz-transform .25s .1s,-o-transform .25s .1s;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;-ms-transform-origin:center bottom;-o-transform-origin:center bottom;transform-origin:center bottom;-webkit-transform:translateY(-50%) scale(0);-moz-transform:translateY(-50%) scale(0);-ms-transform:translateY(-50%) scale(0);-o-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0);height:125px;margin-top:43px;width:23%;opacity:0} .post-related_results ul li:hover .post-related_img{opacity:1;-webkit-transform:translateY(-50%) scale(1);-moz-transform:translateY(-50%) scale(1);-ms-transform:translateY(-50%) scale(1);-o-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1);right:auto;left:51%;margin-left:0;z-index:999999999999999999999999999999} .post-related_img img{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;width:100%;height:100%} .post-related_img:after{content:"";display:block;position:absolute;right:calc(-10% - 13px);top:31%;width:0;height:0;border:0 solid transparent;border-bottom-width:23px;border-top-width:20px;border-left:31px solid #2b3946} </style> </b:if>

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

<b:if cond='data:view.isPost'><script type='text/javascript'> /*<![CDATA[*/ var numpost =5,no_image="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1J3UZcYFgKrGGqQ1lzXWqlwa98Q_QC1LZ3Rr5_7SWI9ePtn7BjI4dVOAQFJpQ2VDd3_f_o_5iZhxvlnlM7vrTlkDEHHSvCZCS40ePYrZgRlSPPq5I71o_BM7BXD3qM75Xv5_qOktU_oI/s1600-r/nth.png"; var node = document.createElement('script'); node.type = 'text/javascript'; node.async = true; node.src = '//rawgit.com/abdelalilebbihi/abdou_tech/master/gadget/related_post_insideposte.js'; var runscript = document.getElementsByTagName('script')[0]; runscript.parentNode.insertBefore(node, runscript); /*]]>*/ </script> </b:if>

• الان إبحث على هذا <data:post.body/> في بعض القوالب يوجد منه 3 مرات لذا انت جرب في كل واحد ضع الكود اتالي حتى يضه معك

<b:if cond='data:view.isPost'><div class='post-related_results'><h4>اقرأ أيضا</h4><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><b:if cond='data:label.isLast == "true"'><div class='related_NAME'><data:label.name/></div></b:if></b:loop></b:if></div></b:if>

الان احفظ القالب و مبروك عليك الاضافة و لا تنسى الاشتراك في المدونة و القناة لكي تدعمني على تقديم المزيد

شارك هذا