إضافة زر في الرأس للمستخدمين المسجلين

كيف يمكنني إضافة زر إلى الرأس للمستخدمين المسجلين فقط. سأحتاج إلى إضافة نص مخصص ورابط لهذا الزر.

هل قمت بالبحث في فئة Theme component لمعرفة ما إذا كان هناك شيء موجود بالفعل يناسب احتياجاتك؟

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

العرض للمستخدمين المسجلين فقط

يمكنك استهداف المستخدمين المجهولين لإخفاء العناصر منهم. مثل هذا على سبيل المثال، والذي يخفي العلامات في قائمة الشريط الجانبي للتنقل من المستخدمين غير المسجلين. يمكنك استخدام رمز مشابه لإخفاء أي عنصر في الرأس من المستخدمين المجهولين.

.anon .sidebar-section-wrapper.sidebar-section[data-section-name=\"tags\"] {
    display: none;
}
إعجابَين (2)

هذا حل رائع،
أردت حقًا زرًا واحدًا في الأعلى.
ما انتهى بي الأمر بفعله هو أنني سألت ChatGPT عن كيفية إضافته يدويًا باستخدام التعليمات البرمجية وأعطاني حلاً فعالاً…

Header:

<script type="text/discourse-plugin" version="0.8.22">
api.decorateWidget('header-buttons:after', helper => {
    let currentUser = api.getCurrentUser();
    if (!currentUser) return; 
    
    return helper.h('li.custom-login-button-li', [
        helper.h('a.custom-login-button', { href: 'ENTER URL HERE', target: '_blank'}, 'Button')
    ]);
});
</script>

CSS

.custom-login-button {
    display: inline-block;
    margin: 0;
    padding: 0.5em 1em;
    text-align: center;
    vertical-align: middle;
    border: 1px solid transparent;
    font-weight: bold;
    line-height: 1.5;
    border-radius: 3px;
    color: #fff !important;
    background-color: #0084ff;
    border-color: #0076e6;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.custom-login-button:hover {
    background-color: #0076e6;
    border-color: #0065d0;
}

.custom-login-button-li {
    list-style-type: none;
}
إعجاب واحد (1)

عمل رائع يا @Sami_Syed.

أستخدم رابط أيقونة الرأس TC أعلاه في منتدياتي لأيقونة واحدة لمستخدمي الهاتف المحمول فقط.

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

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