XF 2.3 كود اضافة ضبابية على المشاركات والردود ومنع الزوار من الاطلاع عليها

[ناصر]

بسم الله الرحمن الرحيم

الحمد لله والصلاة والسلام على رسول الله نبينا محمد عليه افضل الصلاة واتم التسليم

اللهم لا علم لنا إلا ما علمتنا، إنك أنت العليم الحكيم، اللهم علمنا ما ينفعنا، وانفعنا بما علمتنا، وزدنا علما،

اقدم لكم اليوم طريقة اضافة لمسة ضبابية على المشاركة الاولى للمواضيع مع وضع رسالة للزوار بتسجيل الدخول او التسجيل في المنتدى

والطريقة اﻻساسية هي من تقديم اخونا @Wolf Knight مشكورا وجزاه الله الف خير على هذه الاضافة

بسم الله نبدأ الشرح

نقوم بفتح قالب post_macros ونبحث عن هذا الكود:

{{ bb_code($post.message, 'post', $post) }}

ونقوم باستبداله بهذا الكود:

<div class="{{ (!$xf.visitor.user_id && $post.isFirstPost()) ? 'blur-message-content' : '' }}">
                {{ bb_code($post.message, 'post', $post) }}
            </div>
            
            <xf:if is="!$xf.visitor.user_id && $post.isFirstPost()">
                <div class="block blockMessage blockMessage--error blockVisitor">
                    يتوجب عليك
                    <a href="{{ link('login') }}" class=""
                            data-xf-click="overlay" data-follow-redirects="on">
                            <span class="p-navgroup-linkText">{{ phrase('log_in') }}</span>
                        </a>
                    او
                    <a href="{{ link('register') }}" class=""
                                data-xf-click="overlay" data-follow-redirects="on">
                                <span class="p-navgroup-linkText">{{ phrase('register') }}</span>
                            </a>
                    
                    لروئية الموضوع
                </div>
            </xf:if>

ثم نحفظ عملنا ونقوم بفتح قالب extra.less ونضيف له هذا الكود مع تعديل ما يلزم حسب حاجتك:

.blur-message-content {
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -ms-filter: blur(4px);
    -o-filter: blur(4px);
    filter: blur(4px);
    filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='2');
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.blockVisitor{
    margin-top: 1rem !important;
    a{
        color: @xf-linkColor !important;
    }
}

لتكون المحصلة النهائية بهذا الشكل



اتمنى التجربة وان شاء الله ان الكود يعمل بدون مشاكل

وان اصبت فهذا من فضل الله علي وان اخطأت فجل من ﻻ يخطأ


احترامي وتقديري