simplify - قالب بلوجر متجاوب

simplify  قالب بلوجر متجاوب - كيف حال المدونين ؟  نأمل انكم في صحة جيدة، أريد ان اقدم لكم قالب simplify الذي اثبت مقولة " البساطة سر الأبداع " بألوانه وتصميمه الهادئ، قالب يصلح لجميع أنواع المدونات، من أفضل خصائص قالب simplify التجاوب، قالب بلوجر متجاوب مع جميع مقاسات الشاشات من الجوالات الذكية ذات الشاشات الصغيرة الى الاجهزة اللوحية والحواسيب ذات الشاشات الكبير، يعني متجاوب مع جميع مقاسات الشاشات.ومايميزة عن غيرة سرعة القالب وأكواده النظيفة والحديثة الخالية من الشوائب. 

بدون أطالة وحرق الأحداث 😁 ندعوكم لقرائة المميزات والمعاينة مباشرة من القائمة الجانبية 👈  

خصائص القالب

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

• معاينة

1. مربع الاكواد البرمجية
  هو مربع تضع فية اكوادك البرمجية التي تريد عرضها.

<div style="text-align: left;">
<pre>
<code>
here . . . .
</code>
</pre>
</div>

2.أضافة فيديو متجاوب مع جميع احجام الشاشات 
القالب مزود بخاصية تجاوب الفيديوهات، يعني اذا كنت تريد ان تعرض فيديو ويكون متجاوب مع جميع الشاشات أستخدم هذه الكود.

<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/LHKyeeD5ImM">
</div>
</div>
</div>

المحدد باللون الاحمر هو معرف الفيديو قم بتغيرة بمعرف الفيديو الذي تريد عرضه.

3. جملة توضيحية

</b></b><span class="first-letter">جملة توضيحية</span>

قم بتغير المحدد باللون الاحمر بالجملة التي تريد عرضها.

4. ازرار

div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="YOUR-LINK-HERE" target="_blank">معاينة</a></li>
<li><a class="download" href=" YOUR-LINK-HERE" target="_blank">تحميل</a></li>
</ul>
</div>
<div class="clear"></div>

أستبدل المحدد باللون الاجمر برابط المعاينة والتحميل خاصتك .

5.تقسيم المقال الى عامودين

<div class="bagidua">
------ أضف المحتوى هنا ------
</div>

6.تقسيم المقال الى ثلاثة أعمدة

<div class="bagitiga">
------ أضف المحتوى هنا ------
</div>

7.تقسيم المقال الى أربعة أعمدة

<div class="bagiempat">
------ أضف المحتوى هنا ------
</div>

8. أنشاء جدول

<table cellpadding="0" cellspacing="0" style="text-align: right;">
    <tbody>
        <tr>
            <th>رأس الجدول 1</th>
            <th>رأس الجدول 2</th>
            <th>رأس الجدول 3</th>
        </tr>
        <tr>
            <td>الخانة 1</td>
            <td>الخانة 2</td>
            <td>الخانة 3</td>
        </tr>
        <tr>
            <td>الخانة 1</td>
            <td>الخانة 2</td>
            <td>الخانة 3</td>
        </tr>
        <tr>
            <td>الخانة 1</td>
            <td>الخانة 2</td>
            <td>الخانة 3</td>
        </tr>
    </tbody>

9.ملاحظة

<blockquote>لأنه مازال نصاً بديلاً ومؤقتاً. </blockquote>

صفحة أتصل بنا وخريطة الموقع

1. أتصل بنا

يرجى ملئ النموذج أدناه للاتصال بالمشرف. إذا لم يكن هناك اي مخالفات للقوانين وغير ذالك في رسالتك ، فإن المشرف يرد مباشرة على الرسائل التي ترسلها.


<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" size="30" placeholder="بريدك *" 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}
#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}
#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}
#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>

2.خريطة الموقع

