شرح تغيير طريقة عرض المرفقات

MesterPerfect · 16 أبريل 2020

بسم الله الرحمن الرحيم
أهلا بكم في شرح جديد وإن شاء الله يكون مفيد
شرحنا اليوم يتمثل في كيفية تغيير شكل المرفقات من الشكل التقليدي إلى شكل قائمة
المعلومات
اسم الشرح : كيفية تغيير طريقة عرض المرفقات
توافق الشرح: xf2.1
موقع مقدم الشرح : mx-blind.com
مقدم الشرح : أحمد بكر @MesterPerfect
تمت التجربة: نعم

الشرح

ندخل إلى لوحة التحكم -==> المظهر -==> القوالب
نختار الستايل الذي نريد تعديله
نبحث عن قالب : message_macros
ثم نبحث داخله عن هذا الكود

HTML:

<xf:macro name="attachments" arg-attachments="!" arg-message="!" arg-canView="!">
    <xf:if contentcheck="true">
        <xf:css src="attachments.less" />
        <section class="message-attachments">
            <h4 class="block-textHeader">{{ phrase('attachments') }}</h4>
            <ul class="attachmentList">
                <xf:contentcheck>
                    <xf:foreach loop="$attachments" value="$attachment" if="!$message.isAttachmentEmbedded($attachment)">
                        <xf:macro template="attachment_macros" name="attachment_list_item"
                            arg-attachment="{$attachment}"
                            arg-canView="{$canView}" />
                    </xf:foreach>
                </xf:contentcheck>
            </ul>
        </section>
    </xf:if>
</xf:macro>

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

HTML:

<xf:macro name="attachments" arg-attachments="!" arg-message="!" arg-canView="!">
    <xf:if contentcheck="true">
        <xf:css src="attachments.less" />
        <section class="message-attachments">
            <h4 class="block-textHeader">{{ phrase('attachments') }}</h4>
            <xf:contentcheck>
            <xf:if contentcheck="true">
            <ul class="attachmentList">
                <xf:contentcheck>
                    <xf:foreach loop="$attachments" value="$attachment" if="!$message.isAttachmentEmbedded($attachment) AND $attachment.has_thumbnail">
                        <xf:macro template="attachment_macros" name="attachment_list_item"
                            arg-attachment="{$attachment}"
                            arg-canView="{$canView}" />
                    </xf:foreach>
                </xf:contentcheck>
            </ul>
            </xf:if>
         
            <xf:if contentcheck="true">
            <ul class="attachmentList attachmentListCustom">
                <xf:contentcheck>
                    <xf:foreach loop="$attachments" value="$attachment" if="!$message.isAttachmentEmbedded($attachment) AND !$attachment.has_thumbnail">
                        <xf:macro template="attachment_macros" name="attachment_list_item"
                            arg-attachment="{$attachment}"
                            arg-canView="{$canView}" />
                    </xf:foreach>
                </xf:contentcheck>
            </ul>
            </xf:if>
         
            </xf:contentcheck>
        </section>
    </xf:if>
</xf:macro>

وفي قالب : attachments.less قم بإضافة الكود التالي

CSS:

.attachmentList.attachmentListCustom
{
    .xf-minorBlockContent();
    display: block;
    padding: @xf-paddingMedium @xf-paddingLarge;
    margin-top: @xf-elementSpacer;
    .attachment
    {
        display: block;
        width: auto;
        background-color: transparent;
        border-width: 0;
        padding: 5px 0;
        margin: 0;
        > div { display: inline-block; }
        i { width: 24px; text-align: center; }
        i:before { font-size: 22px; }
        .attachment-icon.attachment-icon--img img { max-height: 24px; }
        .attachment-name { margin-top: 0; }
        &:first-of-type { padding-top: 0; }
        &:last-of-type { padding-bottom: 0; }
    }
}

النتيجة
قبل التعديل

بعد التعديل

وبهذا ينتهي شرحنا لهذا اليوم
ونراكم قريبا إن شاء الله
والسَلام عليكم ورحمة الله وبركاته

أبو غَيْث · 16 أبريل 2020

ما شاء الله عليك أخي أحمد مبدع من يومك
طريقة جميلة لعرض المرفقات وهي كطريقة vb
سلمت يداك

Lamine · 16 أبريل 2020

شكرا أخي على شرح الطريقة, فعلا شكل القائمة أفضل خاصة إذا كانت عدة ملفات ومتسلسلة

MesterPerfect · 18 أبريل 2020

XenArabia قال:
ما شاء الله عليك أخي أحمد مبدع من يومك
طريقة جميلة لعرض المرفقات وهي كطريقة vb
سلمت يداك

