هل يمكنني ببساطة إضافة أدلة إلى تثبيت Discourse الخاص بي؟

مطور
1

إذًا، كنت أضيف خطًا محليًا إلى موقعي. في ملف CSS الخاص بالسمة، وضعت:

@font-face {
  font-display: swap; /* تحقق من https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display للخيارات الأخرى. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/montserrat-v26-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

في ملف HTML الخاص بي، وضعت:

<link rel="preload" href="/fonts/montserrat-v26-latin-italic.woff2 " as="font" type="font/woff2" crossorigin="">

ثم قمت بالحفظ، وتحديث موقعي، وعرض مصدر الصفحة، والنقر على عنوان URL /fonts/montserrat-v26-latin-italic.woff2، مما أدى بي إلى:
https://forums.mysite.com/fonts/montserrat-v26-latin-italic.woff2

وواجهت صفحة Nginx “404 Not Found”. فكرت، “أوه انتظر، ليس لدي مجلد خطوط في دليل Discourse الخاص بي على خادم VPS الخاص بي.” اعتقدت أنه من الغريب أنه لم يسحبها ببساطة من مجلد الخطوط في السمة الخاصة بي. لذلك، أضفت مجلد “fonts” في /var/discourse/shared/standalone/. وضعت ملف الخط الخاص بي هناك، وقمت بتحديث صفحة المتصفح مرة أخرى، ولا يزال هناك خطأ 404. هل يمكنني ببساطة إضافة مجلدات إلى Discourse بهذه الطريقة أم أحتاج إلى إعادة تشغيل الخادم الخاص بي ليأخذ التأثير أو ماذا؟

2

لست متأكدًا من إضافة الدلائل، ولكن فيما يتعلق باستخدام ملفات الخطوط في السمات، توجد طريقة مدمجة يمكنك تجربتها. إذا كنت تقوم بتحرير ملفات السمة يدويًا، يمكنك إضافة الخط إلى دليل /assets الخاص بالسمة، ثم إضافة إدخال له في ملف about.json كما يلي:

{
  // خصائص أخرى
  "assets": {
    "my-font-identifier": "assets/my-font-file.woff2"
  }
}

ثم في @font-face يمكنك الإشارة إليه باستخدام src: url($my-font-indentifier);

إذا كنت تستخدم محرر السمات في واجهة الإعدادات فقط، أعتقد أنه يمكنك إضافته إلى قسم التحميلات، ووضع المعرف الذي تريد استخدامه في حقل SCSS var name، ثم الإشارة إليه بنفس الطريقة في SCSS.

5 إعجابات
3

إذًا، هل سيكون رمز الأصول هكذا لكل خط أقوم به؟

  "assets": {
    "montserrat-reg": "assets/montserrat-v26-latin-regular.woff2",
    "montserrat-ita": "assets/montserrat-v26-latin-italic.woff2"
},

تحرير: لقد نجح ذلك. لا يزال عنوان URL المباشر /assets/ للخط يعرض 404، لكن الخط يعمل على الصفحة، لذا :man_shrugging:

4

في إعدادات موقع المسؤول، يمكنك تغيير الخط إلى Montserrat.
الخط الأساسي
خط العناوين

إذا كنت ترغب في إضافة خط غير موجود في النواة ولكنه موجود في Google Fonts، فيمكنك استخدام مكون السمة هذا:

5 إعجابات
5

نعم، مونتسيرات مخصصة لصفحة مختلفة. أقدر ذلك مع ذلك!
المشكلة في خطوط جوجل هي أنها تبطئ الصفحات عن طريق تحميل أكثر من 200 حرف، معظمها لا يستخدمه الأشخاص أبدًا.

إعجاب واحد (1)
6

لا، لا يفعل ذلك — عندما تستخدم 3-4 مجموعات خطوط كحد أقصى (والأوزان المطلوبة فقط) كما ينبغي.

إعجابَين (2)
7

كان لدي سؤال حول هذا: لذا، عندما تعرض مصدر صفحة المنتديات لموقع Discourse الخاص بك (أو أي موقع آخر)، وتبحث عن “font”، فإنها تعرض الكثير منها. هل يتم تحميل كل هذه الخطوط حتى لو اخترت خطًا واحدًا أو اثنين فقط أثناء معالج الإعداد؟ إذا كان الأمر كذلك، فأود تحميل الخط الذي اخترته فقط.

8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.