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

شرح التركيب

1. اولا قم باخد نسخة من قالب مدونتك لعدم حدوث اي مشكلة
2. قم بالبحث في قالب مدونتك عن ]]></b:skin> ثم قم بوضع الكود التالي فوقة .

.plans-containerwdbloog{width:98.2%;margin:20px 19px 40px 22px;float:left;word-wrap:break-word;overflow:hidden}
li#osama-price{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;transition:all .4s;margin:0 -1px 0 -1px}
li#osama-price1{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;transition:all .4s;margin:0 -1px 0 -1px}
li#osama-price2{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;transition:all .4s;margin:0 -1px 0 -1px}
li#osama-price3{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;transition:all .4s;margin:0 -1px 0 -1px}
li.collection-item{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;padding:10px;transition:all .4s;margin:0 -1px 0 -1px}
li.collection-item1{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;padding:10px;transition:all .4s;margin:0 -1px 0 -1px}
li.collection-item2{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;padding:10px;transition:all .4s;margin:0 -1px 0 -1px}
li.collection-item3{border-bottom:none;text-align:center;font-size:1.07rem;line-height:1.6em;padding:10px;transition:all .4s;margin:0 -1px 0 -1px}
article#osama-plans-1{border:1px solid #ccc;width:22.42%;float:right;margin-right:30px;margin-bottom:20px;background: #FFFFFF;}
article#osama-plans-2{border:1px solid #ccc;width:28%;float:right;margin-right:40px}
article#osama-plans-3{border:1px solid #ccc;width:28%;float:right;margin-right:40px}
.card-title{background:#F74047;padding:15px;color:#FFF;text-align:center;margin:0 -1px 0 -1px}
.card-title1{background:#4caf50;padding:15px;color:#FFF;text-align:center;margin:0 -1px 0 -1px}
.card-title2{background:#0B6EAB;padding:15px;color:#FFF;text-align:center;margin:0 -1px 0 -1px}
.card-title3{background:#9664b5;padding:15px;color:#FFF;text-align:center;margin:0 -1px 0 -1px}
.price{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
.price1{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
.price2{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
.price3{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
.price2{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
.price3{background:#0F4566;height:100px;padding:30px 0 0 0;text-align:center;color:#FFF;font-size:58px;margin:0 -1px 0 -1px;transition:all .4s}
sup.p44rice1{font-size:35px}
sup.p44rice2{font-size:75px}
.card-actionwdbloog{background:#F74047;text-align:center;padding:15px;margin:0 -1px 0 -1px;transition:all .4s}
.card-actionwdbloog1{background:#4CAF50;text-align:center;padding:15px;margin:0 -1px 0 -1px;transition:all .4s}
.card-actionwdbloog2{background:#0B6EAB;text-align:center;padding:15px;margin:0 -1px 0 -1px;transition:all .4s}
.card-actionwdbloog3{background:#9664B5;text-align:center;padding:15px;margin:0 -1px 0 -1px;transition:all .4s}
.card-actionwdbloog:hover{background:#0F4566;color:#fff}
.card-actionwdbloog1:hover{background:#F74047;color:#fff}
.card-actionwdbloog2:hover{background:#F74047;color:#fff}
.card-actionwdbloog3:hover{background:#F74047;color:#fff}
.waves-wdbloog{color:#FFFFFF}
li#osama-price:hover{background:#F74047;color:#fff}
li#osama-price1:hover{background:#0F4566;color:#fff}
li#osama-price2:hover{background:#0B6EAB;color:#fff}
li#osama-price3:hover{background:#0F4566;color:#fff}
li.collection-item:hover{background:#0F4566;color:#fff}
li.collection-item1:hover{background:#4caf50;color:#fff}
li.collection-item2:hover{background:#0F4566;color:#fff}
li.collection-item3:hover{background:#9664b5;color:#fff}

1. الكود الخاص باظهار الاضافة علي مدونتك ضعه في المكان الذي تريده .

<div class='plans-containernak1ha'>
<article class='col s12 m6 l4 wow bounceInRight animated' id='ismail-plans-1'>
<div class='card hoverable'>
<div class='card-image purple waves-effect'>
<div class='card-title'>تعديل وتطوير وحل مشاكل قوالب بلوجر</div>
<div class='price'><sup class='p44rice1'>$</sup><sup class='p44rice2'>3</sup></div>
</div>
<div class='card-content'>
<ul class='collection'>
<li class='collection-item' id='ismail-price'>تركيب الإضافات الحصرية</li>
<li class='collection-item'> حذف الأدوات الغير قابلة للحذف</li>
<li class='collection-item' id='ismail-price'>تحسين الخطوط</li>
<li class='collection-item'>تحسين مظهر القالب</li>
<li class='collection-item' id='ismail-price'>تغيير الألوان</li>
<li class='collection-item'>تركيب المساحات الإعلانية</li>
</ul>
</div>
<div class='card-actionnak1ha'>
<a href='http://h2shtag.blogspot.com.eg/' target='_blank'>
<div class='waves-nak1ha' href='http://h2shtag.blogspot.com.eg/' target='_blank'>اطلب الخدمة</div>
</a>
</div>
</div>
</article>
<article class='col s12 m6 l4 wow bounceIn animated' id='ismail-plans-1'>
<div class='card hoverable'>
<div class='card-image purple waves-effect'>
<div class='card-title1'>إعلان على مدونة محترق التقنية</div>
<div class='price1'><sup class='p44rice1'>$</sup><sup class='p44rice2'>5</sup></div>
</div>
<div class='card-content'>
<ul class='collection'>
<li class='collection-item1' id='ismail-price1'>رابط نصي بالمجان </li>
<li class='collection-item1'>بانر 125x125 لمدة30يوم</li>
<li class='collection-item1' id='ismail-price1'>بانر 300x250 لمدة 25 يوم</li>
<li class='collection-item1'>بانر 728X90 لمدة 15 أيام </li>
<li class='collection-item1' id='ismail-price1'>5 أيام إضافية للإعلان البنري</li>
<li class='collection-item1'>زوار يوميا</li>
</ul>
</div>
<div class='card-actionnak1ha1'>
<a href='http://h2shtag.blogspot.com.eg/' target='_blank'>
<div class='waves-nak1ha' href='http://h2shtag.blogspot.com.eg/' target='_blank'>اطلب الخدمة</div>
</a>
</div>
</div>
</article>
<article class='col s12 m6 l4 wow bounceInLeft animated' id='ismail-plans-1'>
<div class='card hoverable'>
<div class='card-image purple waves-effect'>
<div class='card-title2'>التصميم الاحترافي بالفتشوب</div>
  <div class='price2'><sup class='p44rice1'>$</sup><sup class='p44rice2'>3</sup></div>
</div>
<div class='card-content'>
<ul class='collection'>
<li class='collection-item2' id='osama-price2'> تصميم بانر احترافي</li>
<li class='collection-item2'>تصاميم دقيقة واحترافية</li>
<li class='collection-item2' id='osama-price2'>تصميم لوجو او التعديل عليه</li>
<li class='collection-item2'>تصميم كوفر فيس بوك</li>
<li class='collection-item2' id='osama-price2'>تصميم غلاف قناة يوتيوب</li>
<li class='collection-item2'>تصميم حسب الطلب</li>
</ul>
</div>
<div class='card-actionnak1ha2'>
<a href='http://h2shtag.blogspot.com.eg/' target='_blank'>
<div class='waves-nak1ha' href='http://h2shtag.blogspot.com.eg/' target='_blank'>اطلب الخدمة</div>
</a>
</div>
  </div>
</article>
</div>

1. قم بتغير الروابط وضع الروابط الخاصة بك 
2. اذا واجهتك مشكلة في تركيب الاضافة اترك لنا تعليق.