هذا صحيح بشكل عام، فإن CSS ليست طريقة آمنة لإخفاء أي شيء لأن شخصًا ما قد يبحث في مصدر الصفحة لأي سبب… ولكننا نقدم عرضًا بدون جافاسكريبت لمحركات الزحف، لذلك في هذه الحالة، لا تتم فهرسة المحتوى المضاف بواسطة السمات عادةً على أي حال.
3 إعجابات
لقد قمت بتحديث رابط المعاينة، يجب أن يعمل الآن!
3 إعجابات
هل من الممكن استخدام هذه المكونة لاستدعاء جافاسكريبت باستخدام
javascript:script('function');
بدلاً من عنوان URL فعلي؟
(يبدو أنها تعمل تقريبًا، ولكني أواجه انتهاكات CSP.)
تم التعديل للإضافة:
لقد نجحت في جعلها تعمل. إذا تساءل أي شخص آخر في أي وقت، فقد استخدمت # في واجهة المستخدم للمكونة بدلاً من عنوان URL، ثم استخدمت مستمع حدث لاستدعاء دالة جافاسكريبت.
من المحتمل أن يعرف الآخرون طريقة أفضل، وآمل أن يشاركوا تلك المعرفة إذا فعلوا ذلك!
إعجابَين (2)
مرحباً، أود تعديل نمط وحجم خط روابط الترويسة. هل يمكن لأحد أن يوجهني إلى CSS الصحيح الذي يسمح لي بالقيام بذلك؟ شكراً!
إعجابَين (2)
مرحباً @brentoshiro، ستختلف الخصائص بناءً على ما تحتاجه للتصميم، ولكن الطريقة التي ستختار بها الروابط ستكون كالتالي:
لتصميم جميع روابط الرأس:
.custom-header-links .headerLink a {
font-size: 1rem; // استبدل بحجم الخط الذي تختاره
color: #96b67b; // يمكن أيضًا استخدام متغيرات مثل var(--tertiary);
font-style: italic; // الخيارات: normal, italic, oblique
}
لتصميم رابط معين
يمكنك الوصول إلى الرابط إما باستخدام عنوان الرابط (مفصول بشرطات وأحرف صغيرة) كالتالي لـ “Privacy”:
.custom-header-links .headerLink.privacy-custom-header-links a:hover {
color: red;
}
أو باستخدام السمة title وإدخال عنوان الرابط:
.custom-header-links .headerLink a[title='Our Privacy Policy'] {
color: purple;
}
لإضافة أنماط عند التحويم، ما عليك سوى إضافة :hover بعد وسم a:
.custom-header-links .headerLink a:hover {
color: var(--primary-low);
}
إعجابَين (2)
مرحباً، هل يمكن تنسيق الروابط لتكون في المنتصف بدلاً من مجرد محاذاة لليسار/اليمين؟
إعجاب واحد (1)
هذا رائع حقًا. أتساءل عن مقدار العمل الإضافي الذي سيتطلبه هذا للسماح بقوائم مختلفة من روابط الرأس لكل مجموعة؟ لدينا موظفون وطلاب على موقعنا ونود أن نكون قادرين على توفير روابط أساسية مختلفة في الرأس لكل مجموعة.
3 إعجابات
يمكنك تحقيق ذلك عن طريق جعل كل مجموعة تستخدم سمة (Theme) مختلفة، حيث تستخدم كل سمة نسختها الخاصة من مكون السمة (Theme Component) هذا.
سينجح هذا بشكل جيد إذا كانت إحدى مجموعتيك ثابتة جدًا (أو على الأقل أصغر) - تبدو مجموعة الموظفين مثالية لذلك. أو على الأقل إذا كان لديك مجموعة ديناميكية واحدة فقط.
ثم تجعل روابط الطلاب هي السمة الافتراضية للموقع، ثم تجعل أعضاء هيئة التدريس لديهم روابط الموظفين يدويًا (إما عبر واجهة المستخدم أو عبر وحدة تحكم Rails).
6 إعجابات
كنت سأأتي إلى هنا لطرح هذا السؤال حيث لاحظت أخيرًا أنها تظهر على شاشة تسجيل الدخول
في حالتي، يتغير أحد الروابط كل شهر (بينما يظل اسم الرأس كما هو). هل من الممكن إخفاء الرأس باستخدام رمز دون الحاجة إلى تعديل لإخفاء الرابط؟ على سبيل المثال، باستخدام مثالك سيكون لدي
دعم العملاء
2022-customer-support/26903 هو الرابط الخاص بي، ثم customer-support-july، إلخ.
لذلك كما ترى، فإن إخفاء customer-support-june سيعمل بشكل جيد، ولكنه يجب تحديثه شهريًا بدلاً من إخفاء “FAQ” (ولا يمكنني أيضًا إضافة /26903 من الموضوع إلى رمز CSS لذلك لا يمكنني إخفاء هذا الرابط المحدد على الرغم من أنه يمكنني ربما تجاوز هذا عن طريق نشر الصفحة؟). إذا لم تكن هناك طريقة أخرى للقيام بذلك، فهذه ليست مشكلة كبيرة على الإطلاق، فهي ليست أي جهد، بل إنها تضمن أنني سأنسى.
إعجابَين (2)
مرحباً، كنت أتساءل عما إذا كان من الممكن الحصول على ترجمات للنص؟ ربما عن طريق تضمين مفاتيح الترجمة، إذا كان المكون يتضمنها 
إعجابَين (2)
**هل هناك سبب لعدم ظهوره للمستخدمين غير المسجلين افتراضيًا؟ **
تجاهل، لسبب ما عندما أطبق مكونًا على السمة، لا يظهر. يجب عليّ إضافة المكون إلى السمة بدلاً من ذلك.
إعجاب واحد (1)
استخدام أيقونات UTF-8
لاحظ أنه يمكنك استخدام أيقونات UTF-8 كمرتكزات للروابط.
في هذه الحالة، قد ترغب في تجربة CSS هذا لمطابقة أيقونات القائمة المنسدلة الأخرى في الرأس:
.custom-header-links .headerLink {
margin-top: -1px;
}
.custom-header-links .headerLink a {
padding: 3px 10px;
color: var(--primary-low-mid);
font-size: var(--font-up-5);
font-weight: bold;
}
.custom-header-links .headerLink:hover {
background-color: var(--primary-low);
}
.custom-header-links .headerLink:hover a {
color: var(--primary-medium);
}
إنه يفعل شيئًا كهذا:
إعجاب واحد (1)
لقد قمت للتو بتثبيت هذه المكونة وأضفت بعض الروابط، لكنها لم تظهر.
اكتشفت أن إدخال لغة يمنع ظهور الروابط على موقعي. في الأصل، أضفت “blank” للاكتمال على الرغم من أنها لم تكن ضرورية. لم تظهر الروابط حتى عندما غيرت “blank” إلى “en”. إزالة القيمة تمامًا أصلحت المشكلة في حالتي. ليس لدي أي فكرة عن السبب، لكنني اعتقدت أنه من المفيد ذكر ذلك في حال واجه أي شخص مشكلة مماثلة.
إعجابَين (2)
لقد وقعت في نفس المشكلة بنفسي في اليوم الآخر أيضًا:
سأرى ما إذا كان بإمكاننا ربما تغيير الأمثلة الافتراضية لجعلها أكثر سهولة في الفهم.
إعجابَين (2)
لقد قمت بإزالة اللغة من الإعدادات الافتراضية هنا: UX: remove locale from default settings by awesomerobot · Pull Request #38 · discourse/discourse-custom-header-links · GitHub
لذلك يجب أن تظهر الآن الإعدادات الافتراضية بغض النظر عن اللغة التي تم ضبط الموقع عليها. شكرًا @packman و @JammyDodger!
إعجابَين (2)
اختفت روابطي بعد آخر ترقية (كمبيوتر شخصي، أوبونتو، برايف)
هل يمكنك التحقق من ذلك؟
@cmdntd – انظر الموضوع المنفصل. من المحتمل أن يكون لديك ترقية Discourse متاحة ضمن Admin | Upgrade ستحل هذه المشكلة.
إعجاب واحد (1)
لقد تم استبدال الرابط المخصص الخاص بي مؤخرًا بالروابط الافتراضية الثلاثة. في المعاينة، يعمل.
هذا موقع مستضاف، لقد خطر ببالي للتو أن شيئًا ما قد تغير في السمة، بحيث لا يتم التعرف عليه بواسطة روابط الرأس المخصصة. سأتحقق من ذلك وأبلغكم.
كواك! لقد قمت بمعاينة المكون الإضافي في سمات مختلفة وجميعها عملت. لقد سجلت الخروج وعمل. لقد قمت بتبديل المتصفحات وعمل. هناك رائحة قوية لقطة شرودنجر هنا.
إعجاب واحد (1)