قالب المدونة الحالى

السلام عليكم و رحمة الله تعالى و بركاته
السلام عليكم و رحمة الله تعالى و بركاته

في هذا الموضوع الجديد أحببت أن أطرح لكم قالب المدونة الحالي و الذي حولته من الووردبرس بجميع مميزاته و من بينها ::::
توافقه مع جميع المتصفحات إلا انترنت إكسبلورر
توافقه مع قياسات جميع الشاشات و الحواسيب اللوحية الذكية
يحتوي على قائمة منسدلة إحترافية
يحتوي في الواجهة الرئيسية على شكل مجلة إلكترونية
جميع السلايدرات الموجودة فيه أوتوماتيكية أي تحصل على المواضيع من فيد المدونة
يحتوي على خطوط إحترافية تعمل على جميع المتصفحات
تعريف كاتب إحترافي
تعليقات البلوجر بشكل إحترافي
و الكثير من المميزات الرائعة أترككم لتفقدها
أولا و قبل كل شيء أتمنى عدم حذف الحقوق لاني تعبت في جعل القالب للبلوجر
تعاملوا مع الحقوق كأن القالب مدفوع
طريقة تركيب القالب :
القالب يحتوي على كتير من ألسليديرات
لكن كلها متشابهة
أول شيء
عوض في هذا الرابط رابط المدونة و القسم المراد عرض مواضيعه
http://برابط المدونة.blogspot.com/feeds/posts/default/-/القسم?published&alt=json-in-script&callback=labelthumbs
مثال
قم بإختصار الرابط في موقع
Goo.gl
و قم بالبحث عن هذا الرابط في القالب و عوضه برابطك المختصر في موقع Goo.gl
http://goo.gl/5wVxWO
و هذا الرابط يتكرر أكتر من مرة بل في جميع السلايدرات
و باقي التعديلات يمكنكم معاينة بعض الدروس التي طرحتها من قبل عن البلوجر

أتمنى أن لا تنسو عدم حذف الحقوق و شكرا
تحديث بتاريخ : 19 / 02 / 2014
التحديث الأخير لا يقبل الشرح أعلاه لذلك تجنبه
نتائج التحديث :
  • الإصلاحات
  • الإضافات
تم إصلاح إقرأ المزيد و أصبحت تعمل دائما دون مشاكل
تم إصلاح ترقيم الصفحات
تم إصلاح ستايل المواضيع الشائعة
تم إصلاح ستايل التسميات
تم إصلاح ستايل التعليقات
تم حذف بعض الأكواد الزائدة
تم إصلاح تخطيط المدونة و جعل كل الإضافات منه
و هذه صورة من تخطيط المدونة
شرح بعض أكواد الموجودة في القالب
لتعديل القائمة العلوية هذا هو كودها موجود في القالب فقط إبحث عنه
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<li class='current-menu-item'><a href='http://www.3rab-help.com/'>الرئيسية</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d8%a7%d9%84%d8%b1%d8%a8%d8%ad-%d9%85%d9%86-%d8%a7%d9%84%d8%a5%d9%86%d8%aa%d8%b1%d9%86%d8%aa/'>الربح من الإنترنت</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d8%a8%d8%b1%d8%a7%d9%85%d8%ac/'>برامج</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%85%d9%88%d8%a7%d9%82%d8%b9/'>مواقع</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%88%d9%82%d8%a7%d8%a6%d8%b9/'>وقائع</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%87%d9%88%d8%a7%d8%aa%d9%81/'>هواتف</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%81%d9%8a%d8%b3%d8%a8%d9%88%d9%83/'>فيسبوك</a></li>
<li class='menu-item'><a>بلوجر</a>
<ul class='sub-menu'>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d8%a5%d8%b6%d8%a7%d9%81%d8%a7%d8%aa-%d8%a8%d9%84%d9%88%d8%ac%d8%b1/'>إضافات بلوجر</a></li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%82%d9%88%d8%a7%d9%84%d8%a8-%d8%a8%d9%84%d9%88%d8%ac%d8%b1-%d8%ad%d8%b5%d8%b1%d9%8a%d8%a9/'>قوالب بلوجر حصرية</a></li>
</ul>
</li>
<li class='menu-item'><a href='http://www.3rab-help.com/category/%d9%88%d9%88%d8%b1%d8%af%d8%a8%d8%b1%d8%b3-wordpress/'>ووردبرس WordPress</a></li>
لتعديل الرسالة التي تضهر في الصفحة الرئيسية هدا هو كودها موجود في القالب إبحث عنه
1
<p>في حال وجدت موضوع تالف يمكنك التعليق عليه بأنه تالف و سيتم إصلاحه في أقرب وقت ^_^<a href='' target='_blank'/></p
في حال أردت حذف ألسليدر هذا هو كوده إبحث عنه في القالب
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='mainSlideshows clearfix mainBorder' id='mainSlideshows'> 
<script type='text/javascript'>
var numpost1 = 10; //عدد المواضيع المعروضة 
var label1 = "دورة تصميم قوالب بلوجر";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label1+"?published&amp;alt=json-in-script&amp;callback=slide1\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
              <div class='clearfix' id='featuredThumbs'>
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label1+"?published&amp;alt=json-in-script&amp;callback=slide2\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
              </div>
            </div><!--End SlideShow-->            
