[ BBcode] : كيفية تغيير طريقة عرض المرفقات

IQ Games Tech

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

الشرح

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

كود:
<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>​
ثم نستبدله بهذا الكود

كود:
<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​
قم بإضافة الكود التالي

كود:
.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; }
}
}​
النتيجة
قبل التعديل



بعد التعديل



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

متابعة القراءة...
 
أعلى أسفل