خط و ايقونات ماتريال ديزاين للمدونة بلوجر

اضافة خط و ايقونات ماتريال ديزاين للمدونة بلوجر، يعتربر تصميم ماتريال ديزاين من اهم  اللغات  تصميمية التي طورتها شركة جوجل عام 2014 على أساس تصميم ال‍بطاقات و ايقونات و صفحات ويب بشكل عام . وفي هذه التدوينة حول << اضافة خط و ايقونات متريال ديزاين للمدونة بلوجر >> سنتعرف على كيفية ستخدام هذه ايقونات على مدونات بلوجر.

خط و ايقونات متريال ديزاين للمدونة بلوجر

صور لتصميمات بواسطة متريال ديزاين :


اضافة خط و ايقونات متريال ديزاين للمدونة بلوجر

طريقة اضافة خط ايقونات متريال ديزاين :

توجه الى لوحة تحكم بلوجر
اختر قالب ثم تحرير 
ابحث عن <body> ثم اضف الكود التالي اسفله :
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
ابحث عن كود ]]></b:skin> و اضف كود التالي فوقه و قم بحفض القالب :
/*Material tharabic.com*/
.material-icons{font-family:'Material Icons';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:'liga'}
الان كيف تقوم بستخدام ايقونات 
توجه الى الموقع التالي و اختر احدى ايقونات :
بعد ذالك قم باضافة اسم ايقونة داخل الكود التالي :
<i class="material-icons">هنا اسم </i>
مثال توضيحي لنفترض اني اردت اضافة لاحد اقسام ايقونة 
القسم اضافات بلوجر سيكون على الشكل تالي :
<li><a href="/search/label/اضافات بلوجر?&amp;max-results=12">اضافات بلوجر</a></li>
و نتيجة بعدة اضافة ايقونة تصبح 
اضافة خط و ايقونات متريال ديزاين للمدونة بلوجر
<li><a href="/search/label/اضافات بلوجر?&amp;max-results=12"><i class="material-icons">extension</i>اضافات بلوجر</a></li>
هذا يتم استخدام ايقونات متريال ديزاين على مدونة بلوجر، اتمنى ان تكونو استفدتو من درس اليوم حول اضافة خط و ايقونات متريال ديزاين للمدونة بلوجر و اي تسائل يمكنكم طرحه في التعليقات.

2 تعليقات

  1. السلام عليكم
    شكراً بارك الله فيك
    لكن عندي سؤال كيف يمكن تحديد اتجاه الأيقونة يمين أو يسار ولك فائق الشكر والتقدير.

    ردحذف
    الردود
    1. هناك العديد من الطرق منها :
      بواسطة CSS :
      direction: rtl;
      بواسطة html :
      dir='rtl'

      حذف