<script type='text/javascript'>
jQuery(document).ready(function($) {
    jQuery(&#39;#featuredThumbs&#39;).flexslider({
        namespace: &quot;&quot;,
        animation: &quot;slide&quot;,
        asNavFor: &#39;#featuredPosts&#39;,
        slideshow: false,
        controlNav: false,
        itemWidth: 105,
        itemMargin: 11,
        minItems: 2,
        maxItems: 5
    });
    jQuery(&#39;#featuredPosts&#39;).flexslider({
        namespace: &quot;&quot;,
        selector: &quot;.slides &gt; .slide&quot;,
        animation: &quot;slide&quot;,
        sync: &#39;#featuredThumbs&#39;,
        slideshowSpeed: 5000,
        animationSpeed: 900,
        animationLoop: true,
        slideshow: true,
        controlNav: false,
        directionNav: false,
        start: function(slider) {
            jQuery(&#39;.preloader&#39;).hide();
            jQuery(&#39;#featuredThumbs&#39;).show();
        }
    });
});
</script> 
</b:if>
و لتعديل عدد المواضيع التي تضهر في ألسليدر و التصنيف هدا هو الكود المكلف بالأمر
1
2
var numpost1 = 10; //عدد المواضيع المعروضة 
var label1 = "دورة تصميم قوالب بلوجر";
إذا أردت تعديل عدد المواضيع في الرئيسية في أحدث التدوينات هذا هو كودها
1
var numpost2 = 5;//عدد المواضيع المعروضة
الآن ننتقل إلى إضافة تبويبات المواضيع و الصناديق
أولا إبحث عن
1
<!--End Latest Posts-->
و أضف أسفله أي إضافة من الإضافات التالية و يمكن إضافة أكتر من واحدة من نفس النوع
أول إضافة
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div class='carouselTitle'>
<h4>دورة تصميم قوالب بلوجر</h4>
</div>
<div id='carouselPosts'>
<div class='clearfix mainBorder' id='carousel'>
<script type='text/javascript'>
var numpost3 = 20; //عدد المواضيع المعروضة 
var label3 = "دورة تصميم قوالب بلوجر";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label3+"?published&amp;alt=json-in-script&amp;callback=carousel\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--End carouselPosts-->
</div><!--End carouselPosts-->
<script type='text/javascript'>
jQuery(document).ready(function($) {
    jQuery(&#39;#carousel&#39;).flexslider({
    animation: &quot;slide&quot;,
    animationLoop: true,
    itemWidth: 160,
    itemMargin: .5

    });
    
});
</script>
لتشغيلها قم بتغيير ما في الكود بالمناسب
ثاني إضافة
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div id='newsBoxs'>
<div class='newsBox newsBoxRight'>
<div class='newsBoxTop'>
<div class='newsBoxTitle'> <a href='#'>
<h2>قوالب بلوجر حصرية</h2>
</a> </div>
<!--End Latest PostsTitle--> 
<span class='titleArrow'/> <a class='whiteRss' href='#'/> </div>
<!--End LatestPostsTop-->
<div class='contentBox'>
<script type='text/javascript'>
var num = 5; //عدد المواضيع المعروضة 
var label = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label+"?published&amp;alt=json-in-script&amp;callback=box\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--End ContentBox--> 
</div><!--End NewsBox-->
</div><!--End NewsBoxs-->
ثالث إضافة
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<div id='newsBoxs'>
    
<div class='newsBox'>
  <div class='newsBoxTop'>
    <div class='newsBoxTitle'> <a href='http://blog.modawenon.com/category/%d8%a5%d8%b6%d8%a7%d9%81%d8%a7%d8%aa-%d8%a8%d9%84%d9%88%d8%ac%d8%b1/'>
      <h2>إضافات بلوجر</h2>
      </a> </div>
    <!--End Latest PostsTitle--> 
    <span class='titleArrow'/> <a class='whiteRss' href='#'/> </div>
  <!--End LatestPostsTop-->
  <div class='contentBox'>
