Add to cart moves product page down but BLANK appears

This topic has 12 replies, 2 voices, and was last updated 1 years ago ago by Fantasy Prints

  • Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 2, 2023 at 23:49

    HI there

    I have been trying to set up the POPUP to appear when you add something to the cart but for some reason, nothing happens. Or I thought nothing did but on this site, a gap appears at the top of the product page. I think I have set up something wrong but cannot see what.

    I have two other sites where a GREEN bar appears saying added to cart but this has disappeared on this site. I would prefer the POPUP but cannot see what I am doing for it not to work.

    Please, contact administrator
    for this information.
    11 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 3, 2023 at 11:23

    Hello, Fantasy Prints,

    Thank you for choosing XStore as your WooCommerce WordPress theme.

    This situation happened because the header overlap is activated.
    You may use the next custom CSS code:

    @media only screen and (min-width: 993px) {
      body.single-product .content-page>.woocommerce-notices-wrapper:not(:empty) {
          margin-top: 190px;
      }
      body.single-product .content-page>.woocommerce-notices-wrapper:not(:empty) + .type-product .page-heading {
          padding-top: 0;
      }
    }
    
    @media only screen and (max-width: 992px) {
        body.single-product .content-page>.woocommerce-notices-wrapper:not(:empty) {
          margin-top: 70px;
      }
      body.single-product .content-page>.woocommerce-notices-wrapper:not(:empty) + .type-product .page-heading {
          padding-top: 0;
      }
    }

    We set almost the same padding for the notices wrapper you made for page-heading here → https://prnt.sc/KBI-iJI1UeTT

    Kind Regards,
    8theme team

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 3, 2023 at 11:33

    Thanks as always for speedy reply. Can I ask another question.

    https://misty-uk.com/product-category/themes/halloween/

    On above on MOBILE I am trying to change the BREADCRUMB font sizes but cannot see where this is getting set from. At the moment the H1 Capitalised is at 30px but don’t see any value of this in customizer.

    Also space between top of Breadcrumbs and header and breadcrumbs to Archive is quite a lot of space again looking to see where this is coming from. I saw a PADDING in Breadcrumbs but didn’t seem to effect.

    Paul

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 3, 2023 at 13:20

    Hello, Fantasy Prints,

    Header Builder > disable Header overlap, then settings from Theme Options > Breadcrumbs paddings will work fine. If you do not want to disable the overlap, edit Header overlap > Breadcrumbs Padding (Overlap Only).
    About font-size, please make sure you have set it in px, for example, 16px via Theme Options.

    Kind Regards,
    8theme team

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 3, 2023 at 17:27

    Thanks that fixed most except on Mobile still get big fonts I had not put px and that fixed Desktop but Mobile still has the big gaps and fonts still

    https://misty-uk.com/product-category/themes/halloween/

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 3, 2023 at 18:32

    Also, wonder if you can check the SEARCH ICON at top of MOBILE bar on different browsers this icon comes and goes (rest accounts, etc OK). Not sure what setting that caused this

    Below two shows issue

    https://fpuniformz.com/

    https://fantasyprints.co.uk/

    Thanks as always

    Paul

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 4, 2023 at 09:52

    Hello, Fantasy Prints,

    Thank you for the reply.

    1/ It is because of this custom CSS code – https://prnt.sc/i15ALayb5SFu

    2/ The search icon is here https://prnt.sc/AKhMiy8sa0xh but it seems there is no enough space on the header.
    You may add the next code in Theme Custom CSS > Mobile:

    .et_element.connect-block-element-vfzhX > div, .et_element.connect-block-element-vfzhX > form.cart, .et_element.connect-block-element-vfzhX > .price {
        margin: 0px 5px;
    }
    .mobile-header-wrapper .dgwt-wcas-search-icon path {
        fill:#222;
    }

    then you will get – https://prnt.sc/UXG85cugd-4k

    Kind Regards,
    8theme team

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 4, 2023 at 09:53

    Thanks again for speedy reply. I used one of the your excellent demos I think this CSS must of been part of the design I will amend.

    I will check header space now

    Thanks

    Paul

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 4, 2023 at 10:47

    Hello, Fantasy Prints,

    If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

    Kind Regards,
    8theme team

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 4, 2023 at 11:07

    Added the CSS but Search does seem to move and disappear. I did reduce its size off icon but it still seems to disappear or move to the left as page loads on mobile

    https://fantasyprints.co.uk/ – disappears

    https://misty-uk.com/ – moves to left

    https://fpuniformz.com/ – disappears

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 4, 2023 at 12:26

    Hello, Fantasy Prints,

    Thank you for your response.

    Please change the code to:

    .et_element.connect-block-element-vfzhX > div, .et_element.connect-block-element-vfzhX > form.cart {
        margin: 0px 5px !important;
    }
    .mobile-header-wrapper .dgwt-wcas-search-icon path {
        fill:#222 !important;
    }

    on https://fantasyprints.co.uk/

    This is not a universal code. You are using a 3rd party plugin for the search, so we would recommend you contact support team of the plugin to get help for all sites with it.

    Kind Regards,
    8theme team

    Avatar: Fantasy Prints
    Fantasy Prints
    Participant
    May 4, 2023 at 12:39

    Sorry you are right I forgot about that. it says it was compatible with theme. But your new CSS seems to have fixed.

    Sorry to have bothered you

    Paul

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

The issue related to '‘Add to cart moves product page down but BLANK appears’' has been successfully resolved, and the topic is now closed for further responses

Helpful Topics

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