الأجمل مرورك أخي محمد
سلمك الله من كل شر

MesterPerfect · 18 أبريل 2020

Lamine قال:
شكرا أخي على شرح الطريقة, فعلا شكل القائمة أفضل خاصة إذا كانت عدة ملفات ومتسلسلة

العفو أخي الحبيب

al-jod · 18 أبريل 2020

ما شاء الله عليك اخي الغالي والحبيب MesterPerfect شرح كامل ومتكامل الله يجزيك الخير

Wagdys · 4 مايو 2020

في طريقة احدد بيها طول إسم المرفق في العرض؟
لانه لما بيتم ارفاق ملف اسمه كبير العرض بيبقى غير متوافق على التليفون

ابومازن · 11 نوفمبر 2021

في طريقة احدد بيها طول إسم المرفق في العرض؟
لانه لما بيتم ارفاق ملف اسمه كبير العرض بيبقى غير متوافق على التليفو

shqawe · 11 نوفمبر 2021

ابومازن قال:
في طريقة احدد بيها طول إسم المرفق في العرض؟
لانه لما بيتم ارفاق ملف اسمه كبير العرض بيبقى غير متوافق على التليفو

حياك الله اخوي @ابومازن

افتح قالب attachment_macros وابحث عن هالكود

HTML:

<span class="file-name" title="{$attachment.filename}">{$attachment.filename}</span>

واستبدله بهذا الكود

HTML:

<span class="file-name" title="{$attachment.filename}">{$attachment.filename|substr(0,30)}</span>

وتقدر تعدل الرقم 30 في الكود الثاني وهو عدد الاحرف التي سوف تظهر من اسم الملف المرفق

احترامي وتقديري
اخوك
شقاوي

ابومازن · 11 نوفمبر 2021

للاسف بعد البحث لا جديد اخى

ابومازن · 11 نوفمبر 2021

كود:

<xf:macro name="attachment_list_item" arg-attachment="!" arg-canView="!">
    <li class="attachment">
        <xf:if is="$attachment.has_thumbnail">
            <xf:macro template="lightbox_macros" name="setup" arg-canViewAttachments="{$canView}" />

            <div class="attachment-icon attachment-icon--img">
                <a href="{{ link('attachments', $attachment) }}" target="_blank" class="{{ $canView ? 'js-lbImage' : '' }}">
                    <img src="{$attachment.thumbnail_url}" alt="{$attachment.filename}" />
                </a>
            </div>
        <xf:else />
            <div class="attachment-icon" data-extension="{$attachment.extension}">
                <a href="{{ link('attachments', $attachment) }}" target="_blank"><i aria-hidden="true"></i></a>
            </div>
        </xf:if>
        <div class="attachment-name" style="width:100px!important;">
            <a href="{{ link('attachments', $attachment) }}" target="_blank" title="{$attachment.filename}">{$attachment.filename}</a>
        </div>
        <div class="attachment-details">
            <span class="attachment-details-size">{$attachment.file_size|file_size}</span>
            <span class="attachment-details-views">{{ phrase('views:') }} {$attachment.view_count|number}</span>
        </div>
    </li>
</xf:macro>

shqawe · 11 نوفمبر 2021

ابومازن قال:
للاسف بعد البحث لا جديد اخى

ما فهمت اخوي @ابومازن ايش هو اللي لا جديد؟

هل وضعت الكود مثل ماقلت لك؟ ام انك لم تجد الكود وياليت ترفق لي قالب attachment_macros

ابومازن · 11 نوفمبر 2021

كود:

<xf:macro name="attachment_list_item" arg-attachment="!" arg-canView="!">
    <li class="attachment">
        <xf:if is="$attachment.has_thumbnail">
            <xf:macro template="lightbox_macros" name="setup" arg-canViewAttachments="{$canView}" />

            <div class="attachment-icon attachment-icon--img">
                <a href="{{ link('attachments', $attachment) }}" target="_blank" class="{{ $canView ? 'js-lbImage' : '' }}">
                    <img src="{$attachment.thumbnail_url}" alt="{$attachment.filename}" />
                </a>
            </div>
        <xf:else />
            <div class="attachment-icon" data-extension="{$attachment.extension}">
                <a href="{{ link('attachments', $attachment) }}" target="_blank"><i aria-hidden="true"></i></a>
            </div>
        </xf:if>
        <div class="attachment-name" style="width:100px!important;">
            <a href="{{ link('attachments', $attachment) }}" target="_blank" title="{$attachment.filename}">{$attachment.filename}</a>
        </div>
        <div class="attachment-details">
            <span class="attachment-details-size">{$attachment.file_size|file_size}</span>
            <span class="attachment-details-views">{{ phrase('views:') }} {$attachment.view_count|number}</span>
        </div>
    </li>