<script type='text/javascript'>
var num = 5; //عدد المواضيع المعروضة 
var label = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label+"?published&amp;alt=json-in-script&amp;callback=box\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>

    <!--End NewsBoxList--> 
  </div>
  <!--End ContentBox--> 
</div><!--End NewsBox-->

<!--End NewsBox-->
</div><!--End NewsBoxs-->
رابع إضافة
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<section class='tabs'>
<div class='maintab_wrap'>
<ul class='maintabNav'>
      
<li class='firstTab active' style=''><a href='#maintabs-1' title='إضافات بلوجر'><span class=''>إضافات بلوجر</span></a></li>
<li><a href='#maintabs-2' title='برامج'><span class=''>برامج</span></a></li>
<li><a href='#maintabs-3' title='فيسبوك'><span class=''>فيسبوك</span></a></li>
<li><a href='#maintabs-4' title='ووردبرس Wordpress'><span class=''>ووردبرس Wordpress</span></a></li>
<li><a href='#maintabs-5' title='وقائع'><span class=''>وقائع</span></a></li>
</ul>
<div class='maintabContent contentBox' id='maintabs-1' style='display: block;'>
<script type='text/javascript'>
var numpost4 = 5; //عدد المواضيع المعروضة 
var label4 = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label4+"?published&amp;alt=json-in-script&amp;callback=posts\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>

</div><!--tab-->
<div class='maintabContent contentBox' id='maintabs-2' style='display: none;'>
<script type='text/javascript'>
var numpost4 = 5; //عدد المواضيع المعروضة 
var label4 = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label4+"?published&amp;alt=json-in-script&amp;callback=posts\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--tab-->
<div class='maintabContent contentBox' id='maintabs-3' style='display: none;'>
<script type='text/javascript'>
var numpost4 = 5; //عدد المواضيع المعروضة 
var label4 = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label4+"?published&amp;alt=json-in-script&amp;callback=posts\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--tab-->
<div class='maintabContent contentBox' id='maintabs-4' style='display: none;'>
<script type='text/javascript'>
var numpost4 = 5; //عدد المواضيع المعروضة 
var label4 = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label4+"?published&amp;alt=json-in-script&amp;callback=posts\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--tab-->
<div class='maintabContent contentBox' id='maintabs-5' style='display: none;'>
<script type='text/javascript'>
var numpost4 = 5; //عدد المواضيع المعروضة 
var label4 = "كل";
</script> 
                      <script type='text/javascript'>
  document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/"+label4+"?published&amp;alt=json-in-script&amp;callback=posts\&quot;&gt;&lt;\/script&gt;&quot;);
                    </script>
</div><!--tab-->

