به هم ریختن تصویر محصول در وردپرس با تغییر اندازه تصویر در ووکامرس

[فترمه]

دوستان و عزیزان وردپرس کار اگه لطف کنید و به لینک زیز نگاه کنید:
http://www.orkami.com/product/عسل-اکالیپتوس-گلبهار/

می بینید که تصویر محصول به درستی نشون داده نمیشه یعنی اینکه در سمت چپ تنظیم نمیشه و اگه موس رو به سمت چپ تصویر اصلی ببرید می بینید که قابل کلیک کردن هست (یه فضای خالی). این مشکل وقتی اندازه مرورگر را تغییر میدم و کوچیک میکنم توی برخی از حالاتش همچنان هست ولی توی برخی حالات نیست!
قالب این سایت canvas هست که من خودم فارسیش کردم.
یکی از تغییرات دیگه ای که ایجاد کردم اینه که در ووکامرس بخش Settings -> Products -> Display -> Product Images اندازه ها را به ترتیب گذاشتم: 250X300 - 375X450 - 150X180 یعنی در واقع از اون حالت پیش فرض خودش که تصاویر مربعی هستند من به مستطیلی تغییر دادم.
نمیدونم آیا مشکل از اینجاست یا جای دیگه!
به نظر شما مشکل از کجاست؟ کار زیادی میبره که درستش کنم و راه پیدا کردن مشکل اصلی چطوریه؟
در ضمن من یه کمی با فایلهای css ور رفتم ولی درست نشد!

 

[فترمه]

دوستان عزیز وردپرس کار یه کمی فعالتر باشید لطفا!

 

[mohsenmusic]

این کد سی اس اس رو به انتهای استایل css اصلی قالبت اضافه کن انشاالله حل میشه
اگه کمی تغییر کرد میتونی درصد width:42% رو کم و زیاد کنی

.woocommerce .images {
  float: left;
  margin-right: 3.8%;
  width: 42% !important;
}

​

 

[farsvideo]

سلام. اگر میخواید که قابل کلیک نباشه باید مسیرش رو پیدا کنید. فکنم دیو با کلاس images باشه. دیو رو ویرایش کنید و قسمت href به بعد رو بردارید

 

[فترمه]

این کد سی اس اس رو به انتهای استایل css اصلی قالبت اضافه کن انشاالله حل میشه
اگه کمی تغییر کرد میتونی درصد width:42% رو کم و زیاد کنی

دوست عزیز خیلی ممنون از راهنمایی شما، من سه خطی را که گفته بودین به فایل woocomerce.css که در زیر شاخه قالب بود اضافه کردم و بصورت زیر در اومد:

.woocommerce .images {
float: left;
width: 42% !important;
margin-right: 3.8%;
  margin-bottom: 1.5em; }
  .woocommerce .images img {
  width: auto;
  height: auto; }
  .woocommerce .images a {
  display: block;
  margin-bottom: .5em; }
  .woocommerce .images .thumbnails {
  overflow: hidden;
  zoom: 1; }
  .woocommerce .images .thumbnails a {
  float: left;
  width: 30.75%;
  margin-right: 3.8%; }
  .woocommerce .images .thumbnails a.last {
  margin-right: 0; }
  .woocommerce .images .thumbnails a.first {
  clear: both; }

و مشکل حل شد.
خیلی خیلی ممنون از شما.
البته ظاهرا وقتی عرض صفحه کم باشه یا اینکه عرض مرورگر رو کم بکنیم یه مشکلاتی در نمایش محصول و عکسها بوجود میاد و مثلا گاهی نمیشه بری روی اون عکسهای کوچک محصول (thumbnails)! نمیدونم نیاز به تغییر دیگه ای هست یا نه؟

یه مشکل دیگه هم شبیه همین مشکلی که شما لطف کردی و راهنمایی کردین در صفحه فروشگاه وجود داره (http://www.orkami.net/فروشگاه/) و اون هم اینه که وقتی عرض مرورگر رو کم میکنیم تا حدی که میرسه به نقطه ای که در هر ردیف فقط 2 محصول نمایش داده میشه، دوباره همین مشکل بوجود میاد و سمت راست تصویر محصول خالی میشه، میشه بگید برای این مشکل چه تغییری باید در css داد؟

 

[mohsenmusic]

لینک باز نشد

 

[فترمه]

لینک باز نشد

اوه اوه! واقعا ببخشید. من آدرس سایت محلی رو گذاشتم که دامنه اش .net هست!
آدرس درست اینه: http://www.orkami.com/فروشگاه

پیشاپیش از شما سپاسگزارم.