اذهب إلى المحتوى
  • 0

كيف أقوم بتحجيم صورة المقال في ووردبريس بحيث يظهر كامل الصورة في الصورة المصغرة؟

محب روفائيل

السؤال

ﻷن تصغير الصورة بهذه الطريقة:

img {height: 200px; width: 300px;}

لن يحجم الصورة كاملة بل سيقص منها جزء معين ويظهره، رجاء أخوتي المساعدة ضروري :) شكرا مسبقا :)

رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 1

محب، كملاحظة مبدئية: التنسيق المذكور في سؤالك سؤدي إلى تغيير مقاسات جميع الصور الموجودة داخل موقعك، وذلك لأنك لم تحدد أي صورة تريد تغيير مقاساتها :

img {height: 200px; width: 300px;}

أي أن عليك تحديد تعيرف Id أو  كلاس class المُحددة للصورة -أو الصور- المراد تغيير مقاساتها.

على نظام إدارة المحتوى ووردبريس، وكأي نظام آخر يتحكم ملف التنسيق css في مقاسات وخصائص الوسوم الموجودة على ملف html.

يوفر ووردبريس إمكانية تحديد مقاس الصور قبل إدراجها في الموقع وذلك من خلال إضافة Media من خلال لوحة التحكم:

cap01.PNG

أيضا يمكن تحديد مقاس الصورة من خلال أربع مقاسات معيارية محددة مسبقا : 

  • Thumbnail
  • Medium
  • Large
  • Full Size

cap02.PNG

يمكنك استخراج اسم صورة واستعماله لتحديد تنسيقها الخاص بها فقط، من خلال لوحة التحكم عن طريق Advanced Image Settings:

cap03.PNG

واستخدام ملف التنسيق css لذلك:

aligncenter size-medium wp-image-65

 

.wp-image-65 {
width: 100px;
height: 150px;
box-shadow: 0px 0px 20px #000000;
-webkit-box-shadow: 0px 0px 20px #000000;
-moz-box-shadow: 0px 0px 20px #000000;
}
رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

تقصد أخي الصورة المصغرة التي تعرض مثلا في الصفحة الرئيسية بجانب كل مقال؟

هي بشكل افتراضي تكون عينة لكامل الصورة بأحجام صغيرة؟

أرجوا التوضيح

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...