تبادل اعلاني جديد من الوليد نت مجانا

أدخل كلمات بحثك

الان كود اظهار المواضيع حسب التسميات الشكل الثاني
،،،،،،،،، لقد تم تغير اسم الموقع من موقع الوليد نت الي موقع الوليد نت 2 ,والرابط من alwalednet.blogspot.com الى alwalednet2.blogspot.com , , اتمنى ان ينال اعجابكم ×

الان كود اظهار المواضيع حسب التسميات الشكل الثاني




كود اظهار المواضيع حسب التسميات الشكل الثاني

سبق وان طرحت : [ إضافة ] عرض المواضيع حسب تسميه معينه في بلوجر
وهذا الموضوع هو الشكل الثاني له , بل هو مختلف عن السابق بالكامل ولاكن يعتبر شكل اخر له , وهو اضافة جميلة تظهر المواضيع او المشاركات حسب التسميات او الاقسام , بمعنى انك تختار قسم او تسميه وتظهر مواضيعها فقط في الرئيسيه.
الصورة التاليه ستوضح لك الاضافة.


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

ادخل قالبك.
واختر مكان مناسب وجيد لوضع الاضافة فيه , مثل اسفل الـ
 class='page
والصق هذا الكود مع تعديل ما سأذكر : 


<script src="https://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src='https://googledrive.com/host/0B7Zz9NWIHEOXeHpGODNVeVktSkk'/>
<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 = 4;
numposts1 = 4;
numposts2 = 4;
numposts6 = 4;
Title1 = "CSS1";
Title2 = "CSS2";
Title3 = "CSS3";
Title4 = "CSS4";
Title5 = "CSS5";
Title6 = "CSS6";
    //]]></script>
<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/-/CSS1?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/-/CSS2?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/-/CSS3?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/-/CSS4?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/-/CSS5?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/-/CSS6?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><script type='text/javascript'>
 //<![CDATA[
var _0x3c49=["hide",".tabber","show","active","addClass","ul.tab-view li:first",".tabber:first","removeClass","ul.tab-view li","href","attr","a","find","fadeIn","click","ready"];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>
<style>
#tabber-wrapper {
    width: 100%;
    float: right;
    overflow: hidden;
    background: #fff;
    margin-right: 10px;
    max-height: 230px;
    overflow-y: hidden;
}
.tabber .column_img:hover {
    margin-bottom: 12px;
    opacity: .9;
    transition: all .6s;
}
ul.tab-view {
    float: right;
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 5px 5px 6px;
    font-family: 'Droid Arabic Naskh';
    background: #FFFFFF;
    border-bottom: 3px solid #F3F3F3;
}
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: #333;
    display: block;
    outline: none;
    font-weight: 400;
    padding: 0 15px;
    background-color: rgba(109, 109, 109, 0.1);
}
ul.tabs li:hover {
    border-radius: 0;
}
ul.tab-view li a:hover,ul.tabs li:hover{
    background-color: #ECBA7B;
    border-radius: 5px;
    color: #fff;
}
html ul.tab-view li.active, html ul.tab-view li.active a, html ul.tab-view li.active a:hover {
    color: #fff;
    background: #67B587;
    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: 180px;
    height: 150px;
    margin-right: 5px;
    margin-bottom: 35px;
    padding: 2px 2px 5px;
}
.tabber .column_img {
    background: #fff;
    padding: 0px;
    width: 180px;
    height: 175px;
    margin: 0;
    transition: all .6s;
}
.tabber h2 {
    line-height: 18px;
    text-align: center;
    background: rgba(0, 0, 0, 0.35);
    padding: 10px 0 10px 21px;
    width: 179px;
    position: relative;
    bottom: 80px;
    opacity: .9;
    font-family: cursive;
    font-size: 12px;
    margin-left: 0px;
    margin-right: 1px;
    font-weight: 400;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.tabber h2 a { color: #FFF }
.tabber h2 a:hover {
    color: #FFF;
    text-decoration: none;
}
</style>

عدل اللون الاحمر : هذا كود مكتبة الجيكوري , اذا كان بالفعل متواجد بمدونتك فالافضل عدم اضافته.
عدل اللون الاصفر : استبدلهم بأسم القسم او التسميه التي تريد ظهور مواضيعها , هناك 12 كلمة يجب استبدالهم جميعاَ.


اذا احتجت الى مساعدة فباشر بالتعليق.


الان كود اظهار المواضيع حسب التسميات الشكل الثاني  الان كود اظهار المواضيع حسب التسميات الشكل الثاني Reviewed by walid al Bana on 4:55:00 ص Rating: 5
اظهار التعليقات
   
تجدونا هنا

إنضم إلينا


Join on this site

للحصول على كل جديد المدونة

Mohon Aktifkan Javascript!Enable JavaScript