عرض مشاركة واحدة
احصائياتى

الردود
3

المشاهدات
1623
ahmed200
.:: عضو مبدع ::.
  • ahmed200 will become famous soon enough

  • ahmed200 غير متواجد حالياً

المشاركات
584

+التقييم
27

تاريخ التسجيل
Aug 2015

الاقامة
فى القلب

نظام التشغيل
windows 8

رقم العضوية
306
11-13-2016, 02:23 PM
المشاركة 1
11-13-2016, 02:23 PM
المشاركة 1
افتراضي شرح إضافة صورة في الإستطلاع
هذا سوف يعطيك نموذجا أساسيا لإضافة الصور إلى الجانب الأيسر من صناديق الإستطلاع.
لكن يمكنك فقط استخدام صورة واحدة للموقع بأكمله

مثال


إفتح لوحة تحكم الإدارة وابحث عن قالب poll_block
ابحث عن هذا الكود

كود:
 <div class="pollContent">

أضف بعده هذا الكود


كود:
<div class="custom_pollImage"></div>

حفظ..
ثم إفتح قالب extra.css وأضف هذا الكود


كود:
.custom_pollImage {
background: url("linktoyourimage") no-repeat;
width: 150px;
height: 150px;
position: absolute;
left: -200px;
}

هذا الكود يتحكم في الرابط ،الطول والعرض للصورة.
كذلك يتحكم في مكان الصورة يمينا أو يساراً
لا انصح في زيادة طول الصورة أكثر من 150 هذا يؤثر على التصميم خصوصاً في الإستطلاعات الصغيرة

إذا كنت تريد أن تكون الصورة مختلفة في كل قسم،أضف هذا الكود في نفس القالب extra.css


كود:
 .nodeX .custom_pollImage {
background: url("linktoyourimage") no-repeat;
width: 150px;
height: 150px;
position: absolute;
left: -200px;
}

حرف X يعني رقم القسم

لإزالة علامة السؤال الذي عادة ما يظهر على يسار عنوان الإستطلاع, أضف هذا الكود



كود:
.pollBlock .questionMark {
display: none;
}

إذا كنت تريد أن يكون قالب الإستطلاع وكل التغييرات متوافقة مع جميع أحجام الشاشات،
أضف هذا الكود في نفس القالب extra.css



كود:
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth) {
.custom_pollImage {
display: none;
}
}

@media (max-width:@maxResponsiveMediumWidth) {
.custom_pollImage {
display:none;
}
}

@media (max-width:@maxResponsiveNarrowWidth) {
.custom_pollImage {
display:none ;
}
}
</xen:if>

إنتهى الشرح