قالب مدونة الكلباني kalabani v1 مجاناً بدون حقوق ملكية
💫التعريف بقالب الكلباني kalabani v1 :
قالب الكلباني من القوالب البسيطة، الغنية عن التعريف الممصمة خصيصاً للمدونات التقنية ، وأيضا من القوالب التي تدعم قواعد الـ SEO التي تساعد مدونتك في القبول في برنامج أدسنس .
💫مميزات قالب الكلباني kalabani v1 :
[1] سهولة التركيب علي المدونة .
[2] المرونة التعامـل مع القالــب .
[3] البساطة في التنقل بين محتوياته .
[4] لا يحتوي علي حقوق ملكية .
[5] أماكن جــاهزة للأعـــــــلانات .
[6] اضافة ازرار التحميل والمعاينة .
[7] مضاف اليه كود صفحة الفهرس .
[8] مضاف اليه كود صفحة أتصل بنا .
[9] اضافة اسمك كمالك للقالب في الجزء السفلي منه .
[10] يدعم قواعد ال SEO .
💫تركيب قالب الكلباني kalabani v1 :
[1] حمل قالب التنظيف حتي يتم مسح جميع بقايا ملفات القالب القديم وحتي لا يحدث تعارض بين ملفات القالب القديم والجديد .
[2] حمل القالب الي مدونتك بالطريقة الإعتيادية .
[3] فعل نموذج سطح الكتب كما بالصورة .
أولاً : القائمة الرئيسية :
[1] للتعديل علي القائمة الرئيسية توجه الي المظهر ثم تعديل html .
[2] ابحث داخل القالب عن كلمة ( قائمة ) و كلمة ( تعديل ) وعدل علي الأقسام كما تشاء ، وضع رابط القسم مكان علامة # .
[3] للتعديل علي القائمة العلوية ابحث داخل القالب عن كلمة ( الفهرس ) وعدل أو أضف ما شئت .
ثانيـــاً : شريط الأخبار :
لتفعيل شريط الأخبار ابحث عن Breaking News url وضع رابط مدونتك مكانه .
ثالثـــاً : تركيب الإعلانات :
لتركيب الأعلان في الصفحة الرئيسة فقط وتحت اول موضوع :
ابحث عن kode adsense home here وضع كود ادسنس تحتها بعد تحويله من هنـــــا .
لتركيب الأعلان في مقدمة المواضيع :
ابحث عن kode adsense top here وضع كود ادسنس تحتها بعد تحويله من هنـــــا .
لتركيب اعلان ادسنس وسط المواضيع :
تلقائيا ابحث عن kode adsense mid here وضع كود ادسنس تحتها بعد تحويله من هنـــــا .
لتركيب اعلان ادسنس في نهاية المواضيع :
ابحث عن kode adsense botom here وضع كود ادسنس تحتها بعد تحويله من هنـــــا .
رابعاً : إضافة آداة أحث الموضوعات في الشريط الجانبي :
[1] توجه الى لوحة تحكم بلوجر .
[2] نختارمنها تخطيط .
[3] اضافة اداه جافا سكربت جديده .
[4] ضع هذا الرمز recentposts .
[5] ثم نضغط حفظ .
وبنفس الطريقة نضيف اداة اخر التعليقات بوضع الرمز recentcomments ثم حفظ
خامساً : إضافة صفحة أتصل بنا :
يجب إضافة " أداة نموذج الأتصال " حتي لو كانت فارغة ، لتظهر معنا الصفحات التي سوف ننشأها وتعمل بشكل جيد وصحيح وبدون أي أخطاء ( هذا النموذج موجود مسبقاً في جميع قوالب بلوجر ) وإضافة هذه الخطوة يجب تطبيقها في كل قوالب بلوجر وليس هذا القالب فقط ، ويتم إضافتها في قالب بلوجر كالتالي :
[1] نضغط علي تخطيط من لوحة تحكم مدونة بلوجر .
[2] اختار نموذج الأتصال .
[3] أضافة اداه جديدة ، بعد ذلك ننتقل الى انشاء صفحة اتصل بنا :
<form name="contact-form">
<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-user"></i> Name </span>
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-envelope"></i> Email Address <span style="color: #f56954; font-size: x-small; font-weight: bold;">important</span></span>
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-pencil-square-o"></i> Content <span style="color: #f56954; font-size: x-small; font-weight: bold;">important</span></span>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send" />
<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 {display:none;}
</style>
سادســـا : إضافة صفحة الفهرس :
انشيء صفحة جديدة وسميها " الفهرس " واذهب الي وضع html وضع الكود التالي ثم اضغط علي حفظ .
<div id="bp_toc">
</div>
<script src="https://cdn.rawgit.com/Arlina-Design/FlamingTree/master/sitemap2.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&max-results=9999&callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
.post-body td a {background:initial;color:#000;padding:initial;font-size:13px;float:initial;display:initial;border-radius:initial;font-weight:initial;}
.post-body td a:hover {background:initial;color:#3498db;text-decoration:underline;}
</style>
سابعـاً : إضافة رسائل التنبيه داخل مواضيع المدونة :
حدد المكان الذي تريد أن تضيف التنبيه فيه ، أذهب الي وضع html واختر أحد الأكواد التاليه علي حسب شكل التنبيه المطلوب ، ثم انتقل الي وضع تأليف واستبدل النص الموجود بين النقطتين بالرساله التي تريد أن تظهر في المشاركة .
<div class="alert-message success">
العنوان : ضع محتوى رسالة النجاح هنا <i class="fa fa-check-circle"></i>
</div>

<div class="alert-message alert">
العنوان : ضع محتوى رسالة التنبيه هنا.
<i class="fa fa-info-circle"></i>
</div>

<div class="alert-message warning">
العنوان : ضع محتوى رسالة التحذير هنا. <i class="fa fa-exclamation-triangle"></i>
</div>

<div class="alert-message error">
العنوان : ضع محتوى رسالة الخطأ هنا. <i class="fa fa-exclamation-circle"></i>
</div>
حدد المكان الذي تريد أن تضيف زر التحميل والمتابعة به ثم انتقل الي وضع html والصق أحد الأكواد التالية :
<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>
<div class="clear"></div>

<div id="wrap">
<a href="رابط المعاينة هنا" class="btn" target="_blank">معاينة <i class="fa fa-paper-plane"></i></a>
<a href="رابط التحميل هنا" class="btn down" target="_blank">تحميل <i class="fa fa-download"></i></a>
</div>

تاسعـاً : إضافة إطار للأكواد :
لأضافة الأكود داخل اطار، حدد الكان الذي تريد أن تضيف به الكود بالإطار ، ثم انتقل الى وضع html ،ثم الصق أحد الأكواد الأربعة التاليه ، ثم انتقل الى وضع تأليف مرة أخرى واستبدل النص الموجود بين النقطتين بكود البرمجه الخاص بك ، ليظهر داخل اطار كما موضح بالصورة .
<pre title="HTML" data-codetype ="HTMLku"><code class="language-markup"> ... ضع الكود هنا بين النقط تماما ... </code></pre>
<pre title="CSS" data-codetype ="CSSku"><code class="language-css"> ... ضع الكود هنا بين النقط تماما ... </code></pre>
<pre title="Javascript" data-codetype ="JavaScriptku"><code class="language-javascript"> ... ضع الكود هنا بين النقط تماما ... </code></pre>
<pre title="jQuery" data-codetype ="JQueryku"><code class="language-javascript"> ... ضع الكود هنا بين النقط تماما ... </code></pre>

تعليقات
إرسال تعليق