‏إظهار الرسائل ذات التسميات اضافات بلوجر. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات اضافات بلوجر. إظهار كافة الرسائل

17 يوليو 2016

إضافة سلايدر المشاركات الشائعة في بلوجر

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

إضافة سلايدر المشاركات الشائعة في بلوجر تُعد من الإضافات المُهمة في بلوجر ولها العديد من الميزات مثل التحكم بحجم الصور عرض المقالات حسب التسمية التحكم بسرعة التنقل والمزيد

السؤال الآن هو: كيف يُمكننا أنّ نُشجع الزائر على قراءة عدد قليل من المقالات أو أكثر من مقال في المدونة؟

أولًا إذا كُنت لا تعرف من أين يأتي الزوار أو ما هو مصدر جلب الزوار إلى المدونة يُنصح باستخدام Google Analytics مع أنّ هذا الأمر خارج موضوعنا ولكنّ استخدام خدمة جوجل هذه سوف تعود بالفائدة الكبيرة حيثُ يُمكننا تتبع مصدر الزيارات ومعرفة كل شيء عن زوار المدونة.

ولكنّ دائمًا يوجد لِدى المدون طُرق لجعل الزائر يتصفح أكثر من مقال، دون الحاجة للاعتماد على جلب الزيارات من محركات البحث والمواقع الأخرى. حيثُ أنّه يوجد بعض الإضافات من شأنها جذب الزوار للبقاء فترة أطول.

ولكنّ كيف يُمكن فعل ذلك؟

تكتيكات من أجل إقناع الزوار في البقاء فترة أطول

الكثير من المدونين يستخدمون عدة طرق وعدة تقنيات تقوم بجعل القراء يبقون فترة اطول. ومن أهل الطرق هي إضافة المشاركات الشائعة في السايد بار (الشريط الجانبي)، ولكنّ أكثر هذه الإضافات تكون ثابتة ولا تلفت الانتباه أو تجذب القارئ وتكون عبارةً عن صور صغيرة وثابتة، ولكنّ الآن إذا أردت جذب انتباه الزوار وتسليط الضوء على المشاركات الشائعة بشكلها الجديد والتي تعمل بتقنية السلايدر ويُمكن التحكم بحجمها مثل تغيير عرض أو طول الصور، التحكم بسرعة التنقل بين المواضيع، عرض عدد معين المشاركات والكثير من المميزات الرائعة الأخرى، والميزة التي يبحث عنها الكثير هي عرض المقالات حسب تسمية مُعينة حيثُ أنّه يُمكن عرض مقالات قِسم مُعين، ويُمكن معاينة الإضافة من خلال الزر التالي.

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

1- الدخول إلى لوحة تحكم بلوجر> التخطيط> إضافة آداة في السايدبار> الضغط HTML/JavaScript.
2- نسخ الكود التالي ولصقه داخل الآداة التي قُمنا بإضافتها.

