شرح طريقة استخدام مكتبة الخطوط fontello خطوة خطوة
المشاهدات:
4671
الردود:
6
ahmed200
اعضو ذهبى
السلام عليكم ورحمه الله وبركاته
ماهو موقع fontello.comهذا الموقع يتيح لك استخدام الصور الرمزية بصيغة الخط font ، بمعنى أنك لن تبحث بعد اليوم عن صور للايقونات الخاصة بموقعك
فقط من خلال هذة المكتبة الخاصة بالصورة والتي تم تحويلها الى صيغة font ستتمكن من استخدم هذة الصور في موقعك بكل بساطه ، فقط كل ماعليك هو ازالة الصور من القوالب واستبدالها بـ class وتضع اسم الصورة مبتدأ بـ
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
اذا سيتطلب منك تحميل الصور المطلوب استخدامها في الموقع وانا انصح بتحميل كامل المكتبة لتتمكن في استخدام أي صورة في أي وقت تريد .
:: خطوات التركيب ::
الخطوة الاولى :
1-اذهب للموقع
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
3- قم بالتحديد على كافة الصور وذلك بالضغط بالماوس بالزر الايسر من اعلى طرف مجموعة الصور وقم بسحب الماوس دون اخلاء الزر الايسر لتتمكن من تحديد كل مجموعة على حده بهذا الشكل :
4- بعد الانتهى من تحديد كافة الصور ستلاحظ ظهور عدد الصور المختارة في الزر الاحمر اعلى الموقع والذي سيكون بأسم download webfont وسيحمل عدد الصور المختارة كما بالصورة التاليه.
5- قم الان بالضغط على Download webfont لتحميل الملفات كما بالصورة.
6- اضغط من التبويبات في الاعلى على كلمة customize Name لترى جميع الصور التي قمت بإختيارها وكذلك اسم الصوره لتتمكن من نسخه ووضعه في اسم الكلاس class الذي تريد ان تظهر به الصوره كما في الشكل التالي :
الخطوة الثانية :
بعد تحميل الملفات قم برفعها جميعا الى مجلد موقعك الرئيسيى مع تعديل ملف fontello.css الموجود في مجلد css فى حال انك رفعته الى مجلد منتداتك فسيتطلب اضافة رابط موقع ليصبح على هذا الشكل.
الخطوة الثالثة:
1- رابط استدعاء المكتبة يكون على لشكل التالي :
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
- بالنسبه للمنتديات الفى بى يوضع فى قالب headinclude
- بالنسبه للمنتديات الزين فورو يوضع فى قالب PAGE_CONTAINER
الخطوة الرابعة:
في حال اردت إستبدال صورة في موقعك بـأحد هذه الايقونات قم فقط بإزالة كود الصورة كامل ومن ثم اضف class لحامل الصورة لتظهر بدل منها
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
اما بخصوص كود سيكون على هذا الشكل
كود
🔒 يجب تسجيل الدخول لمشاهدة محتوى الكود.
يوضع اما فى قالب extra وده للزين فورو او فى css رئيسي منتديات الفى بى
التعديل الأخير بواسطة المشرف:
