Support » Plugin: Product Catalog » Issues with product image on thumbnail view

  • Resolved malinose

    (@malinose)



    Dear Etoile Web Design Team!

    I tried the solutions you provided in this topic but it unfortunately did not help
    https://wordpress.org/support/topic/center-product-image-2/

    I use Ultimate Product Catalog Plugin along with Ultimate Showcase Theme from you.
    Some Screenshots are attached below

    I have 3 issues:
    1. The image is not centered in the box which looks not so good especially on mobile view

    -> I have tried several approaches with css but the results were unsatisfying (for example the Product title dissapeared or the images were cut)

    2. below the image there is too much blank space which makes scrolling through articles looking bad

    -> How can i remove the blank space below the Product title? I only need Picture and Product Title

    3. There are issues with making the image bigger in the thumbnail view
    -> i already tried the custom styling in the options but it had same issues like in 1.
    i would like to have the images 2-3 times the regular size

    I would be really glad if you guys could give me a hint on how to solve these issues.
    Thanks in andvance for assistance

    mobile view
    http://abload.de/img/upcp_image_001fcutq.png

    normal view
    http://abload.de/img/upcp_image_002oyuqt.png

    Kind regards

    Malinose

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor EtoileWebDesign

    (@etoilewebdesign)

    Hi Malinose,

    Could you please provide a link to your catalog? That way we can inspect it and maybe see where there is a conflict and hopefully suggest some custom CSS.

    For #3, do you have “Thumbnail Support” set to “Yes” (in the “Basic” area of the “Options” tab)? If you set this to “No”, then the full size of your image will be used in all instances. If this isn’t what you mean, could you please clarify what it is you’re trying to do?

    Thank you

    Sorry for the delay,

    and also sorry for the odd link, i just want to keep my site safe
    http://hptest.mode-de-pol.eu/catalogisimovwvuk3xd2oy8/
    password is: upcp4tw!

    Concerning your suggestion on #3
    I have thumbnails activated, but i changed their size to 512×512 (medium 1024×1024, large 2048×2048) and that is approximately the size i need, like 3-4 products in one row and max size in width that is possible

    kind regards,

    malinose

    Plugin Contributor EtoileWebDesign

    (@etoilewebdesign)

    Hi Malinose,

    Thanks for the link!

    I noticed that there’s a style in your theme CSS that’s left aligning all of your images. You should be able to overwrite it with the following custom CSS:

    div.upcp-thumb-image-div img,
    .upcp-tabbed-main-image-inner img,
    img.lg-object.lg-image,
    .upcp-tabbed-addt-img-thumbs img {
    float: none !important;}
    

    To overwrite the box height, you can go to the Styling tab -> Thumbnail and enter in a value (e.g. ‘250’) in ‘Box Min-Height’ under Box Options.

    When you have “Thumbnail Support” enabled, it will use the “Large” version of the image, whatever the dimensions of that might be.

    malinose

    (@malinose)

    Unfortunately this did not solve the problems

    Following issues are still present
    1. The image is not centered when custom size is applied in styling options
    There are issues with making the image bigger in the thumbnail view, i would like to have the images 2-3 times the regular size

    2. below the image there is too much blank space which makes scrolling through articles looking bad
    -> How can i remove the blank space below the Product title? I only need Picture and Product Title
    See red boxes -> http://abload.de/img/upcp_image_001fcutq.png / http://abload.de/img/upcp_image_002oyuqt.png

    malinose

    (@malinose)

    there is no effect on mobile view of the catalogue, images are still small and not centered

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Issues with product image on thumbnail view’ is closed to new replies.