Problems editing Woocommerce cart in Elementor – Misaligned

This topic has 15 replies, 3 voices, and was last updated 2 years, 7 months ago ago by Olga Barlow

  • Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 13, 2022 at 21:09

    Hello. I’m trying to edit my Woocommerce cart page with Elementor, but I can’t because it’s getting completely misaligned.

    Even though the page is set to full width, the content is limited to half the space, whether I put it in just one or two columns.

    Look:

    Full width element enabled: https://prnt.sc/CXM9aLiQtdOs

    An activated column, the result is this: https://prnt.sc/CamD4mpbToHV

    Two columns enabled, the result is this: https://prnt.sc/jyrhHxQTOUbO

    I await support. Thanks.

    Please, contact administrator
    for this information.
    14 Answers
    Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 14, 2022 at 00:23

    Update: The same issue is happening on the checkout page. (Content is squeezed into a part of the screen)

    See: https://prnt.sc/X86u-zJy8tq9

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    April 14, 2022 at 10:16

    Hello,

    Cart, and checkout pages are customized in our theme. So, That could be the reason. Provide us with FTP access to your site. We’ll check the issue in more detail.

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 14, 2022 at 19:12

    Customizing the cart and checkout pages directly from the customize panel is quite limited. The FTP access data follows.

    Please contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 15, 2022 at 14:56

    Hello,

    We have added next custom css in Theme Options -> Theme Custom CSS -> Global CSS on your site
    .elementor-widget-woocommerce-cart [class=col-md], .elementor-widget-woocommerce-cart .row,
    .elementor-widget-woocommerce-checkout-page [class=col-md], .elementor-widget-woocommerce-checkout-page .row{
    width: 100%;
    padding: 0;
    margin: 0;
    float: none;
    }
    if it suits to your wishes then we can add next css globally in next update
    otherwise if it does not make what you expect then we have to rewrite few files for you in your child-theme/ because it is not possible to make everything compatible with everything but anytime we can try to :). Thanks for understanding !

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 19, 2022 at 15:29

    Hello. The changes made have greatly improved the cart and checkout pages. I would just need these more fixes:

    1) Make the content more aligned to the center on the checkout page;

    2) There is duplication of the promotional code field on the cart page, I would like it to be just one (See: https://prnt.sc/OCgQF6fIpGoN);

    3) I need to know how to translate the sessions to my language (Portuguese-BR), since there is no option to do it directly from the panel (I didn’t find it, at least). Examples: https://prnt.sc/zvro8i2hiPPS | https://prnt.sc/0plKMCwtSlVt

    Thanks again for your attention.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    April 21, 2022 at 15:13

    Hello,

    1) I made that in 2 columns. Is that ok for you? Or do you want 1 full-width column?

    2) Done.

    3) Go to Loco translate > Themes / Plugins > finish translation XStore theme / Xstore core plugin.

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 28, 2022 at 21:27

    Hello. I would like some more changes to be made:

    1) I would like the cart and checkout pages to have only 1 column, since in the mobile version the content is difficult to view in two. (The cart page is already with only 1 column). You can leave it in just 1 column for desktop and mobile versions.

    2) After the previous changes were made, the cart is showing a bug. When clicking to add a product, on the individual product page, the cart opens, but the added product does not appear in the cart’s products list.

    The message appears that the product has been added, the payment amount is correct, but the product itself does not appear in the list.

    Example: https://prnt.sc/IfvPxLNtYsEt

    Thank you in advance for your attention and availability.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 30, 2022 at 08:57

    Hello,

    One of our technicians will give an answer after the weekend. Please be patient

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    April 30, 2022 at 18:27

    Awaiting.

    Thanks.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    May 2, 2022 at 17:36

    Hello,

    Check now, please.

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    May 3, 2022 at 13:34

    Hello.

    The problem with the product added to the cart has been resolved, thank you. However, the checkout page is still split into two columns for desktop and tablet, leaving one column for mobile only. But I note that it would be better if it was in a single column for all devices, because the area to add card data has become too narrow. Could you see this for me, please?

    Thanks.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    May 3, 2022 at 22:59

    Hello,

    Check now, please.

    Regards

    Avatar: Recurso Apto
    Recurso Apto
    Participant
    May 5, 2022 at 15:18

    Hello. Thanks for the changes. But I need help with two more problems on the Checkout page:

    1) Some fields are in English, and by the Loco Translate plugin they appear as being translated into Brazilian Portuguese, although in practice they remain in English. I need to translate them into my Portuguese language (BR).
    See: https://prnt.sc/q381BxjpoJUq
    I don’t know if this translation is done in the theme folder or in the WooCommerce plugin folder.

    2) I would like to remove a field from the Checkout page. The space to put promotional code. Since there is already a space on the cart page, I just want to leave it there. Also because it is also in English and I can’t translate it. So I choose to delete it.
    See: https://prnt.sc/CjguSFhdPM3g

    Thanks again for your attention. Awaiting.

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    May 5, 2022 at 22:05

    Hello,

    1) I see some issue with the saving of the WooCommerce plugin translation https://prnt.sc/uST7AJGmB40b So, contact your hosting provider and ask to fix the issue with the permissions to allow you to Sync translation and save your changes.

    2) Add the below code if you want to hide that

    .checkout .cart-order-details .e-coupon-box {
        display: none !important;
    }

    Regards

  • Viewing 15 results - 1 through 15 (of 15 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.