recent
أخبار ساخنة

شكل مميز لسكربت لعرض المواضيع حسب التسمية لمدونات بلوجر

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

السلام عليكم ورحمة الله وبركاته
اهلا وسهلا بكم متابعي مدونة اسمعنى اون لاين اليوم سوف نشرح لكم سكربت عرض المواضيع بشكل جميل ومميز جداً، حيث يقوم الاسكربت بعرض قسم معين من أقسام مدونتك بشكل مميز جدأ .

طريقة التركيب


إبحث على </head> وضع الكود التالي فوقه
<style>.box_gallery{background:#ddd;color:#eee;padding:50px 0;margin-bottom:30px;overflow:hidden}.abdoutech_box .star_rating .fa:nth-child(1),.goombox .star_rating .fa:nth-child(1),li.carousel-item .star_rating .fa:nth-child(1){color:red}.abdoutech_box .star_rating .fa:nth-child(2),.goombox .star_rating .fa:nth-child(2),li.carousel-item .star_rating .fa:nth-child(2){color:#f50}.abdoutech_box .star_rating .fa:nth-child(3),.goombox .star_rating .fa:nth-child(3),li.carousel-item .star_rating .fa:nth-child(3){color:#fa0}.abdoutech_box .star_rating .fa:nth-child(4),.goombox .star_rating .fa:nth-child(4),li.carousel-item .star_rating .fa:nth-child(4){color:#3cbd1b}.abdoutech_box .star_rating .fa:nth-child(5),.goombox .star_rating .fa:nth-child(5),li.carousel-item .star_rating .fa:nth-child(5){color:#127adb}.abdoutech_box .star_rating .fa:nth-child(6),.goombox .star_rating .fa:nth-child(6),li.carousel-item .star_rating .fa:nth-child(6){color:#c720a3}.content-wrapper {position: relative;max-width: 1100px;margin: 0 auto;}.gallery li:hover .recent-content,.videos li:hover .recent-content{padding-bottom:15px}.gallery ul li{width:32.7%;height:250px;overflow:hidden;float:right;margin-bottom:10px;display:inline-block;position:relative;padding:0}.gallery ul li:nth-child(1),.gallery ul li:nth-child(2),.gallery ul li:nth-child(4),.gallery ul li:nth-child(5){margin-left:10px}.gallery ul li .box-image{width:100%;height:250px;display:block}.gallery .recent-content{bottom:25%;position:absolute;width:100%;z-index:2;padding:10px;text-align:right;box-sizing:border-box}.gallery .recent-title a,.headerbox_content h2{text-align:center;font-family:inherit;text-transform:uppercase}.gallery .recent-title a{display:block;font-size:17px;color:#fff;font-weight:700;line-height:1.5em;text-shadow:0 .5px .5px rgba(34,34,34,.3)}.gallery .recent-content .recent-title{background:rgba(0,0,0,.31);padding:10px;margin:10px}.recent-boxes .gallery{width:100%;float:right}.gallery-overlay{display:block;content:'';position:absolute;bottom:0;width:100%;height:100%;right:0;z-index:1;opacity:.8;transition:all .35s;-moz-transition:all .35s;-webkit-transition:all .35s;-o-transition:all .35s;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-t9E5rduqc26OhK7izqPYnExFhBONSm1mKXCEI9S0Z8RCFc5ki2EIN5mccfbqSYK8uzTwf45b5JU6PSS6LzVCBblK2C_iUAzFJnrSY_PB_8zfMGEAzVM6aKu0E0urKJ3cB_CpmhHOvUtR/s1600/pattern.png) top right rgba(58,78,90,.4)}.gallery li:hover .gallery-overlay{opacity:.2}@media screen and (max-width: 1100px) {.content-wrapper{max-width:98%}.gallery ul li {width: 45.7%;}}@media screen and (max-width: 800px){.content-wrapper{position:relative;width:100%;margin:0 auto}.gallery ul li {width: 47.7%;}.gallery ul li:nth-child(4) {margin-right: 9px!important;}}@media screen and (max-width: 240px){.content-wrapper{position:relative;width:100%;margin:0 auto}.gallery ul li {width: 100%!important;}}</style>


و الان إبحث على </body> وضع الكود التالي فوقه
/*اعدادات السلايدر*/

var node = document.createElement('script'); node.type = 'text/javascript'; node.async = true; node.src = '//rawgit.com/abdelalilebbihi/abdou_tech/master/gadget/script-label.js'; var runscript = document.getElementsByTagName('script')[0]; runscript.parentNode.insertBefore(node, runscript);

var NO_IMAGE = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6FhvSVIx-g57z_mhjXSgV1H8KAqjTofuOrRrSryjSk2vCvFKE-eIsGEvnJjNth1uiIFIuALb5Db7I-rv0RQU1TK5AQ4MbgTmwgzUomH-AbTcIIgwfd0Hby7jCa3FympjBCbDjjDcEUPk/s1600-r/nth.png"; // هنا صورة البديلة
والان ضع الكود التالي في المكان الذي تريد ضهور فيه سكربت
                                                                       <div class='box_gallery'<div class='content-wrapper'><div class='abdoutech_box' id='gallerybox'>

 <b:section class='glr_box' id='Gallery-box' preferred='yes'>

   <b:widget id='HTML2' locked='false' title='' type='HTML' version='1'>

     <b:widget-settings>

       <b:widget-setting name='content'><![CDATA[<span data-type="gallery" data-label="سينما"></span>]]></b:widget-setting>

     </b:widget-settings>

     <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'>

    <data:content/>

  </div>

</b:includable>

   </b:widget>

 </b:section>

</div>

</div>

</div>


الان احفظ القالب و اذهب الى التخطيط و غير التسمية فقط
<span data-type="gallery" data-label="هنا التسمية"></span
google-playkhamsatmostaqltradent