البنية الأساسية لقالب بلوجر | قالب بلوجر فارغ

إذا كنت تريد تصميم قالب بلوجر جديد ومن الصفر فأول شئ تقوم بالذهاب إلى مدونتك التي تريد تصميم لها قالب جديد ويفضل أن يكون التصميم على مدونة تجريبية وذلك لتجربة التصميم ، بعد الدخول إلى المدونة انتقل إلى
المظهر ثم اضغط على زر تحرير HTML ثم تظهر صفحة أخرى ، قم بحذف جميع الأكواد التي تراها أمامك بالضغط على زر ctrl+a وذلك لتحديد جميع الأكواد ثم الضغط على زر delete من لوحة المفاتيح لحذف الأكواد السابقة ثم قم بنسخ الشفرة التالية ولصقها بموقعك ثم الضغط على زر حفظ وعند مشاهدتك للمدونة ستجدها صفحة بيضاء.

ومن هنا تكون أضفت البنية الأساسية لقالب بلوجر، مع العلم لا يمكنك حفظ الصفحة بدون وجود ويدجيت واحدة على الأقل

ابدء الآن بتصميم القالب الخاص بك وإضافة تنسيقات css التي تراها مناسبة لك.

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


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' b:responsive='true' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <meta charset='UTF-8'/>
    <meta content='IE=edge' http-equiv='X-UA-Compatible'/>
    <meta content='width=device-width, initial-scale=1' name='viewport'/>

    <title>
      <b:if cond='data:view.isHomepage'>
        <data:blog.title/>
        <b:elseif cond='data:view.isError'/> الصفحة غير موجودة
        <b:else/>
        <data:blog.pageName/>
      </b:if>
    </title>


    <meta expr:content='data:blog.metaDescription' name='description'/>

    <b:skin><![CDATA[
/* ضع هنا أكواد css*/
]]></b:skin>


    <b:template-skin><![CDATA[
/* ضع هنا أكواد css
لتنسيق لوحة التخطيط في لوحة التحكم
*/
  ]]></b:template-skin>

  </head>
  <body>

    <b:section class='test' id='test' showaddelement='yes'/>

    <script>//<![CDATA[
      // لإضافة أكواد جافا سكريبت
      //]]></script> 
  </body>
</html>

الشرح

?xml للتعبير عن لغة xml

version="1.0" رقم الاصدار الخاص بلغة xml

encoding="UTF-8" نوع الترميز

!DOCTYPE html نوع الوثيقة المستخدمة في الصفحة HTML5

b:css من خلال هذا الكود يمكنك تعطيل أو تفعيل تنسيقات
CSS الافتراضية ، فإذا لم تستخدم هذا الكود سيتم تفعيل تنسيقات CSS الافتراضية بشكل تلقائي في قالب بلوجر ، وهذا الكود يشمل قيميتين true صحيح وهي تقوم بتفعيل تنسيقات css الافتراضية ، وقيمة false تقوم بتعطيل تنسيقات CSS
الافتراضية

b:defaultwidgetversion لتحديد رقم الاصدار الافتراضي للويدجات ، يجب أن تكون القيمة رقمية 1 أو 2

b:layoutsVersion لتحديد رقم الاصدار الافتراضي لإضافات التخطيط ، يجب أن تكون القيمة 1 أو 2 أو 3 مع العلم أن الاصدار 3 يعمل فقط مع b:defaultwidgetversion 2

b:responsive لدعم التجاوب وتشمل true صحيح أو false خطأ

expr:dir='data:blog.languageDirection' لتحديد اتجاه لوحة التخطيط والقالب تلقائيا حسب اللغة المستخدمة في حسابك في جوجل

<b:skin> *** </b:skin> هذه المنطقة خاصة لإضافة تنسيقات css وهي مهمة جدا وبدون كتابة <b:skin> في القالب لا يمكنك حفظ القالب الخاص

<b:template-skin> *** </b:template-skin> يمكنك من خلالها إضافة وتنسيق الأدوات التي تظهر في لوحة التحكم


<b:section class='test' id='test' showaddelement='yes'/>

b:section مهمة جداً في القالب والتي سوف تستخدمها كثيرا لإضافة الأدوات في القالب الخاص بك , ويجب أن تكون هناك أداة واحدة على الأقل في القالب لكي يتم حفظ القالب الخاص بك

كيفية إضافة أداة تخطيط جديدة في بلوجر