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

0 مشاهدة
اضافة فتح صورة الموضوع بدون جى كويرى - هذه المرة على مدونة روتكس فى هذا الدرس التعليمى عن كيفية إصلاح صور العرض المبسط او عرض الصور (Lightbox) التى لا تظهر بشكل مثالى فى المدونة عند الضغط عليها، تعمل اضافة عرض الصور عند استخدام رابط URL الصورة واضافة ارتباط للصورة.

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

لإصلاح معرض صور اللايت بوكس لا تطلب جافاسكريبت او جى كويرى، ببساطة باستخدام اكواد CSS فقط.

يفضل اضافة كود CSS التالى من تحرير القالب وليس من تخصيص القالب او التخطيط حتى تعمل الاضافة.

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


1. اذهب الى لوحة التحكم > القالب > تحرير HTML

2. ابحث عن ]]></b:skin> ، وضع الكود التالي فوقه

/* lightbox image, etc */
.CSS_LIGHTBOX {z-index:99999999!important;}
.CSS_LIGHTBOX_BG_MASK_TRANSPARENT {opacity:.95!important;}
.CSS_LIGHTBOX_SCALED_IMAGE_IMG {width:auto!important;max-width:100%;box-shadow:0 0 10px rgba(0,0,0,0.1);}
.CSS_LIGHTBOX_BTN_CLOSE {background: url('https://4.bp.blogspot.com/-cmZSAe4hgWI/V0K-3C5xiHI/AAAAAAAAG90/2btatUgRsM4qf8HIc7QweuToTkRqRNeuACLcB/s1600/delete.png') no-repeat!important;width:32px!important;height:32px!important;top:30px!important;opacity:0.7;transition:all .3s;}
.CSS_LIGHTBOX_BTN_CLOSE:hover{opacity:1;}
.CSS_LIGHTBOX_BTN_CLOSE_POS {left:10px!important;}
.CSS_LIGHTBOX_BG_MASK{background-color:rgba(0,0,0,0.8)!important}
.CSS_LIGHTBOX_FILMSTRIP{background-color:rgba(0,0,0,0.5)!important}

3. احفظ القالب.

للاطلاع على النتائج، توجه الى معاينة احدى مشاركات مدونتك ثم اضغط على صورة المشاركة، ستظهر لك الصور فى العرض المبسط بشكل رائع وانيق.

انتهى شرح اضافة فتح صورة الموضوع بدون جى كويرى، شكرا لكم على الزيارة.

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

0 تعليقات