Support » Plugin: WP Event Manager » Images become distorted after adding multiple images in event page

  • Hi, the image looks fine when it’s only 1 image. but when I uploaded multiple, they become distorted. what is the solution to this? THanks!

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Ashok Dudhat

    (@ashokdudhat)

    @iamho,

    Thank you for the reporting this bug. Our team is checking this issue.

    Can you please send us screenshot or url so we can see it ?

    Regards

    @ashokdudhat

    Hi thanks for the reply.

    Link 1: https://starryhomestead.com/event/starry-fiesta-hari-raya-event/
    Link 2: https://starryhomestead.com/event/starry-fiesta-hari-raya-event-2/

    Link 1 is the event that is currently on-going so I cloned a page of it and added a few images which is in link 2.

    As you can see, with just 1 image in link 1, the image looks completely fine. But as you can see in link 2, the images look completely distorted when I add more than one image.
    Also, why do the details’ position change when I add more than one image?

    Kindly advise

    Thank you!

    Plugin Author Hitesh Makvana

    (@hiteshmakvana)

    Hi @iamho

    As I can see on your site if you have multiple banner on the the event it will convert in the slider. Your existing theme styling may override the changes. I would suggest you to apply custom css from theme side to fix the issue.
    https://wordpress.org/support/topic/event-banner-size-preferred/

    Also you have made changes in the single event template file from your end which is showing on the class
    class=”wpem-col-xs-12 wpem-col-sm-7 wpem-col-md-8 wpem-single-event-images”

    Thank you

    @hiteshmakvana

    Hi thanks for the reply.

    So all I do is to add this code

    .wpem-single-event-page .wpem-single-event-wrapper .wpem-single-event-header-top .wpem-event-single-image-wrapper .wpem-event-single-image img {
    width: 900px;
    height: 500px;
    }

    Correct? But in where I add the code?

    Thanks!

    Plugin Author Hitesh Makvana

    (@hiteshmakvana)

    Hi @iamho

    Above CSS code you need to add in your admin panel Appearance->Customizer->Add additional css or custom css.

    In your site please add the following css in customizer.
    .wpem-col-xs-12.wpem-col-sm-7.wpem-col-md-8.wpem-single-event-images {
    width: 20%;
    }

    Thank you

    @hiteshmakvana

    Hi,

    I am a little confused here.

    Do I add only

    .wpem-col-xs-12.wpem-col-sm-7.wpem-col-md-8.wpem-single-event-images {
    width: 20%;
    }

    or

    .wpem-single-event-page .wpem-single-event-wrapper .wpem-single-event-header-top .wpem-event-single-image-wrapper .wpem-event-single-image img {
    width: 900px;
    height: 500px;
    }

    too

    in my CSS?

    @hiteshmakvana

    Hi,

    I have added both code into my CSS but the images still look distorted.

    @hiteshmakvana

    Hi,

    The code that you provided,

    .wpem-col-xs-12.wpem-col-sm-7.wpem-col-md-8.wpem-single-event-images {
    width: 20%;
    }

    causes my event page that has only 1 image become distorted. When I remove that code, the single image becomes normal again.

    iamho

    (@iamho)

    Hello, anyone?
    @hiteshmakvana
    @ashokdudhat

    Plugin Author Hitesh Makvana

    (@hiteshmakvana)

    Hi @iamho

    The default plugin css you can override it from your end with expert web designer. Some theme may conflict in the design part. I hope you understand.

    We are trying to improve the theme compatibility. It will be improve in next few updates.

    Thank you

Viewing 10 replies - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.