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


من أفضل وأحسن السكربتات المنظمة التي ستجدونها متوفرة منها سكربت عرض المواضيع حسب التسميات، حقا إضافة جد مفيدة لأصحاب كثرة الأقسام بموقعهم يتميز بعرض المواضيع على شكل شبكة (GRID) كما يحتوي على عنوان وأيضا يمكن تخصيص كل قسم على حسب عدد المواضيع التي تريد إظهارها به.
قد لا يناسب موقعك من حيث شكله لذا وجب اختيار له مكان مناسب وكذلك أن تكون على دراية بالتعديل على الأكواد الخاصة بالستايل، سأقدم شرح التركيب ومفهومه والبقية منوط بكم
شرح  طريقة التركيب
1 . توجه لقالب >> تحرير 
2.  ابحث عن ]]></b:skin> ضع الكود التالي فوقه أو ضعه بين <style>   </style> فوق </head>

#tabber-wrapper {width: 96%;float: right;overflow: hidden;margin: 13px;border: 1px solid #EAEAEA;background: #fff;margin-right: 10px;}
.tabber .column_img:hover {margin-bottom: 12px;opacity: .9;}
ul.tab-view{float:right;list-style:none;height:25px;width:99%;margin:0;padding:5px 5px 6px;font-family: droid arabic kufi;font-size: 12px;background:#444444}
ul.tab-view li{float:right;height:26px;line-height:26px;overflow:hidden;position:relative;margin:0;padding:0; margin-left:9px;}
ul.tab-view li a{text-decoration:none;color:#fff;display:block;outline:none;font-weight:400;padding:0 15px;}
html ul.tab-view li.active,html ul.tab-view li.active a,html ul.tab-view li.active a:hover{color:#fff;background:#FC4F3F;border-radius:2px;text-shadow:none}
.tab-wrapper{overflow:hidden;clear:both;float:right;width:100%;margin-bottom:10px;}.tabber{padding:5px 0 0}
.tabber .column{ float: right;display: inline;width: auto;height: 150px;margin-right: 13px;padding: 2px 2px 5px;}
.tabber .column_img{background: #fff;padding: 0px;width: 200px;height: 150px;margin: 5px 0px 0px;border: 1px solid #DBDBDB;}
.tabber h2{line-height: 16px;text-align: center;background: #FC4F3F;padding: 10px 0 10px 21px;width: 179px;position: relative;bottom: 50px;opacity: .9;font-family: cursive;font-size: 12px;margin-left: 1px;}.tabber h2 a{color:#FFF;}.tabber h2 a:hover{color:#FFF;text-decoration:none;}
* المحدد بالأحمر هو عرض الصندوق
3. إبحث عن </head> وضع الكود التالي فوقه
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "http://i.imgur.com/7WK8lcQ.png";
showRandomImg = true;
aBold = true;
summaryPost = 100;
summaryPost1 = 200;
numposts =
9;
numposts1 =
9;
numposts2 =
9;
numposts6 =
9;
Title1 = "
عنوان 1";
Title2 = "
عنوان 2";
Title3 = "
عنوان 3";
Title4 = "
عنوان 4";
Title5 = "
عنوان 5";
Title6 = "
عنوان 6";
//]]></script>
<script src='https://ar1web-com.googlecode.com/svn/trunk/flexcroll.js'/>
* المحدد بالأحمر ضع عناوين
* الأرقام المحددة بالبرتقالي هي عدد ظهور المواضيع في كل قسم يمكنك تغييرها حسب ما تريد
إذا أردت إضافة قسم آخر فأضف هذا الكود تحت إخوته : Title7 = "عنوان 7"; 
4. الكود التالي ضعه بالمكان الذي تراه مناسب
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static&quot;'>
<div class='cf' id='tabber-wrapper'>
<ul class='tab-view'>
<li><a href='#tab1'><script>document.write(Title1);</script></a></li>
<li><a href='#tab2'><script>document.write(Title2);</script></a></li>
<li><a href='#tab3'><script>document.write(Title3);</script></a></li>
<li><a href='#tab4'><script>document.write(Title4);</script></a></li>
<li><a href='#tab5'><script>document.write(Title5);</script></a></li>
<li><a href='#tab6'><script>document.write(Title6);</script></a></li>

</ul><div class='clear'/>
<div class='tab-wrapper'>
<div class='tabber' id='tab1'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 1?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab2'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 2?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab3'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 3?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab4'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 4?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab5'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 5?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab6'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
قسم 6?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>

<div class='clear'/>
</div></div>
</b:if> </b:if>
<script type='text/javascript'>
//<![CDATA[
var _0x3c49=["\x68\x69\x64\x65","\x2E\x74\x61\x62\x62\x65\x72","\x73\x68\x6F\x77","\x61\x63\x74\x69\x76\x65","\x61\x64\x64\x43\x6C\x61\x73\x73","\x75\x6C\x2E\x74\x61\x62\x2D\x76\x69\x65\x77\x20\x6C\x69\x3A\x66\x69\x72\x73\x74","\x2E\x74\x61\x62\x62\x65\x72\x3A\x66\x69\x72\x73\x74","\x72\x65\x6D\x6F\x76\x65\x43\x6C\x61\x73\x73","\x75\x6C\x2E\x74\x61\x62\x2D\x76\x69\x65\x77\x20\x6C\x69","\x68\x72\x65\x66","\x61\x74\x74\x72","\x61","\x66\x69\x6E\x64","\x66\x61\x64\x65\x49\x6E","\x63\x6C\x69\x63\x6B","\x72\x65\x61\x64\x79"];jQuery(document)[_0x3c49[15]](function (){$(_0x3c49[1])[_0x3c49[0]]();$(_0x3c49[5])[_0x3c49[4]](_0x3c49[3])[_0x3c49[2]]();$(_0x3c49[6])[_0x3c49[2]]();$(_0x3c49[8])[_0x3c49[14]](function (){$(_0x3c49[8])[_0x3c49[7]](_0x3c49[3]);$(this)[_0x3c49[4]](_0x3c49[3]);$(_0x3c49[1])[_0x3c49[0]]();var _0x88b3x1=$(this)[_0x3c49[12]](_0x3c49[11])[_0x3c49[10]](_0x3c49[9]);$(_0x88b3x1)[_0x3c49[13]]();return false;} );} );

//]]>
</script>
* هذه العملية هي التممة إذا أردت إضافة قسم آخر فعليك إضافة العنوان والذي ذكرته سابقاً كما ترى المحدد باللون الأخضر يوجد بهم ستة أكواد أضف السابع تحت السادس هكذا يكون الكود :
<li><a href='#tab7'><script>document.write(Title7);</script></a></li>
وتبقى مرحلة آخيرة وهي تكرار الكود تحت أخيه المحدد باللون البرتقالي هكذا :

<div class='tabber' id='tab7'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/
مجانيات?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
* لا تنسى تغيير التسميات : قسم 1قسم 2قسم 3قسم 4,قسم 5,قسم 6
سكربت عرض المواضيع حسب التسميات 4.5 5 Unknown الأربعاء، 19 أغسطس 2015 من أفضل وأحسن السكربتات المنظمة التي ستجدونها متوفرة منها سكربت عرض المواضيع حسب التسميات، حقا إضافة جد مفيدة لأصحاب كثرة الأقسام بموقعهم يت...


On : الأربعاء، 19 أغسطس 2015,

If you enjoyed this article, sign up for free updates.

author picture

About Author

I'am Unknown, a part-time blogger and template designer from Indonesia who is the founder And Author of تحميل جميع البرامج. I love create Blogger Themes, write about blog design, And Blogspot tweaks. You can subscribe me on G+ @ Unknown .

ليست هناك تعليقات

إرسال تعليق