<style type="text/css">
ul.featured-widget-list,ul.featured-widget-list li{margin:0;padding:0;list-style:none;position:relative }ul.featured-widget-list li{display:none}ul.featured-widget-list li:nth-child(1){display:block;line-height:0}ul.featured-widget-list img{border:0;width:100%;height:auto}ul.featured-widget-list .featuredbg{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimRF0XbXX7-_NPipfhYllfBqX6e1n_vZdj0p46GnlyJkr9tO8rQcR9CrhgxsETFTB734k0LhZzS93sH6g0teZgR3mdg18fhXvjoLeJ7NZGXa9OaLYr7jOr_mrBQn5Cdaaz7dVLXXsrdkM/s400/overlay-bg.png);background-position:0% 100%;background-repeat:repeat-x}ul.featured-widget-list .featuredbg:hover{opacity:.1}ul.featured-widget-list h5{position:absolute;left:0;right:0;text-align:center;bottom:10px;z-index:2;color:#fff;margin:0;text-transform: capitalize;padding:10px 20px;line-height:1.9em;font: 700 16px 'droid arabic kufi', sans-serif;overflow:hidden}ul.featured-widget-list li:hover h5{bottom:30px}ul.featured-widget-list .featured-meta{font: 11px 'droid arabic kufi', sans-serif;position:absolute;bottom:0;left:0;right:0;text-align:center;z-index:2;color:#fff;opacity:0}ul.featured-widget-list h5, ul.featured-widget-list .featured-meta {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}ul.featured-widget-list li:hover .featured-meta{bottom:20px;opacity:1}.feat-buttons{position:absolute;top:50%;left:0;z-index:5;width:100%}
.feat-buttons a{text-indent:-9999px;margin:0 7px;width:15px;height:15px;padding:9px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter: alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6;position:relative;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}.feat-prev{float:left;}.feat-next{float:right;}.feat-buttons a.feat-prev::before, .feat-buttons a.feat-next::before{content:"";width:0;height:0;border-width:6px 7px;border-style:solid;border-color:transparent #fff transparent transparent;position:absolute;top:50%;margin-top:-6px;margin-left:-11px;left:50%}
.feat-buttons a.feat-next::before{border-color:transparent transparent transparent #fff;margin-left:-3px}
</style>
<div id="featuredbwidget"></div>
<script type='text/javascript'>
//<![CDATA[
featuredbwidget({
listURL:"https://mudwnp.blogspot.com/",
featuredNum:9,
listbyLabel:false,
feathumbSize:350,
interval:3000,
autoplay:true,
featuredID:"#featuredbwidget"
});
function featuredbwidget(a){(function(e){var h={listURL:"",featuredNum:3,featuredID:"",feathumbSize:300,interval:5000,autoplay:false,loadingFeatured:"nextfeatured",pBlank:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLV6a0jbaxvp5autT8rI91cB9bgg29FaXN5y82yb30oJFF4w0KiIsvRwZMH1dLufJmNqUqboR_4jPDuf1irfFWu4ZdU2-oT9W8Ru8E977G59HCO3XWkaOror7_oBEUpItoiQRrDHVDytE/s500/no-image.png",byMonth:["يناير","فبراير","مارس","ابريل","مايو","يونيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","ديسمبر"],listbyLabel:false};h=e.extend({},h,a);var g=e(h.featuredID);var d=h.featuredNum*200;g.html('<div class="featslider"><ul class="featured-widget-list"></ul><div class="feat-buttons"><a href="#" class="feat-prev">Prev</a><a href="#" class="feat-next">Next</a></div></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.feathumbSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.feathumbSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.byMonth[parseInt(p,10)-1];l+='<li><a href="'+q+'"><div class="featuredbg"></div><img class="featuredthumb" src="'+u+'"/><h5>'+k+'</h5></a><div class="featured-meta"><span class="fdate"><span class="fday">'+t+'</span> <span class="fmonth">'+v+'</span> <span class="fyear">'+x+'</span></span> - <span class="fauthor">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingFeatured)};var c=function(){e(h.featuredID+" .feat-next").click()};var b=function(){e.get((h.listURL===""?window.location.protocol+"//"+window.location.host:h.listURL)+"/feeds/posts/summary"+(h.listbyLabel===false?"":"/-/"+h.listbyLabel)+"?max-results="+h.featuredNum+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.featuredID+" .feat-prev").click(function(){e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));return false});e(h.featuredID+" .feat-next").click(function(){e(h.featuredID+" .featslider li:last").after(e(h.featuredID+" .featslider li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.featuredID+" .featslider li:first").before(e(h.featuredID+" .featslider li:last"));e(h.featuredID+" .featslider").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingFeatured)},d)};e(document).ready(b)})(jQuery)};
//]]>
</script>

الإعدادات

listURL: استبدل رابط مدونتي https://mudwnp.blogspot.com/ برابط مدونتك.
featuredNum: تغيير عدد 9 للعدد الذي تُريده، حيثُ أنّه المسؤول عن عدد عرض المقالات.
listbyLabel: من أجل عرض مقالات قسم مُعين استبدل كلمة false بأسم القسم المراد عرض مقالاته.
feathumbSize: للتحكم بحجم أو بُعد الصورة.
interval: للتحكم بالوقت اللازم الخاص بالتنقل بين المقالات.
autoplay: للتحكم بحركة التنقل الخاصة بالمقالات ومن أجل وقف عمل السلايدر وجعله يدوي استبدل true بكلمة false.

3- بمجرد الانتهاء من إعدادات الكود يجب الضغط على حفظ.
أتمنى أنّ تكون أعجبتكم الإضافة، ويُمكن تطويرها للأفضل إذا كُنت تملك خبرة في CSS.

25 أبريل 2016

إضافة سلايدر شو تلقائي في السايدبار

إضافة سلايدر شو تلقائي في السايدبار يقوم بعرض المواضيع بشكل تلقائي أو على حسب التسمية

إضافة سلايدر شو تلقائي في السايدبار - في دروس سابقة لنا قمنا بالتعرف على أكثر من شكل للسلايدرات وأخرها كان اضافة سلايدر شو تلقائي في بلوجر، اليوم سوف نقوم بإضافة سلايدر عامودي يقوم بعرض أحدث المقالات التي تم إضافتها للمدونة مؤخرًا بشكل تلقائي، ويتُم إضافته في السايدبار (الشريط الجانبي)، والمُميز أيضًا بهذه الإضافة أنّه يُمكنك عرض المواضيع حسب التسمية بمعنى (عرض مواضيع قسم مُعين)، والتحُكم بالإضافة بشكل كامل.


إضافة سلايدر شو تلقائي في السايدبار

  1. ندخل لوحة تحكم بلوجر
  2. نقوم بالأنتقال إلى قسم تخطيط
  3. نضغط على إضافة أداة HTML/JavaScript
  4. نقوم بلصق الكود التالي في الأداة
  5. ثم نقوم بالحفظ

<style scoped="" type="text/css">
ul.rcentside *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box }ul.rcentside{font-size:11px}ul.rcentside,ul.rcentside li{margin:0;padding:0;list-style:none;position:relative }ul.rcentside{width:100%;height:500px }ul.rcentside li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none }ul.rcentside li:nth-child(1),ul.rcentside li:nth-child(2),ul.rcentside li:nth-child(3),ul.rcentside li:nth-child(4){display:block }ul.rcentside img{border:0;width:100%;height:auto}ul.rcentside li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0 }ul.rcentside li:nth-child(2){left:0;top:50% }ul.rcentside li:nth-child(3){left:50.5%;top:50% }ul.rcentside li:nth-child(4){width:100%;left:0;top:75% }ul.rcentside .overlayx,ul.rcentside li{transition:all .4s ease-in-out }ul.rcentside .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4EjooE1fuOtlbppyKL6Tbjo7BJ9QUCsNNXllnsS5zD90Jtinlrm3OT_XuwFDurLy-mNSttG7x5etqKaCPDFIZ7lvds7B4bKHZOTdLR3e5oP22EexFE8H8xkgOaDejofTh-nCUZfpE3Fw/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x }ul.rcentside .overlayx,ul.rcentside img{margin:3px}ul.rcentside li:nth-child(1).overlayx{background-position:50% 25% }ul.rcentside .overlayx:hover{opacity:.1 }ul.rcentside h4{position:absolute;bottom:10px;left:10px;right:10px;z-index:2;color:#fff;font-weight:700;margin:0;padding:10px;line-height:1.5em;font-weight:normal;overflow:hidden;transition:all .3s}ul.rcentside li:hover h4{bottom:30px}ul.rcentside li:nth-child(1)h4,ul.rcentside li:nth-child(4)h4{font-size:150% }ul.rcentside .label_text{position:absolute;bottom:0;left:20px;z-index:2;color:#fff;font-size:90%;opacity:0;transition:all .3s}ul.rcentside li:hover .label_text{bottom:20px;opacity:1}ul.rcentside li:nth-child(2).autname,ul.rcentside li:nth-child(3).autname{display:none }.buttons{margin:5px 0 0 }.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative }.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50% }.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px }
</style>
<div id="featuredpostside"></div>
<script type='text/javascript'>
function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:4,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["يناير","فبراير","مارس","ابريل","مايو","يونيو","يوليو","اغسطس","سبتمبر","اكتوبر","نوفمبر","ديسمبر"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="rcentside"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};
//<![CDATA[
FeaturedPostSide({
  blogURL: "http://aegygeek.com/",
  MaxPost: 8,
  idcontaint: "#featuredpostside",
  ImageSize: 300,
  interval: 5000,
  autoplay: true,
  tagName: false

});//]]>
</script>

تعديلات الكود

blogURL: قم باسبتدال رابط المدونة التالية http://www.aegygeek.com برابط مدونتك.
MaxPost: 8: هذا الوسم هو المسؤول عن عدد المواضيع التي سوف يتم عرضها.
ImageSize: 300: المسؤول عن حجم وأبعاد الصورة بالبكسل.
interval: 5000: الفاصل الزمني بين التنقل في المواضيع.
autoplay: وهو المسؤول عن عرض المواضيع بشكل تلقائي ولإيقافها قم باستبدال true بالكلمة التالية false.
tagName: وهو المسؤول عن عرض المواضيع حسب التسمية بحيث يجب عليك تغيير كلمة false باسم القسم الخاص بك.

أتمنى أنّ تكون الإضافة أعجبتكم بالتوفيق

23 أبريل 2016

تقسيم المقال إلى عدة صفحات بتقنية السلايدر في بلوجر

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

كيفية تقسيم محتوى المقال إلى عدة صفحات بتقنية السلايدر في بلوجر، والتي قد تكون مفيدة للكثير من المدونين وخصيصًا للمدونات الأخبارية والتقنية.

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


تقسيم محتوى المقال إلى صفحات مُتعددة

1. توجه إلى لوحة تحكم بلوجر> انتقل على تبويب قالب>اضغط على تحرير HTML> ابحث عن الوسم التالي ]]></b:skin> وأضف الكود التالي فوقه.

/* Multiple Page Slide */
a.movepg.nexter,a.movepg.prever{color:#fff}
.separator{overflow:hidden;max-height:240px;margin:0 0 20px}.separator img{background:#eee;max-width:100%;vertical-align:middle;background-position:middle;border:0;height:auto;width:100%}.next-wrap img,.next-wrap video,.next-wrap object{max-width:100% }.next-wrap{position:relative;padding:0 0 0 40px;line-height:normal;}.instruction{display:block;height:100%;width:100%;overflow:hidden}.slidecontentWrap{width:1000%}.slidecontent{direction: rtl;float:left;width:10%;line-height:161%;overflow:hidden}.movepg{display:none;position:absolute;bottom:20px;background:#e74c3c;color:#fff;font-weight:700;text-transform:uppercase;padding:6px 12px;cursor:pointer;font-size:80%;outline:none;border-radius:3px;transition:background .6s}.movepg:hover{background:#c0392b}.movepg.prever{left:20px}.movepg.nexter{right:20px}

2. قم بنسخ الكود التالي فوق الوسم </body>.

<script type='text/javascript'>
//<![CDATA[
function updateBtnState(){0==index?$(".prever").hide():$(".prever").show(),index==maxIndex?$(".nexter").hide():$(".nexter").show()}var index=0,maxIndex=4;$(".nexter").on("click",function(e){if(index++,index>maxIndex)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),$(".prever").on("click",function(e){if(index--,0>index)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),updateBtnState();
//]]>
</script>

لإضافة صفحات أكثر قم بتغيير maxIndex=4 إلى الرقم الذي تريده.

3. الآن قم بحفظ القالب.

الخطوة التالية، عند انشاء موضوع جديد قم بنسخ الكود التالي في وضع HTML

<div class="next-wrap">
  <div id="photocons" class="instruction">
    <div class="slidecontentWrap">
      <div class="slidecontent">
        <-- هُنا يتم كتابة المحتوى -->
      </div>
      <div class="slidecontent">
        <-- هُنا يتم كتابة المحتوى -->
      </div>
      <div class="slidecontent">
        <-- هُنا يتم كتابة المحتوى -->
      </div>
      <div class="slidecontent">
        <-- هُنا يتم كتابة المحتوى -->
      </div>
      <div class="slidecontent">
        <-- هُنا يتم كتابة المحتوى -->
      </div>
      </div>
      </div>
      <a class="movepg prever">السابق</a>
      <a class="movepg nexter">التالي</a>
</div>

الآن قم بنشر المقال لرؤية النتائج.
وهكذا قد نكون أنتهينا من التعرف على كيفية تقسيم محتوى المقال إلى عدة صفحات بتقنية السلايدر، والتي قد تكون مُفيدة للكثير من المدونين، بالتوفيق.

10 أبريل 2016

إضافة شريط آخر الأخبار المطور في بلوجر

في درس سابق لنا قُمنا بالتعرف على اضافة شريط آخر الأخبار المتحرك بشكل احترافي، اليوم سوف نقوم بإضافة نفس الشريط ولكن بطريقة أحترافية أكثر. حيث أنّنا سوف نقوم بتركيب إضافة شريط آخر الأخبار يعرض المقالات على شكل صور مُصغرة.

كيفية إضافة شريط آخر الأخبار المطور في بلوجر يقوم بعرض المواضيع على شكل صور مصغرة.

المُميز بهذا الشريط هو أنّه خفيف على المدونة ولا يقوم بجعلها بطيئة أو ثقيلة اثناء المُتصفح، وظيفته تكون على الشكل التالي، وهي عرض المواضيع على شكل صور مصغرة بجانبها العنوان وتحتها اسم الكاتب وتاريخ نشر المقالات، ويقوم بعرض المقالات التي تم نشرها مؤخرًا في المدونة.


تركيب شريط آخر الأخبار المطور

  1. أولاً قم بالدخول إلى لوحة تحكم بلوجر
  2. توجه إلى قسم قالب
  3. أنقر على تحرير HTML

أبحث عن ]]></b:skin> أو </style> وأضف الكود التالي فوقه.
 /* CSS News Ticker */
.ticker-wrap{display:block;text-align:center;margin:0 20px 20px 20px;padding:2px;background:#fefefe;border:1px solid rgba(0,0,0,0.1);border-right:5px solid #3cc091}
.ticker-wrap>span{display:inline-block;background:#fefefe;padding:0;font:700 13px 'roboto',sans-serif}
.ticker-wrap>span>a{color:#222;text-decoration:none}
#ticker{height:45px;direction:rtl;overflow:hidden;background:#fefefe;text-align:right}
#ticker ul{direction:rtl;padding:0;margin:0;list-style:none}
#ticker ul li{height:45px;direction:rtl;white-space:nowrap}
#ticker ul li img{float:right;direction:rtl;width:35px;height:35px;margin:5px 5px 5px 7px}
#ticker ul li h3{margin:0;direction:rtl;font:700 12px 'droid arabic kufi',sans-serif}
#ticker ul li h3 a{color:#333;direction:rtl;text-decoration:none;line-height:25px!important}
#ticker ul li .tickermeta{font:700 12px 'droid arabic kufi',sans-serif;line-height:20px!important;direction:rtl;color:#999}

يُمكنك التعديل على اللون والخط من خلال الكود السابق.
لآن أبحث عن <body> أو </body> وأضف الكود التالي فوقه.
<script type='text/javascript'>
//<![CDATA[
// Breaking News ticker by http://mudwnp.blogspot.com/
function getauthor(t){for(var e=0;e<t.length;e++)var i=t[e].name.$t;return i}function getmeta(t){var e=[];e[1]="يناير",e[2]="فبراير",e[3]="مارس",e[4]="أبريل",e[5]="مايو",e[6]="يونيو",e[7]="يوليو",e[8]="أغسطس",e[9]="سبتمبر",e[10]="أكتوبر",e[11]="نوفمبر",e[12]="ديسمبر";var i=t.substring(0,4),a=t.substring(5,7),n=t.substring(8,10),r=e[parseInt(a,10)]+" "+n+" "+i;return r}function arlinadesignTicker(t){var e=document.querySelector("#ticker"),i=t.feed.entry,a="<ul id='ticket-wrapper-inner'>";if(i){for(var n=0;n<i.length;n++){for(var r=i[n],s=0;s<r.link.length;s++)if("alternate"==r.link[s].rel){var l=r.link[s].href;break}try{var o='<img src="'+r.media$thumbnail.url+'"/>'}catch(t){var o=""}var u=r.title.$t,c=getauthor(r.author),d=getmeta(r.published.$t);a+="<li>"+o+'<h3><a href="'+l+'">'+u+'</a></h3><div class="tickermeta"><span>'+c+"</span> - <span>"+d+"</span></div></li>"}a+="</ul>",e.innerHTML=a}$("#ticker").vTicker()}!function(t){var e={speed:700,pause:4e3,showItems:1,mousePause:!0,height:0,animate:!0,margin:0,padding:0,startPaused:!1},i={moveUp:function(t,e){i.animate(t,e,"up")},moveDown:function(t,e){i.animate(t,e,"down")},animate:function(e,i,a){var n=e.itemHeight,r=e.options,s=e.element,l=s.children("ul"),o="up"===a?"li:first":"li:last";s.trigger("vticker.beforeTick");var u=l.children(o).clone(!0);if(0<r.height&&(n=l.children("li:first").height()),n+=r.margin+2*r.padding,"down"===a&&l.css("top","-"+n+"px").prepend(u),i&&i.animate){if(e.animating)return;e.animating=!0,l.animate("up"===a?{top:"-="+n+"px"}:{top:0},r.speed,function(){t(l).children(o).remove(),t(l).css("top","0px"),e.animating=!1,s.trigger("vticker.afterTick")})}else l.children(o).remove(),l.css("top","0px"),s.trigger("vticker.afterTick");"up"===a&&u.appendTo(l)},nextUsePause:function(){var e=t(this).data("state"),i=e.options;e.isPaused||2>e.itemCount||a.next.call(this,{animate:i.animate})},startInterval:function(){var e=t(this).data("state"),a=this;e.intervalId=setInterval(function(){i.nextUsePause.call(a)},e.options.pause)},stopInterval:function(){var e=t(this).data("state");e&&(e.intervalId&&clearInterval(e.intervalId),e.intervalId=void 0)},restartInterval:function(){i.stopInterval.call(this),i.startInterval.call(this)}},a={init:function(n){a.stop.call(this);var r=jQuery.extend({},e);n=t.extend(r,n);var r=t(this),s={itemCount:r.children("ul").children("li").length,itemHeight:0,itemMargin:0,element:r,animating:!1,options:n,isPaused:n.startPaused?!0:!1,pausedByCode:!1};t(this).data("state",s),r.css({overflow:"hidden",position:"relative"}).children("ul").css({position:"absolute",margin:0,padding:0}).children("li").css({margin:n.margin,padding:n.padding}),isNaN(n.height)||0===n.height?(r.children("ul").children("li").each(function(){var e=t(this);e.height()>s.itemHeight&&(s.itemHeight=e.height())}),r.children("ul").children("li").each(function(){t(this).height(s.itemHeight)}),r.height((s.itemHeight+(n.margin+2*n.padding))*n.showItems+n.margin)):r.height(n.height);var l=this;n.startPaused||i.startInterval.call(l),n.mousePause&&r.bind("mouseenter",function(){!0!==s.isPaused&&(s.pausedByCode=!0,i.stopInterval.call(l),a.pause.call(l,!0))}).bind("mouseleave",function(){(!0!==s.isPaused||s.pausedByCode)&&(s.pausedByCode=!1,a.pause.call(l,!1),i.startInterval.call(l))})},pause:function(e){var i=t(this).data("state");if(i){if(2>i.itemCount)return!1;i.isPaused=e,i=i.element,e?(t(this).addClass("paused"),i.trigger("vticker.pause")):(t(this).removeClass("paused"),i.trigger("vticker.resume"))}},next:function(e){var a=t(this).data("state");if(a){if(a.animating||2>a.itemCount)return!1;i.restartInterval.call(this),i.moveUp(a,e)}},prev:function(e){var a=t(this).data("state");if(a){if(a.animating||2>a.itemCount)return!1;i.restartInterval.call(this),i.moveDown(a,e)}},stop:function(){t(this).data("state")&&i.stopInterval.call(this)},remove:function(){var e=t(this).data("state");e&&(i.stopInterval.call(this),e=e.element,e.unbind(),e.remove())}};t.fn.vTicker=function(e){return a[e]?a[e].apply(this,Array.prototype.slice.call(arguments,1)):"object"!=typeof e&&e?void t.error("Method "+e+" does not exist on jQuery.vTicker"):a.init.apply(this,arguments)}}(jQuery),$(function(){var t=document.createElement("script");t.src="http://"+$(".ticker-wrap").data("domain")+"/feeds/posts/summary?alt=json&callback=arlinadesignTicker",t.type="text/javascript",document.getElementsByTagName("body")[0].appendChild(t)});
//]]>
</script>

الآن الكود الأخير وهو من أجل ظهور شريط الأخبار، هذا الكود يُمكنك وضعه في المكان الذي تريده على حسب ما تجده مُناسب.
من أجل أنّ تظهر المواضيع قم بتغيير رابط aegygeek.com برابط مدونتك.

<div class='ticker-wrap' data-domain='aegygeek.com'>
<div id='ticker'>
</div>
</div>

الآن قم بحفظ القالب ومبروك عليك الإضافة.
إذا كان يوجد أي مشاكل في الإضافة أتمنى ذكرها ضمن التعليقات.

30 مارس 2016

سكربت عرض المواضيع حسب التسمية الإصدار الثاني

إضافة سكربت عرض المواضيع الإصدار الثاني الإحترافي في بلوجر

في موضوعنا السابق قُمنا بطرح إضافة سكربت عرض المواضيع حسب التسمية في بلوجر، اليوم سوف نُشارككم نفس السكربت ولكن بشكل مختلف، حيث من خلال السكربت الجديد تستطيع التحكم به بشكل كامل كتغيير شكل عرض المواضيع وزيادة عدد المواضيع والكثير من الأمور على حسب ذوقك وما يُناسب مدونتك ولكنّك تحتاج إلى خبرة بسيطة في كل من CSS وHTML.

السكربت عبارة عن صورة رئيسية في البداية و ثمانية مواضيع على شكل شبكة ويُمكن زيادتهم أو انقاصهم على حسب ما يُناسبك، وهو خفيف على المدونة ولن يؤثر على سُرعتها. يُمكنك مُعاينة شكل السكريبت من خلال الزر التالي.


كيفية تثبيت سكربت عرض الموضيع حسب التسميات

ادخل إلى لوحة تحكم بلوجر
انقر على قالب
ثم انقر على تحرير HTML

ابحث عن الوسم </head> و اضف الكود التالي فوقه
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<style type='text/css'>
/* CSS Recent Post by Label */
#HTML90{margin-right: 6px;}
#HTML91{margin-right: 6px;}
.mudwnplabel1 ul,.mudwnplabel2 ul{list-style:none;margin:0;padding:0}
.mudwnplabel1 li,.mudwnplabel2 li{margin:0;padding:0}
.mudwnplabel1 .widget,.mudwnplabel2 .widget{font-family:'Droid Arabic Kufi',sans-serif!important;font-family:13px;margin:0;padding:0}
.mudwnplabel1 .widget-content,.mudwnplabel2 .widget-content{padding:0;margin:0;word-wrap:break-word;overflow:hidden}
.mudwnplabel1 h2,.mudwnplabel2 h2{position:relative;margin:0;padding:15px 0;font-size:12px;font-weight:700;border-bottom:1px solid #ddd}
.mudwnplabel2 h2{margin:20px 0 0}
.data-title:before{content:'\f143';left:10px;bottom:0;font-family:FontAwesome;font-style:normal;font-weight:400;margin:0 0 0 10px;color:#07ACEC}
.data-title{margin-right: 6px;color:#07ACEC;border:1px solid #07ACEC;padding:3px 8px;border-radius:2px;margin-left:10px;font-size:10px;font-weight:700}
.mudwnplabel1 .index,.mudwnplabel2 .index{font-size:10px;font-weight:700}
.mudwnplabel1 .index a,.mudwnplabel2 .index a{color:#07ACEC;padding:3px 8px;border-radius:2px;font-weight:400;border:1px solid #29b6f6;color:#07ACEC;border-color:#07ACEC}
.mudwnplabel1 .index a:hover,.mudwnpabel2 .index a:hover{background:#07ACEC;color:#fff;border-color:transparent}
.mudwnplabel1 .index a:after{content:"\f104";font-family:FontAwesome;font-style:normal;font-weight:700;text-decoration:inherit;padding-right:5px}
.mudwnplabel2 .index a:after{content:"\f104";font-family:FontAwesome;font-style:normal;font-weight:700;text-decoration:inherit;padding-right:6px}
.mudwnplabel2 span.mudwnp_meta_comment a:hover{color:#07ACEC!important}
.mudwnplabel2 ul.mudwnp_thumbs li a:hover,.mudwnplabel2 ul.mudwnp_thumbs2 li a:hover{color:#07ACEC;text-decoration:none}
.mudwnp_right{margin:0;padding:0;border-left:1px solid #fff}
.mudwnp_right .cat_thumb{float:right;margin-left:10px!important}
.mudwnp_left{float:right;margin-top:-35px;padding:0}
ul.mudwnp_thumbs{margin:0;padding:0}
ul.mudwnp_thumbs li,ul.mudwnp_thumbs2{margin:0;padding:0}
ul.mudwnp_thumbs .cat_thumb{position:relative;margin:0 0 15px;padding:0;width:280px;height:200px}
ul.mudwnp_thumbs .cat_thumb img{border-radius: 4px;margin-right: 2px;height: 160px;width:100%;transition:all .2s}
ul.mudwnp_thumbs .cat_thumb img:hover{opacity:.9}
ul.mudwnp_thumbs2 li{margin:0 0 10px;padding:0 0 10px;width:27%;overflow:hidden;min-height:74px;float:right;margin-left:10px!important;border-bottom:1px solid #e9e9e9}
ul.mudwnp_thumbs2 li:last-child{border-bottom:none;margin:0;padding:0}
ul.mudwnp_thumbs2 .cat_thumb2{float:right;margin:0 0 0 10px;height:72px;overflow:hidden}
ul.mudwnp_thumbs2 .cat_thumb2 img{border-radius: 3px;margin-right: 2px;height:60px;transition:all .2s}
ul.mudwnp_thumbs2 .cat_thumb2 img:hover{opacity:.9}
span.mudwnp_title{font-family:'Droid Arabic Kufi',sans-serif;font-size:12px!important;font-weight:700;display:block;margin:0 0 10px;line-height:normal;text-transform:none;max-height:45px;overflow:hidden}
span.mudwnp_title2{font-size:12px!important;font-weight:700!important;line-height:1.4em;margin:0 0 3px;max-height:38px}
span.mudwnp_title a{color:#333}span.mudwnp_title a:hover{color:#07ACEC;text-decoration:none}
span.mudwnp_summary{display:block;line-height:1.6em;font-size:11px;width: 87%;text-overflow:ellipsis;margin:10px 0 0}
span.mudwnp_meta{display:block;font-family:'Droid Arabic Kufi',sans-serif;font-size:11px;font-weight:400;color:#aaa;text-transform:uppercase}
span.mudwnp_meta a{color:#aaa;display:inline-block}
span.mudwnp_meta_date,span.mudwnp_meta_comment,span.mudwnp_meta_more{display:inline-block;margin-left:10px}
span.mudwnp_meta_comment a:before{content:"\f0e6";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:5px}
span.mudwnp_meta_comment a:hover{color:#07ACEC!important}
span.mudwnp_meta_date:before{content:"\f133";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;padding-left:5px}
ul.mudwnp_thumbs2 li a:hover,ul.mudwnp_thumbs li a:hover{color:#07ACEC;text-decoration:none}
@media only screen and (max-width:768px){.tanggal i,.tags i{color:#ff8000!important}.mudwnp_left{width:100%;float:right;margin:0;padding:0}span.mudwnp_title2{max-height:33px!important}ul.mudwnp_thumbs2 li{border-bottom:0;width:58%;overflow:hidden;min-height:60px}.mudwnplabel1 .widget-content,.mudwnplabel2 .widget-content{margin-top:10px}span.mudwnp_summary,.mudwnp_right{display:none}span.mudwnp_title a{font-weight:700}span.mudwnp_title{margin:0 0 5px}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px;border-bottom:0}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
@media only screen and (max-width:320px){ul.mudwnp_thumbs2 .cat_thumb2 img{width:80px;height:50px}.mudwnp_left{width:100%;float:right;margin:0;padding:0}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
@media screen and (max-width:260px){.mudwnp_left{width:100%;float:right;margin:0;padding:0}ul.mudwnp_thumbs li{margin:0 0 10px;padding:0 0 10px}span.mudwnp_title2{font-size:18px;line-height:1.2em}}
</style>
</b:if>
</b:if>

الآن الخطوة الثانية وهي إضافة كود جافا سكربت فوق </head> أيضًا
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(t){for(var e=0;e<numposts;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=0;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}var u;try{u=r.media$thumbnail.url,u=u.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb}var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10),g=new Array;g[1]="يناير",g[2]="فبراير",g[3]="مارس",g[4]="ابريل",g[5]="مايو",g[6]="يونيو",g[7]="يوليو",g[8]="أغسطس",g[9]="سبتمبر",g[10]="أكتوبر",g[11]="نوفمبر",g[12]="ديسمبر",document.write('<span class="mudwnp_right">'),document.write('<ul class="mudwnp_thumbs">'),document.write("<li>"),1==showpostthumbnails&&document.write('<a href="'+n+'"><div class="cat_thumb"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+m+'" src="'+u+'"/></div></a>'),document.write('<span class="mudwnp_title"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";if(document.write('<span class="mudwnp_meta">'),1==showpostdate&&(v=v+'<span class="mudwnp_meta_date">'+g[parseInt(_)]+" "+f+", "+w+"</span>"),1==showcommentnum&&("1 تعليقات"==l&&(l="1 تعليقات"),"0 تعليقات"==l&&(l="0 تعليقات"),showcomment='<span class="mudwnp_meta_comment"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore&&(v=v+'<span class="mudwnp_meta_more"><a href="'+n+'" class="url" target ="_top">إقرأ المزيد...</a></span>'),document.write(v),document.write("</span>"),document.write('<span class="mudwnp_summary">'),"content"in r)var y=r.content.$t;else if("summary"in r)var y=r.summary.$t;else var y="";var k=/<\S[^>]*>/g;if(y=y.replace(k,""),1==showpostsummary)if(y.length<numchars)document.write(""),document.write(y),document.write("");else{document.write(""),y=y.substring(0,numchars);var $=y.lastIndexOf(" ");y=y.substring(0,$),document.write(y+"..."),document.write("")}document.write("</span>"),document.write("</li>"),document.write("</ul>"),document.write("</span>")}document.write('<span class="mudwnp_left">'),document.write('<ul class="mudwnp_thumbs2">');for(var e=1;e<numposts2;e++){var n,r=t.feed.entry[e],m=r.title.$t;if(e==t.feed.entry.length)break;for(var i=1;i<r.link.length;i++){if("replies"==r.link[i].rel&&"text/html"==r.link[i].type)var l=r.link[i].title,o=r.link[i].href;if("alternate"==r.link[i].rel){n=r.link[i].href;break}}var x;try{x=r.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(h){s=r.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),x=-1!=a&&-1!=b&&-1!=c&&""!=d?d:no_thumb2}var p=r.published.$t,w=p.substring(0,4),_=p.substring(5,7),f=p.substring(8,10);1==showpostthumbnails2&&document.write('<a href="'+n+'"><div class="cat_thumb2"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+m+'" src="'+x+'"/></div></a>'),document.write("<li>"),document.write('<span class="mudwnp_title mudwnp_title2"><a href="'+n+'" target ="_top">'+m+"</a></span>");var v="";document.write('<span class="mudwnp_meta mudwnp_meta2">'),1==showpostdate2&&(v=v+'<span class="mudwnp_meta_date">'+g[parseInt(_)]+" "+f+", "+w+"</span>"),1==showcommentnum2&&("1 تعليق"==l&&(l="1 تعليقات"),"0 تعليق"==l&&(l="0 تعليقات"),showcomment='<span class="mudwnp_meta_comment mudwnp_meta_comment2"><a href="'+o+'">'+l+"</a></span>",v+=showcomment),1==displaymore2&&(v=v+'<span class="mudwnp_meta_more mudwnp_meta_more2"><a href="'+n+'" class="url" target ="_top">إقرأ المزيد...</a></span>'),document.write(v),document.write("</span>"),document.write("</li>")}document.write("</ul>"),document.write("</span>")}
//]]>
</script>
<script type='text/javascript'>
var numposts=1,numposts2=9,showpostthumbnails=!0,showpostthumbnails2=!0,displaymore=!1,displaymore2=!1,showcommentnum=!0,showcommentnum2=!1,showpostdate=!0,showpostdate2=!0,showpostsummary=!0,numchars=150,thumb_width=310,thumb_height=160,thumb_width2=100,thumb_height2=55,no_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjE_Uy50rmDqlKYXNerEFozzjaJwhpW-SpuMOim1Q9dSed72-EStKGFX2YsISare0Jt-mI8jJ_dUGCefc0juIiwirOt3AGG4WO6f0SBQQwwxJ8oAfDpYdnkH68kgDFzR0DpPVY9DRJOQg/s320/mudwnp_thumb.png",no_thumb2="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDO2plt3O_ZAeKean2exI7kGkHfDp3WKU_8G0Kpdx366WqCquW8uCCBP3kHSqYyAp8R7v-UPupQLyMiN4iWKKQ8hSVJWwyik1xJhcqJv4w8ijh-5co6sauk9E4SijllhzpQcAcZuDfKg4/s1600/mudwnpthumb_small.png";
</script>

</b:if>
</b:if>

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

الخطوة الثانية وهي إضافة كود السكربت

<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <div id='mudwnplabel1-wrapper'>
        <b:section class='mudwnplabel1' id='mudwnplabel1' maxwidgets='1' showaddelement='yes'>
          <b:widget id='HTML90' locked='false' title='Berita' type='HTML'>
            <b:includable id='main'>
<h2><span class='data-title'><data:content/></span><span class='index'>&lt;a href=&#39;/search/label/<data:content/>?&amp;max-results=8&#39;&gt;مشاهدة الكل&lt;/a&gt;</span></h2>
<div class='widget-content'>
<script>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/<data:content/>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
</div>
</b:includable>
          </b:widget>
        </b:section>
      </div>
<div id='mudwnplabel2-wrapper'>
        <b:section class='mudwnplabel2' id='mudwnplabel2' maxwidgets='1' showaddelement='yes'>
          <b:widget id='HTML91' locked='false' title='Info Menarik' type='HTML'>
            <b:includable id='main'>
<h2><span class='data-title'><data:content/></span><span class='index'>&lt;a href=&#39;/search/label/<data:content/>?&amp;max-results=8&#39;&gt;مشاهدة الكل&lt;/a&gt;</span></h2>
<div class='widget-content'>
<script>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/<data:content/>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
</div>
</b:includable>
          </b:widget>
        </b:section>
      </div>
</b:if>

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

أتمنى أنّ يكون أعجبكم السكربت وانتظرونا بقوالب بلوجر جديدة إن شاء الله.
وإذا احتجت إلى أي مُساعدة في تركيب السكربت أترك تعليق.