</div><!--End Tabs Warb-->
</section>
لحذف صندوق المواقع الإجتماعية أو لتعديله هذا كوده
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<div class='widget'>
<div class='socialBoxs'>
<div class='socialBox twitterBox'>
<div class='socialBoxData'>
<a href='http://www.twitter.com/#' target='_blank' title=''>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxgsxqNipvSw8Ep5ZyGHvzC-KDbqjFqJ41PAUfM8__obBU-ixnlXfhzBQWCij9ZG_OYWbL7J5y5AEo4DKZ5tF69qLLsKYWWGl2RDSQUPaiBH7OX00q2CA31euRjczCg18J5tXv5mJPLWak/s1600/Twitter.png'/>
</a>
<span class='socialBoxCount'/>
<span class='socialBoxCount'>0000</span>
<a href='http://www.twitter.com/#'>م&#1615;تابعين</a>
</div><!--End SocialBox Data-->
</div><!--End socialBox-->
<div class='socialBox facebookBox'>
<div class='socialBoxData'>
<a href='http://www.facebook.com/528099387217413' target='_blank' title=''>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWgDyjd7606y51IEr3Uy4fzRn575SryDoV3JnQNNFIX5XxFRwulQm24Cjpy09nb-MD9PvmaPk5UYBS6dsDKrP0-aP3E4uP43YnIJUAz6lQJw6eWm5YbjuLei4CQDkY3SPQsekZmf0ZU9r5/s1600/Facebook.png'/>
</a>
<span class='socialBoxCount'>8000</span>
<a href='http://www.facebook.com/528099387217413'>م&#1615;عجبين</a>
</div><!--End SocialBox Data-->
</div><!--End socialBox-->
<div class='socialBox rssBox'>
<div class='socialBoxData'>
<a href='http://feeds.feedburner.com/3rab-help' target='_blank' title=''>
<img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgYwFQbuIbZifEi2-KjPUnstplkEMa3Nc4_9P6DwO5HNcRYjdkmRnU4ixjC0ESCI6kUuwgaAUlCkK1LEbcRfm4rUR9chtbYtRRzyNxwBTnpHDS5YHq9aMkf6Ej111EihkmfNTqrypfMXl2/s1600/RSS.png'/>
</a>
<span class='socialBoxCount'>1000+</span>
<a href='http://feeds.feedburner.com/3rab-help'>مشتركين</a>
</div><!--End SocialBox Data-->
</div><!--End socialBox-->
</div><!--End SocialBoxs-->
<div class='mainsearch'>
<form action='/search' method='get'>
<input id='search-form' name='s' onblur='if (this.value==&apos;&apos;) this.value=&apos;إبحث من هنا&apos;;' onfocus='if (this.value==&apos;إبحث من هنا&apos;) this.value       = &apos;&apos;;' type='text' value='إبحث من هنا'/>
<input class='btnMainColor' id='searchsubmit' type='submit' value=''/>
</form>
</div>
</div><!--End Widget-->
لحذف صندوق الإشتراك بالبريد أو لتعديله هذا كوده
1
2
3
4
5
6
7
8
9
10
<div class='widget'>
<div class='subscribeBox'>
<form action='http://feedburner.google.com/fb/a/mailverify' id='subscribe' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=3rab-help&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
  <input id='mail-forum' onblur='if (this.value==&apos;&apos;) this.value=&apos;بريدك الإلكتروني&apos;;' onfocus='if (this.value==&apos;بريدك الإلكتروني&apos;) this.value       = &apos;&apos;;' type='text' value='بريدك الإلكتروني'/>
  <input name='loc' type='hidden' value='en_US'/>
  <input name='uri' type='hidden' value='tqarobweblog'/>
  <input id='mail-submit' type='submit' value=''/>
</form>
</div>
</div>
لإضافة آخر المواضيع في ألسيدبار هذا كودها (يتم إضافتها من تخطيط)
1
2
3
4
5
6
<ul class="lists">
<script type='text/javascript'>
var numposts = 6;
</script>
<script src="/feeds/posts/default/?published&amp;alt=json-in-script&amp;callback=lastpostt"></script>
</ul>
لإضافة آخر التعليقات في ألسيدبار هذا كودها (يتم إضافتها من تخطيط)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<div class="widget-content">
<style type="text/css">
ul.w2b_recent_comments {
    list-style: none;
    margin: 0;
    padding: 0;
}

.w2b_recent_comments li {
overflow: hidden;
padding: 12px 18px;
border-bottom: 1px solid #e2e2e2;
}

.w2b_recent_comments li .avatarImage {
padding: 3px;
background: #fefefe;
float: right;
margin: 0 6px 0 15px;
position: relative;
overflow: hidden;
}

.w2b_recent_comments li img {
    padding: 0px;
    position: relative;
    overflow: hidden;
    display: block;
}

.w2b_recent_comments li span {
    margin-top: 4px;
    color: #666;
    display: block;
    font-size: 12px;
    font-style: italic;
    line-height: 1.4;
}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 60,
 roundAvatar = true,
 characters  = 40,
 showMorelink = false,
 moreLinktext = "More &#187;",
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
//]]>
</script>
<script src="http://helplogger.googlecode.com/svn/trunk/w2b recent comments with avatars.js" type="text/javascript"></script>
<script src="/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=5" type="text/javascript"></script></div>
لجعل الفيديو يقبل سحب صورته في الملخص أضف هذا الكود عند كتابة موضوع و غير اللازم بما يناسبك
1
<iframe allowfullscreen="" frameborder="0" height="320" src="http://www.youtube.com/embed/أيدي الفيديو" width="100%"></iframe>
لتشغيل الإضافات يجب عليك تغيير الكلمة “كل” أو “دورة تصميم قوالب بلوجر” و تضع مكانها التصنيف الخاص بالمواضيع المراد عرضها
في حل لم تفهم التصنيف شاهد هذه الحلقة 

تصميم :المساعد العربى 

قال تعالى ( مَا يَلْفِظُ مِن قَوْلٍ إِلا لَدَيْهِ رَقِيبٌ عَتِيدٌ )
تحويل كودإخفاء محول الأكواد الإبتساماتإخفاء

شكرا لك ولمرورك