|
واجهتنا مشكلتى خروج الصور كبيرة الحجم وكذلك خروج نص الأكواد فى صندوق الاقتباس عن إطار الصفحة. بالنسبة لأول مشكلة فهى شائعة والحل منتشر علي صفحات الانترنت على عكس الثانية وسنشرح حل المشكلتين معا, وليكون الموضوع دسما سنعرض أنواعا من أشكال صندوق الاقتباس لجعله بصورة أفضل من صورته العادية.
أولا: ضبط حجم الصور عن طريق وضع مقاسات تقييد خروجها عن إطار الصفحة. اتبع الخطوات التالية:
1- قم بالدخول الى لوحة التحكم ثم القالب ثم تعديل القالب Template > Edit HTML
2- اضغط Ctrl + F وقم بالبحث عن الكود التالي
]]></b:skin>
3- ضع فوقه الكود التالي
.post img {
max-width:500px;
max-height:500px;
padding : 10px;
clear: both;
}
لاحظ أن الملون بالأحمر هو أقصي أرتفاع وعرض للصورة التى يتم نشرها داخل الموضوع ويمكنك التحكم حسب صفحة الموضوع داخل قالب مدونتك.
ثانيا: ضبط عرض الأكواد داخل صندوق الاقتباس وتقييد خروجها عن إطار الصفحة. اتبع الخطوات التالية:
1- قم بالدخول الى لوحة التحكم ثم القالب ثم تعديل القالب Template > Edit HTML
2- اضغط Ctrl + F وقم بالبحث عن Post Blockquote
3- قم بتعديل الكود أسفل منه علي الصورة التالية (صندوق الاقتباس سيكون بإطار أسود رفيع) يمكنك تغيير لون الإطار بتغيير الكود الملون بالأحمر للكود الذي يناسب مدونتك.
/*- Post Blockquote -*/
blockquote {
margin:1em 20px;
border: 1px solid #000000;
padding: 5px;
}
 |
| شكل الكود بعد اضافته فى مكانه الصحيح - اضغط على الصورة لتكبيرها |
هنا صورة أخري للتعديل علي شكل صندوق الاقتباس (سيكون بإطار نقطي أحمر سميك بخلفية بيضاء) يمكنك تغيير لون الإطار والخلفية بتغيير الكود الملون بالأحمر للكود الذي يناسب مدونتك.
/*- Post Blockquote -*/
.post blockquote {
background:#ffffff;
margin:1em 20px;
border: 3px dotted #ff0000;
padding: 10px;
overflow:hidden;
}
 |
| هذه معاينة للمثال السابق - اضغط على الصورة لتكبيرها |
هنا صور أخري للتعديل بحيث يكون عبارة عن خلفية مظللة فقط ويمكن تغيير لونها بما يناسب مدونتك.
/*- Post Blockquote -*/
.post blockquote {
margin:1em 20px; background: #cccccc;
}
أى سؤال لا تتردد فى طرحه فدائما نحن بخدمتك على قدر المستطاع. :)
بقلم mohammed glal
مهندس مصري ومتابع جيد للأخبار والمستجدات التقنية والاعلام الاجتماعى ومهتم بالاعلان عن الشركات الناشئة عبر مدونته الشخصية (مدونة راصد تقني), كاتب سابق على مدونة عالم الإبداع ومشرف سابق فى موقع نقطة التطوير ومنتدى الديوان -تم اغلاقه-. أحب القراءة والترجمة للمستجدات التقنية والتكنولوجية. المالك الحالي لمدونة أبو إياد.
| روابط هذه التدوينة قابلة للنسخ واللصق | |
| URL | |
| HTML | |
| BBCode | |
تنبيه : المرجوا عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا
2 تعليقات :
شراك شرح رائع
بمدونتي لايوجد هذه Post Blockquote
انا قمت بوضع الكود اول واحد لتظبي الكتابة والصور والان اختلف شكل الصور واصبحت تظهر عن الاطار فماذا افعل
@Nour aldeen alzaim
شكرا لك .. ابحث عن blockquote
ومنتظر ردك :)