</xf:macro>

ابومازن · 11 نوفمبر 2021

ويوجد عندى مشكله فى الاقسام الفرعيه القسم غير كامل فيه كلمات ناقصه من كل قسم كما ترى فى الصورة

shqawe · 11 نوفمبر 2021

ابومازن قال:

كود:

<xf:macro name="attachment_list_item" arg-attachment="!" arg-canView="!">
    <li class="attachment">
        <xf:if is="$attachment.has_thumbnail">
            <xf:macro template="lightbox_macros" name="setup" arg-canViewAttachments="{$canView}" />

            <div class="attachment-icon attachment-icon--img">
                <a href="{{ link('attachments', $attachment) }}" target="_blank" class="{{ $canView ? 'js-lbImage' : '' }}">
                    <img src="{$attachment.thumbnail_url}" alt="{$attachment.filename}" />
                </a>
            </div>
        <xf:else />
            <div class="attachment-icon" data-extension="{$attachment.extension}">
                <a href="{{ link('attachments', $attachment) }}" target="_blank"><i aria-hidden="true"></i></a>
            </div>
        </xf:if>
        <div class="attachment-name" style="width:100px!important;">
            <a href="{{ link('attachments', $attachment) }}" target="_blank" title="{$attachment.filename}">{$attachment.filename}</a>
        </div>
        <div class="attachment-details">
            <span class="attachment-details-size">{$attachment.file_size|file_size}</span>
            <span class="attachment-details-views">{{ phrase('views:') }} {$attachment.view_count|number}</span>
        </div>
    </li>
</xf:macro>

استبدل الكود المحدد باللون الاحمر فوق

بهذا الكود وخبرني ايش يصير معك

HTML:

{$attachment.filename|substr(0,30)}

بعدين اخوي ابو مازن انا ما ادري كيف تبحث ولكن في الزين فورو بمجرد ما تفتح القالب ضع المؤشر داخل القالب واضغط على ctrl+f راح يفتح لك مربع بحث داخل القالب ادخل فيه الكود اللي تبحث عنه وراح يجده لك ويحدده باللون الاضفر

shqawe · 11 نوفمبر 2021

ابومازن قال:
ويوجد عندى مشكله فى الاقسام الفرعيه القسم غير كامل فيه كلمات ناقصه من كل قسم كما ترى فى الصورة
مشاهدة المرفق 5405

اتمنى فتح موضوع في ركن المشاكل والحلول وباذن الله تجد المساعدة الموضوع هذا للشرح وليس للاستفسارات ياغالي

ابومازن · 11 نوفمبر 2021

shqawe قال:
اتمنى فتح موضوع في ركن المشاكل والحلول وباذن الله تجد المساعدة الموضوع هذا للشرح وليس للاستفسارات ياغالي

للاسف ليس لنا تصريح بعمل موضوع بقسم ركن المشاكل والحلول

shqawe · 11 نوفمبر 2021

ابومازن قال:
للاسف ليس لنا تصريح بعمل موضوع بقسم ركن المشاكل والحلول

لو سمحت افتح موضوع في قسم الشكاوي بخصوص هالمشكلة وراح يتم الرد عليك لان الجميع يمكنه كتابة موضوع في ركن المشاكل والحلول

محمد عكور · 12 نوفمبر 2021

ابومازن قال:
للاسف ليس لنا تصريح بعمل موضوع بقسم ركن المشاكل والحلول

هات رابط الموقع ادخل اشوفه

ابومازن · 12 نوفمبر 2021

مصرى سات

منتدى مصرى سات تحميل ملفات القنوات وتحميل فلاشات الريسيفرات وفلاشات الشاشات وشرحات الاجهزه سوفت وير صيانه ريسيفر اطباق تركيب دش

www.masrysat.com

شرح تغيير طريقة عرض المرفقات

:: مراقب زين العربية ::

:: الإدارة العامة ::

:: الأعضاء ::

:: مراقب زين العربية ::

:: مراقب زين العربية ::

:: الأعضاء ::

:: الأعضاء ::

:: الأعضاء ::

ربي أشرح لي صدري

:: الأعضاء ::

:: الأعضاء ::

ربي أشرح لي صدري

:: الأعضاء ::

:: الأعضاء ::

ربي أشرح لي صدري

ربي أشرح لي صدري

:: الأعضاء ::

ربي أشرح لي صدري

:: الأعضاء ::

:: الأعضاء ::

المواضيع المُشابهة

إحصائيات المنتدى

مشاركة هذه الصفحة