شريط اخباري

تركيب وإستخدام أيقونات Font Awesome للمواقع والمدونات

تركيب وإستخدام أيقونات Font Awesome للمواقع والمدونات
لايوجد قالب لموقع ولا مدونة على بلوجر في الوقت الحالي لا يستخدم أيقونات Font Awesome في تكويده، حيث انها تضفي مظهرا أنيقا وحديثا للمواقع والمدونات، ولمن لا يعرف فمكتبة أيقونات Font Awesome هي مكتبه تضم عدد من الأيقونات التي من الممكن أن يتم إضافتها إلى صفحات الموقع من خلال أكواد ووسوم معينه, وبدون الإضطرار إلى تحميل الأيقونات بصيغ png ولا gif، وفي هذا المقال من موقعنا مقال تك سأشرح طريقة تركيب وإستخدام أيقونات Font Awesome للمواقع والمدونات بسهوله وتحسين أكواد المكتبة حتى لا تؤثر على سرعة المدونة.
إقرأ أيضا: كيفية إنشاء مدونة بلوجر إحترافية مجاناَ وشرح لوحة كتابة التدوينات بالتفصيل

مميزات مكتبة أيقونات Font Awesome

  • تضم أشهر الأيقونات التي يحتاج إليها أصحاب المواقع والمدونات
  • مجانية تماما
  • لا تظطر إلى تحميل صور الأيقونات
  • خفيفه ولا تؤثر على سرعة القالب
  • سهلة التركيب والإستخدام
  • يمكنك وضع رابط على الأيقونات
  • يمكنك إختيار الحجم الذي تفضله لكل أيقونه
  • يسمح بتحريك الايقونات بسهوله
  • يمكنك وضع إطار لها

طريقة تركيب مكتبة أيقونات Font Awesome للمواقع والمدونات

هذه هي جميع إصدارات مكتبة أيقونات Font Awesome مرتبه من الأحدث إلى الأقدم  وأحدث نسخه في الأعلى وأقدم إصدار في الأسفل إختر الإصدار الذي تفضله وهي جميعها مجانيه، وبعدذلك قم بتضمين الرابط في هذا الكود
حيث يتم إستبدال كلمة الرابط برابط الإصدار الذي قمت بنسخه، ويتم وضع كود المكتبه
قبل الوسم </body> (نوصي بذلك حتى لا يؤثر الكود على سرعة المدونة)
أو تحت الوسم <head>
ولتحسين الكود بشكل أفضل إقرأ: رفع سرعة مدونة بلوجر من خلال تحسين ملفات CSS

طريقة إستخدام أيقونات Font Awesome للمواقع والمدونات

أولا يجب أن تحصل على الوسم الخاص بالأيقونه التي ترغب بها إذهب إلى:
مكتبة أيقونات Font Awesome
أو
محرك بحث الأيقونات
ثم إختار الأيقونه وستجد إسمها تحتها كما بالصورة قم بنسخه
تركيب وإستخدام أيقونات Font Awesome للمواقع والمدونات
بعد إختيار إسم الأيقونه إتبع الخطوات التالية لتخصيصها ووضعها في مدونتك:
كود عرض الأيقونه مع العلم أن bell هو إسم الأيقونه التي قمت بإختيارها وستكون النتيجه هكذا
كود عرض الأيقونه مع رابط ينبغي تغيير www.maqaltek.com  فتصبح النتيجه هكذا
كود عرض الأيقونه بحجم معين لمعلومات أكثر إدخل Sizing Icons
fa-lg
fa-2x
fa-3x
fa-4x
fa-5x
كود عرض الايقونه مع تأثير الدوران فتصبح النتيجه هكذا
كود عرض الايقونات في شكل قائمه رأسية فتصبح النتيجه هكذا:
السطرين الأول والأخير يخصان توسيط قائمة الأيقونات غير center إلى right لجعلها في اليمين أو left لجعلها في اليسار
كود تغيير إتجاه الأيقونات لتصبح النتيجه هكذا
fa-rotate-90
fa-rotate-180
fa-rotate-270
fa-flip-vertical
fa-flip-horizontal
كود وضع إطار للايقونه لتصبح هكذا
بعد تخصيص الايقونات من خلال أكواد توضع إما داخل قالب المدونه أو في المواضيع من خلال تبديل وضع الإدخال من تأليف إلى HTML ووضع كود الايقونه ثم نشر الموضوع، وبهذا أصبحت لديك معلومات كافيه عن تركيب وإستخدام أيقونات Font Awesome للمواقع والمدونات.
إقرأ أيضا: شرح تركيب زر الصعود لأعلى إلى مدونات بلوجر
تابع الجزء التالي من الشرح

جديد قسم : دروس بلوجر

إرسال تعليق

اعلان خاصية تقسيم المواضيع
اعلان اول الموضوع
اعلان اخر الموضوع
اعلان فوق مقالات ذات صله
اعلان بعد الفقرة الاولي