web fonts repository

مستودع خطوط الويب

استضافة WebFont بسيطة مستوحاة من Fonts Google. يعمل على الخادم الخاص بك ، ويخزن وتوزيع ملفات WebFont وإنشاء CSS أثناء التنقل لتضمين الخطوط على صفحات الويب.

بداية سريعة

متطلبات

1. خادم HTTP يدعم PHP ≥ 7.0
2. الملحن (مطلوب للتثبيت)

تثبيت

1. قم بتنزيل رمز المصدر

قم بتشغيل الرمز التالي في وحدة التحكم:

composer create-project finesse/web-fonts-repository webfonts

حيث يكون webfonts طريقًا إلى دليل حيث يجب تثبيت المستودع.

أو يمكنك عمل بعض الأشياء يدويًا:

1. قم بتنزيل رمز المصدر من Github واستخراجه.
2. افتح محطة وانتقل إلى جذر رمز المصدر.
3. تثبيت المكتبات عن طريق التشغيل في المحطة:

   composer install

4. قم بإعداد المستودع عن طريق التشغيل في المحطة:

   composer run-script post-create-project-cmd

2. أذونات الملف

امنح المستخدم نيابة عن خادم الويب يقوم بتشغيل الأذونات للكتابة داخل دليل logs .

يمكنك فقط تشغيل هذا في وحدة التحكم:

 # Don't do it in production!
chmod 777 logs

3. خادم الويب

اجعل الدليل public هو جذر المستند لخادم الويب. أو فقط افتح http: // localhost/public إذا قمت بتثبيت المستودع على جذر خادم الويب.

قم بتوصيل جميع الطلبات إلى الملفات غير الموجودة بواسطة public/index.php . إذا كان الخادم الخاص بك هو Apache ، فقد تم بالفعل.

اجعل الخادم يضيف Access-Control-Allow-Origin: * HTTP-Header إلى ملفات الخط. وإلا فإن بعض المتصفحات سوف ترفض استخدام الخطوط من المستودع.

• Apache: كل ما عليك فعله هو التأكد من أن وحدة mod_header.c قيد التشغيل (قم بتشغيل أمر a2enmod headers وإعادة تشغيل الخادم لتشغيله).
• Nginx: استخدم هذه التعليمات.

يثبت

ضع ملفات الخط (Woff ، Woff2 ، TTF ، OTF ، EOT ، SVG) إلى دليل public/fonts . يمكنك فصلها عن طريق الدلائل الفرعية. يمكنك تحويل ملفات WebFont باستخدام Transfonter.

جميع الإعدادات تنتقل إلى config/settings-local.php . إذا لم يكن لديك ذلك ، فقم بنسخه من ملف config/settings-local.php.example .

حدود:

displayErrorDetails

ما إذا كان ينبغي إرسال تفاصيل الأخطاء إلى المتصفح. على أي حال ، تتم كتابة الأخطاء إلى logs/app.log . يجب عليك إيقاف تشغيله على خادم الإنتاج.

logger / level

كم عدد الرسائل التي يجب تسجيلها إلى الملف. القيمة هي واحدة من الثوابت PsrLogLogLevel . يمكنك قراءة المزيد حول مستويات السجل هنا.

fonts

قائمة الخطوط المتاحة في المستودع. مثال بسيط:

 return [
    // ...
    ' fonts ' => [
        ' Open Sans ' => [
            ' styles ' => [
                ' 300 ' => ' OpenSans/opensans-light.* ' ,
                ' 300i ' => ' OpenSans/opensans-light-italic.* ' ,
                ' 400 ' => ' OpenSans/opensans-regular.* ' ,
                ' 400i ' => ' OpenSans/opensans-regular-italic.* ' ,
            ]
        ],
        ' Roboto ' => [
            ' styles ' => [
                ' 300 ' => ' Roboto/roboto-light.* ' ,
                ' 400 ' => ' Roboto/roboto-regular.* ' ,
                ' 500 ' => ' Roboto/roboto-medium.* ' ,
                ' 700 ' => ' Roboto/roboto-bold.* ' ,
            ]
        ]
    ]
];

مفاتيح مجموعة fonts هي أسماء العائلات. مفاتيح صفائف styles هي أسماء الأنماط. الأرقام في أسماء النمط هي أوزان الخط ، i أقف على مائل.

يتم إعطاء مسارات ملف الخط بالنسبة إلى دليل public/fonts . مسارات الملف هي أنماط البحث عن الكرة الأرضية. وهذا يعني أن المستودع يجب أن ينظر في جميع الملفات التي تطابق النمط كملفات الخطوط.

يمكنك العثور على المزيد من الأمثلة والإمكانيات هنا.

الاستخدام

أضف علامة <link> إلى رمز HTML الخاص بالصفحة التي تريد تضمين خط:

 < link rel =" stylesheet " href =" http://web-fonts-repository.local/css?family=Open+Sans:400,400i,700,700i|Roboto:300,400 " />

حيث http://web-fonts-repository.local هو عنوان URL للجذر لمستودع خطوط الويب المثبتة.

يتم تحديد الخطوط المطلوبة بنفس الطريقة الموجودة في خطوط Google. يتم تقسيم عائلات الخط على | ، يتم تقسيم أنماط العائلات باسم العائلة , يتم فصلها عن قائمة الأنماط باستخدام : .

يمكنك حذف قائمة الأنماط. في هذه الحالة ، يتم استخدام النمط العادي ( 400 ).

 < link rel =" stylesheet " href =" http://web-fonts-repository.local/css?family=Open+Sans " />

يمكنك تحديد قيمة لخاصية نمط Font-Display باستخدام معلمة display . مثال:

 < link rel =" stylesheet " href =" http://web-fonts-repository.local/css?family=Open+Sans&display=swap " />

ثم تضمين خط في رمز CSS:

 body {
    font-family : 'Open Sans' , sans-serif;
}

توافق الإصدارات

يتبع المشروع الإصدار الدلالي.

وهذا يعني أن إصدارات التصحيح متوافقة تمامًا (أي 1.2.1 و 1.2.2) ، تكون الإصدارات الثانوية متوافقة للخلف (أي 1.2.1 و 1.3.2) والإصدارات الرئيسية غير متوافقة (أي 1.2.1 و 3.0). إصدارات ما قبل الإصدار (0.*) مختلفة بعض الشيء: إصدارات التصحيح متوافقة مع الإصدارات إلى الوراء وتكون الإصدارات الثانوية متوافقة.

رخصة

معهد ماساتشوستس للتكنولوجيا. انظر ملف الترخيص للحصول على التفاصيل.