جعل نماذج بلوجر متجاوب مع جميع الأجهزة

نماذج بلوجر أو القوالب الديناميكية قوالب رائعة ويمكن تطويرها بكل بساطة وذلك من خلال لوحة التحكم بلوجر ولكن ماينقص هذه القوالب هو عدم تجاوبها مع جميع الأجهزة بحيث أصبح المدون العربي يتجاهل هذه القوالب بسبب بسيط وهو عدم تجاوب هذه القوالب مع جميع الأجهزة مع أن هذه القوالب يمكن جعلها متجاوب وذلك من خلال أختيار نموذج الجوال البسيط ولكن اليوم سوف نتجاهل أختيار نموذج من نماذج الهاتف التي تقدمها منصة بلوجر وذلك بجعل القالب يعرض كما هو

أولا سوف نقوم بضبط نموذج الجوال

وذلك عبر التوجه الي لوحة التحكم بلوجر
نختار قالب نقوم بضغط علي ترس الجوال ونقوم با أختيار كما في الصور

بعد ضبط نموذج الجوال نذهب الي قالب تحرير HTML

ابحث عن هذا الوسم <head> و اضف الكود التالي بعده

<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>

وبعد وضع الكود أعلي نبحث عن هذا الوسم ]]></b:skin> و اضف الكود التالي فوقه

@media screen and (max-width : 750px) {
body {min-width: 100% !important;}
.content-outer.bzcontain {
max-width: 100% !important;
min-width: 100% !important;
overflow: hidden;
width: 100% !important;
}
.content-inner {
margin: 0 auto;
overflow: hidden;
width: 98%;
}
.bzomcmain {padding: 0 !important;}
.region-inner.main-inner {padding: 10px !important;}
.comment-link,.post-comment-link::before {display: none;}
.bzsidebar {
float: right !important;
margin: 10px auto !important;
right: 0 !important;
width: 100% !important;
}
.sidebar.section {margin: 0 !important;}
.column-left-inner {padding: 0 !important;}
.sidebar .widget {margin: 0 -4px 20px !important;}
.post-outer {overflow: hidden;}
}