السلام عليكم ورحمة الله ، أهلا بك فى مدونة قوالب عربى ، معنا قالب جديد اليوم من أحد قوالب بلوجر المعربة المجانية ،سهلة التخصيص ،التركيب و متوافق مع جميع الاجهزة اللوحية.
قالب Focus المعرب ، هو قالب اليوم ، ستميز بلأنه قالب لأصحاب المدونات التقنية ولمحبى البساطة واللون الاصفر 😂. ما عاليا من المزاح ، بـ قالب Focus المعرب مجهز بأماكن للأعلانات لتضمن ربحك بالتأكيد و معه تخصيص لأزرار التحميل والجداول فى شرح اليوم.
![]() |
قالب Focus المعرب - قالب تقنى بسيط |
مميزات القالب
المميزات | الاتاحــة |
---|---|
متوافق مع الاجهزة الحديثة | متــاح |
صديق للهاتف | متــاح |
سريع على الهاتف و الكمبيوتر | متــاح |
كود لصفحة (اتصل بنا) | متــاح |
القائمة العلوية ثابت | متــاح |
أكواد تخصيص | متــاح |
أزرار لمشاركة المقالة | متــاح |
صديق للسيو | متــاح |
زر العودة الى اعلى | متــاح |
تحميل ومعاينة القالب
تخصيص القالب
أولا: القائمة العلوية (Header)
للتعديل على القائمة العلوية بـ قالب Focus المعرب ، فعليك الذهاب الى تبويت
المظهر
تعديل الـ HTML ، وقم بالبحث عن (من نحن أو الرئيسية التى يتبعها نفس الكلمة السابقة).
كما هو امامك فـ المحدد باللون الازرق هى القوائم المنسدلة بالقالب ، ويمكنك التعديل على اسمائها كما تشاء وازالة الـ # ووضع رابط القسم الذى بمدونتك ، ويكون كما فى الكود التالى :
1https://8walb-3rba.blogspot.com/search/label/YOUR-LABAL
يجب تغير YOUR-LABAL باسم قسمك الموجود فى مدونتك ، وتغير https://8walb-3rba.blogspot.com برابط موقعك أنت
اضافة اعلانات
للتعديل و اضافة مساحاتك الاعلانية بـ قالب Focus المعرب ، فعليك الذهاب
تبويت
التنسيق ثم الذهاب
تبويت Banner وهو موجود فى اسفل و أعلى المدونة ، يمكنك اضافة 2 من الوحدات الاعلانية بنفس الطريقة.
اضافة اداة (تابعنا)
للتعديل على أداة (تابعنا) بـ قالب Focus المعرب ، فعليك التوجه
تبويت
التنسيق ثم التوجه
تبويت تابعا ، وكل ما عليك هو تغير الـ # برابط صفحاتك على مواقع التواصل الأجتماعى.
التعديل على الفوتر (Footer)
للتعديل على الفوتر (Footer) بـ قالب Focus المعرب ، فعليك الذهاب الى تبويت المظهر تعديل الـ HTML ، وقم بالبحث عن (صفحات مهمة).
وقم بالتغير على الكلام بما يناسبك وتغير الـ # بالرابط الذى تريده ، وفى القائمة البريدية قم بتغير mailverify بمعرف الـ feedburner الخاص بك.
اضافة صفحة (اتصل بنا)
لاضافة صفحة اتصل بنا فى قالب Focus المعرب ، فعليك التوجه
تبويت الصفحات وقم باضافة صفحة جديدة وسميها contact-us ثم غيرها فيما بعد ، ثم توجه
تبويت الـ HTML و قم بوضع الكود التالى ،بدون اضافة نموذج اتصال بلوجر التقليدى.
1357891011121314151617181920212223242526272829303132<form id="kontak-arlina" name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="الاسم *" size="30" type="text" value="" />
<input id="ContactForm1_contact-form-email" name="email" placeholder="بريدك الالكترونى *" size="30" type="text" value="" />
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="محتوى الرسالة *" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="ارســال" />
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
<style scoped="" type="text/css">
#comments,.post_meta,#blog-pager{display:none}
form{color:#666}
#kontak-arlina{margin:auto;max-width:640px}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out;font-family: 'Readex Pro', sans-serif;}
#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out;font-family: 'Readex Pro', sans-serif;}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}
#ContactForm1_contact-form-submit{float:left;background:#95a5a6;margin:auto;vertical-align:middle;cursor:pointer;padding:12px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;max-width:140px;border-radius:3px;color:#fff;font-weight:500;transition:all .8s ease;font-family: 'Readex Pro', sans-serif;}
#ContactForm1_contact-form-submit:hover{background:#e74c3c;color:#fff;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}
.contact-form-error-message-with-border{background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0}
.contact-form-success-message{background:#4fc3f7;border:none;box-shadow:none;color:#fff}
img.contact-form-cross{line-height:40px;margin-left:5px}
.post-body input{width:initial}
@media only screen and (max-width:640px){
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}
</style>
اضافة فيديوهات يوتيوب متجاوبة
لاضافة فيديوهات يوتيوب متجاوبة فى قالب Focus المعرب ، من أجل تجاوب أعلى للأجهزة اللوحية المختلفة ، فعليك التوجه
تبويت الصفحات ثم قم بانشاء صفحة جديدة و توجه
تبويت الـ HTML وضع الكود التالى :
123456<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/yiv64_QMsd4">
</div>
</div>
</div>
عليك تغير yiv64_QMsd4 بمعرف الفيديو الذى تريد أن تضيفه
اضافة أزرار التحميل و المعاينة
لاضافة أزرار التحميل و المعاينة فى قالب Focus المعرب ، فعليك التوجه تبويت الصفحات ثم قم بانشاء صفحة جديدة و توجه تبويت الـ HTML مع تغير الـ # الى رابط التحميل أو المعاينة وضع الكود التالى :
123456<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="#" target="_blank">معاينة</a></li>
<li><a class="download" href=" #" target="_blank">تحميل</a></li>
</ul><div style="text-align: right;"><br /></div><h2 style="text-align: right;">جدول</h2><div style="text-align: right;"><br /></div>
</div>
اضافة قائمة ترقيم منسدلة
لاضافة قائمة الترقيم المنسدلة فى قالب Focus المعرب ، فعليك التوجه تبويت الصفحات ثم قم بانشاء صفحة جديدة و توجه تبويت الـ HTML مع تغير الكلام بما يناسبك ، وضع الكود التالى :
1<h2 style="text-align: right;">قائمة منقطة منسدلة</h2><div><br /></div> <ul> <li>هذه قائمة 1</li> <li>هذه قائمة 2</li> <li>هذه قائمة 3</li> <li>هذه قائمة 4 <ul> <li>هذه قائمة منسدلة 1</li> <li>هذه قائمة منسدلة 2</li> <li>هذه قائمة منسدلة3</li> </ul> </li> <li>هذه قائمة 5</li></ul>
الخاتمة
الى هنا ينتهى شرح تخصيص قالب Focus المعرب بواسطة مدونة قوالب عربى ، واذا واجهت اى مشكلة ، فالتعليقات مفتوحة لك ، و اذا واجهت اى عطل فى الروابط : التحميل أو المعاينة فراسلنا عبر صفحة اتصل بنا.
روابط اضافية
رابط القالب من صفحة المصمم :اضغط هنا
رابط تخصيص القالب من المصمم :اضغط هنا