Product Card Layout Styling (Example Included)

This topic has 3 replies, 2 voices, and was last updated 2 days, 9 hours ago ago by Jack Richardson

  • Avatar: jepesat
    jepesat
    Participant
    December 10, 2025 at 06:31

    Dear XStore Support Team,

    I hope you are doing well.

    We are currently experiencing difficulties styling the product cards (shop grid items) in the XStore theme. Despite reviewing the documentation and trying all available options, we are unable to create the clean and professional layout we want.

    We kindly request your assistance.

    🔧 The Issue

    We want to create a uniform, modern, and clean product card layout on the shop and category pages.

    However:

    Product images appear inconsistent

    Cards have uneven heights

    Text and price alignment is not uniform

    Buttons do not match the desired style

    Some styling options mentioned in your documentation do not appear in our installation

    Because of these limitations, we cannot achieve the layout quality we need for our webshop.

    🔍 What We Have Already Tried

    We have checked:

    Customizer → WooCommerce → Product Catalog

    Customizer → XStore → WooCommerce (Shop)

    Thumbnail regeneration

    Elementor widgets

    All XStore shop layout and product styling options

    Despite this, we still cannot create a clean and consistent product card layout.

    🎯 What We Want to Achieve

    To help clarify our goal, here is an example:

    ⭐ Example of Product Card Style We Aim For

    We would like product cards similar in quality and structure to the cards used on Electrosat (example shop).
    Their cards are:

    Clean

    Consistent in height

    Have centered images

    Show title, price, and buttons in a clear hierarchy

    Look professional and balanced

    We are not trying to copy their exact design, but we want to achieve a similar level of visual structure, spacing, and quality in our XStore shop.

    ❓ We Need Clarification On

    Where exactly in XStore we can control the product card layout

    Whether XStore has a built-in visual editor for product cards

    If certain layout options may be missing in our installation

    Whether we should use a specific preset to achieve a modern card design

    Whether you can assist us by checking our configuration

    If needed, we can provide temporary admin access

    📦 Additional Information

    Products are imported via CSV from our wholesaler.
    The data imports correctly, but image proportions differ.
    We need the theme to auto-crop or structure the grid cleanly so the shop looks professional.

    At the moment, we are stuck and cannot continue building the webshop until the product card layout is resolved.

    We kindly ask for your guidance or a solution.
    Thank you very much for your time and support.

    Kind regards,
    Peter Jonker
    Jepesat.nl

    2 Answers
    Avatar: jepesat
    jepesat
    Participant
    December 10, 2025 at 06:35

    Product Card Layout Styling

    Files is visible for topic creator and
    support staff only.
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    December 10, 2025 at 07:22

    Hello @jepesat,

    Thank you for clarifying your request. Could you please provide us with a live example of what you have already implemented? Even with the basic styling of our Archive Products or Products Grid widget, you can achieve approximately 70% of the required design. The only additional configuration needed is related to typography settings of items, which are available in these widgets: https://prnt.sc/vbo_M4HmHg4j.

    You can also set equal heights by simply activating the following option: https://prnt.sc/wF3TeGGBtkg5. Additionally, there are settings to adjust the internal spacing of the product: https://prnt.sc/1V9k_e91CoTo. You can also define the image size here: https://prnt.sc/PkrDVu0FGxfy.

    We kindly ask you to implement the options you prefer and provide us with a live URL so that we can review it and offer further suggestions if necessary. In our opinion, most aspects of your desired product layout can be achieved using the current available settings.

    Please note that additional customization is beyond the scope of our basic support, but we can provide guidance on how to create the layout if such settings are available within the widgets.

    Best regards,
    Jack Richardson
    The 8Theme’s Team

  • Viewing 3 results - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.