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

عبدو تكنولوجي - Abdou Technologie

2 مايو 2018

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

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

تركيب الاضافة سهل جدا اولا يمكنك معاينتها من هنا

الان نبدا بشرح التركيب

إبحث على </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://4.bp.blogspot.com/--OzH85Gymqc/Wdim0oCVnaI/AAAAAAAAA48/89VTnKzv4HEVKS3tixaIiUbI3PPbjnOWgCLcBGAs/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> وضع الكود التالي فوقه

الان احفظ القالب و اذهب الى التخطيط و غير التسمية فقط

<span data-type="gallery" data-label="هنا التسمية"></span

اذا اعجبتك التدوينة لا تنسى الاشتراك في المدونة لكي تتوصل بكل ما هوا جديد من هنا

يسعدنا تفاعلكم بالتعليق ولكن نرجو منكم أن يكون خاص بالموضوع

Unknown 3 مايو 2018 في 8:49 م

إضافة جميلة لكن نريد أحسن من كده بكتير
- عبدو تكنولوجي - Abdou Technologie 4 مايو 2018 في 4:26 ص
  
  (k)

ترافل فلاش 6 مايو 2018 في 7:49 ص

الكود الثاني يوجد مثله كثير ما اسمه بالكامل
- عبدو تكنولوجي - Abdou Technologie 6 مايو 2018 في 11:26 ص
  
  اسمه ب الكامل هكذا
  
  </body>

Aouadi Ilyas 9 مايو 2018 في 11:52 م

هناك خلل في الكود الثاني

شرقاوى ويب 25 مايو 2018 في 12:02 م

تم اخى فعلت كل الشروط سابقا

ahmed368555@gmail.com

https://cima-7up.blogspot.com

شكرا جزيلا (k)

ADMIN 16 يونيو 2019 في 8:16 م

الكود التاني فيه مشكة ياريت يكون اسكريبت جافا