شريط أدوات أسفل رأس الموقع لكل فئة

[Canapin (Coin-coin le Canapin)]

إليك مثال عملي صنعته لك:

إليك كود HTML الذي وضعته في علامة التبويب After Header

<div id="category-general-banner" class="below-header-banner">
    <h2>🚀 Here's some content only displayed on the <strong>General</strong> category</h2>
</div>

<div id="category-site-feedback-banner" class="below-header-banner">
    <h2>✨ Here's some content only displayed on the <strong>Site Feedback</strong> category</h2>
</div>

إليك كود SCSS الذي وضعته في علامة التبويب CSS (يستخدم Discourse ميزات CSS الموسعة لـ SCSS):

$category_classes: "general", "site-feedback";

.below-header-banner {
    display: none;
}

@each $cat in $category_classes {
    body.category-#{$cat} {
        #category-#{$cat}-banner.below-header-banner {
            display: block;
        }
    }
}

إليك النتيجة. يظهر كل لافتة فقط في فئتها المخصصة.

آمل أن يساعد ذلك أكثر!