<div id='show-cat'>
</div>
<div id='show-post'>
<script type='text/javaScript'>
var cat_home='https://qaisi1web.blogspot.com';cat_numb=11;cat_pre='السابق';cat_nex='التالي';
var cat_name;var cat_start;var cat_class;
function show_post2(a){var tt=a.feed.openSearch$totalResults.$t;dw='';dw+='<ul>';for(var i=0;i<cat_numb&&i<a.feed.entry.length;i++){var entry=a.feed.entry[i];cat_title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var cat_url=entry.link[j].href}}dw+='<li>';dw+=(cat_start+i)+'. <a href="'+cat_url+'" rel="nofollow" title="'+cat_title+'">'+cat_title+'</a>';dw+='</li>'}dw+='</ul>';dw+='<div id="navi-cat">';if(cat_start>1){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start-cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_pre+'">'+cat_pre+'</a>'}if((cat_start+cat_numb-1)<tt){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start+cat_numb)+'\',\''+cat_class+'\');return false" title="'+cat_nex+'">'+cat_nex+'</a>'}dw+='<span>'+cat_start;if(cat_start!=tt){dw+=' &ndash; '+(cat_start+i-1)}dw+=' / '+tt+'</span>';dw+='</div>';document.getElementById('show-post').innerHTML=dw+'<style type="text/css">.cat-'+cat_class+' a{background:#bbb!important;color:#fff!important}<\/style>'}function show_post(a,b,c){var d=document.getElementsByTagName('head')[0];e=document.createElement('script');e.type='text/javascript';e.setAttribute('src',cat_home+'/feeds/posts/default/-/'+a+'?alt=json-in-script&start-index='+b+'&max-results='+cat_numb+'&callback=show_post2');d.appendChild(e);cat_name=a;cat_start=parseInt(b),cat_class=c}function show_cat(a){var cat=a.feed.category;dw='';dw+='<ul>';for(var i=0;i<cat.length-1;i++){for(var j=i+1;j<cat.length;j++){if(cat[i].term>cat[j].term){cat_hv=cat[i].term;cat[i].term=cat[j].term;cat[j].term=cat_hv}}}for(var i=0;i<cat.length;i++){dw+='<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false" title="';dw+=cat[i].term;dw+='">';dw+=cat[i].term;dw+='</a>';dw+='</li>'}dw+='</ul>';document.getElementById('show-cat').innerHTML=dw}document.write('<script type="text/javascript" src="'+cat_home+'/feeds/posts/default?alt=json-in-script&max-results=0&callback=show_cat"><\/script>');
</script>
</div>
<style scoped="" type="text/css">
#show-cat{direction: ltr;float:right;margin:20px 0 20px 2%;width:25%;height:389px;overflow-x:hidden;overflow-y:auto;line-height:normal;border:1px solid rgba(0,0,0,0.1)}
#show-cat ul{margin:0;border-top:0 solid rgba(0,0,0,0.1);padding:0}
#show-post ul li{list-style-type:none;margin:0 -25px 0 0;padding:10px 0;border-bottom:1px solid rgba(0,0,0,0.1)}
#show-post ul li:hover{margin-left:10px;border-color:#fcd3d3}
#show-cat ul li a{display:block;padding:10px;border-bottom:1px solid rgba(0,0,0,0.1);transition:initial}
#navi-cat a:hover{color:#fff!important}
#show-cat ul li:last-child a{border-bottom:none}
#show-cat ul li a,#navi-cat a{background:#fff;color:#555;font-weight:bold;text-decoration:none}
#show-cat ul li a,#navi-cat a,#navi-cat span{font-size:15px}
#show-cat ul li a:hover,#navi-cat a:hover{background:#666;color:#fff}
#show-post{float:right;width:69%;line-height:1.6em}
#show-post a{color:#333;font-size:15px}
#show-post a:hover{color:#f14b4b}
#navi-cat{padding:20px 0}
#navi-cat a{padding:5px 10px;background:rgba(0,0,0,0.7);margin:0 0 0 5px;color:#fff;border-radius:3px;}
#navi-cat a:nth-child(2){background:#f14b4b;margin:0 0 0 10px;color:#fff}
#navi-cat span{float:left;padding:5px 0;font-size:13px;color:rgba(0,0,0,0.5);font-weight:700}
#show-cat::-webkit-scrollbar{width:8px;height:8px}
#show-cat::-webkit-scrollbar-track{background-color:rgba(0,0,0,.1);}
#show-cat::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.6)}
#show-cat::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.4);transition:all 400ms ease-in-out}
@media screen and (max-width:768px){#show-cat{width:35%}#show-post{width:59%}}
@media screen and (max-width:480px){#show-cat{width:100%;margin:20px 0}#show-post{width:100%}}
</style>

الرابط المحدد باللون الاحمر غيره برابط مدونتك.
إقرأ أيضًا
قالب متجر الكتروني

ان واجهت اي مشاكل فباب التعليقات مفتوح . . . بالتوفيق 😍

تحميل القالب

معاينة
تحميل
تحميل

المميزات / الإضافات

• متجاوب معاينة
• سريع التحميل
• تصميم هادئ
• متجاوب 100%
• صفحات ثابتة
• نظام تعليقات مميز
• قائمة احترافية
• نموذج اتصل بنا مميز
• ايقونات المشاركة
• مزود باكواد السيو 100%
• والمزيد...

simplify  قالب بلوجر متجاوب - كيف حال المدونين ؟  نأمل انكم في صحة جيدة، أريد ان اقدم لكم قالب simplify الذي اثبت مقولة " البساطة...