طريقة ضبط حجم الصور تلقائيا لمدونات بلوجر -

طريقة ضبط حجم الصور تلقائيا لمدونات بلوجر -

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

















1- نذهب الي تصميم .ثم تحرير html

2- نبحث عن الجملة التالية

]]></b:skin>

..ثم نضع الكود التالي فوق الجملة التي بحثت عنها ..

.post img {

max-width:500px;

max-height:500px;

min-width:200px;

min-height:200px;

padding : 10px;

clear: both;

}

3- max-width:500px يعني اقصي عرض للصوره يساوي 500px غيرها حسب عرض مساحة المقالات..

max-height:500px يعني اقصي طول للصوره 500px غيرها كما تحب..

min-width:200px يعني اقل عرض للصوره

min-height:200px يعني اقل طول للصوره

كدة انتهينا من وضع الكود انهي عملك واضغط حفظ واتوكل علي الله وشوف النتيجة علي الصور

في بعض المدونات في التصميم او الصور تريد وضع جميع الصور بحجم واحد بمعني انهم لا يريدون اقصي عرض واقصي ارتفاع للصوره واقل عرض واقل ارتفاع ..

بمعني ان جميع الصور طول وارتفاع واحد بدون نسبه وتناسب او عمل حساب لاصل الصوره ..

......فانه يجب وضع الكود التالي بدلا من الكود العلوي..








.post img {
width:500px;
height:400px;
padding:10px;
}







أظن ان هذا الكود ليس مهما فقط للمعرفة او لمن اراد ذلك

يعني العرض 500 للصوره لا يمكن لاي صوره ان تقل عن 500 في المشاركات

والطول 400 للصوره ايضا كل الصور طولها 400 فقط بدون نسبه وتناسب

طريقة أخرى ..

كل ما عليك هو البحث عن الوسم ]]></b:skin>
وقبله ضع هذا الكود

.post img {
min-width:560px;
max-width:560px;
max-height:260px;
min-height:260px;
}

يمكنك تغيير المقاسات بما يناسبك هناك إتنين min وهو اصغر مقاس و max هو أكبر مقاس
غيرها بما يتناسب مع قالبك
وهناك طريقة لتحديد مقاس الصور عند وضعها في بعض الإضافات مثل هذا المثال

<img alt='تشغيل نسخة الهاتف' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj91XM_9Jw4QusjjsLj6X83wBAnTKhCwoRPW8rZ2n6sy92oG8_K5lWkrGhiEvXeFQ8x8GiVnBJwREN_dLaGaKzKY2hyphenhyphensUIM_diEUG8pwIxoeitMt8wVxdgFMM_Zg1p_PDBtQkbw5nSJP2I/s1600/Mobile+version+for+blogger.png" width="300" border="0" height="83" />