Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Layout options for Off-Canvas-Menu, Single-Product-Page in Woo and Filter

  • Hi Team,

    i am running in some issues before we want to go live with the webshop. I’d appreciate your help with these topics:

    Unfortunately somehow the image from the Single Product Page is not showing anymore. I didn’t change something there so I can’t reverse back what i did. Also when scrolling down the first part of the product stays sticky. Since i am using the Niche-Template can you help with displaying the image on the Single Product Page again? It happened with all products and i don’t know what i changed :(.

    How can i edit the button with ‘newest articles’ in the Hero-Section on the homepage? We will upload products in the future and i want to filter the 10-20 newest products. I don’t know how to target the link and set a filter behind the button to show that. Could you help with that?

    How could i change the order in the Off-Canvas-Panel so the headline “Categories” is positioned above the second menu with the drop down i created for the Off-Canvas-Menu? https://imgur.com/TokCSkp

    Thanks for your support! 🙂

  • Hi there,

    Can I see the issues on your site?

  • Hi Ying,
    ups, i forgot to post the link, sorry! i post here some screenshots
    1. for example here is one link https://shop.vanderer.be/product/victron-multiplus-omvormer-lader/. The Product page behaves like there is a part sticky. And the image is gone. https://imgur.com/5LMgKb0

    2. It’s about this button in the hero section: https://imgur.com/UuCXVKw

    3. The first part is a second menu i created. https://imgur.com/lXsEiXK I tried to add this menu in the widget area but then it misses the drop down menu which we want to have. When i add it via the widget area it looks like this (without the drop down so the user can’t see the subcategories): https://imgur.com/j2hBxrX

  • Is it possible for you to provide a temporary admin login so we can take a closer look at the backend? It’s quite difficult to identify the issue just by checking from the frontend.

  • Yes, of course, i shared it in the private field. Thanks for checking!

  • There are elements come with the template, you’ve set them to draft, which caused the image not to show.
    https://app.screencast.com/QtIctNz27oIx2

  • For the button, I’m not sure what you mean, are you going to create a static page to display the newest 10 – 20 products? If so, just link the button to that page.

  • Add this CSS to bring the categories headline to top:

    #generate-slideout-menu aside#block-24 {
        order: -1;
    }
  • Thanks, Ying! I really don’t know when i did that. And still the Single Product Page behaves different now.

    I want to change the order on the Single Product Page and set it like it is in the Niche-Theme. I made here some scribbles in this screenshot: https://imgur.com/CU3jO2z Could you help me with that?

    To show the breadcrumbs in one line i have to change the overall width of the container in the customizer, right?

    Is it possible to delete the white space below the image? Is that because in the Niche-theme are always more than one image?

    In the Checkout i added code for the function shipping to another address which i don’t want anymore. I deleted the code and cleared the Cache but it’s not changing. I also tried to target the label but also no change. It should be the same style like 'Een account anmaken'

    #ship-to-different-address {
    	font-size: 16px !important;
    	color: #009FEB;
    } 

    Last not least I tried to buy an article on my actual phone which is not working. the cart not working on mobile. On desktop and with the inspector tool set to mobile it’s fine.
    On mobile I am getting in a kind of loop and not getting through to the cart: https://imgur.com/yIAv8KD

    Thanks for your help!

  • 1. add this CSS:

    .woocommerce div.product form.cart .variations td {
        display: flex;
    }

    2. add this CSS:

    .woocommerce-page div.product div.summary {
        display: flex;
        flex-direction: column;
    }
    
    .woocommerce.single-product div.product div.summary .woocommerce-breadcrumb {
        order: -1;
        margin-right: -80px;
    }

    3. No, spacing under image can not be removed, unless change the entire page’s layout.

    4. Buy function is not from GP, I can not help with that, unfortunately!

  • Hi Ying,
    thanks for your feedback, everything is fine but in #1. one is missing: the button “Add to cart” is not moving beside the ordered amount (like it is in the Niche shop) but stays under the amount. Can you help with that please ?

    And #3 is also missing. Could you please check this code why that’s still showing up styled differently? In the Checkout i added code for the function shipping to another address which i don’t want anymore. I deleted the code and cleared the cache but it’s not changing. I also tried to target the label but also no change. It should be the same style like ‘Een account anmaken’ – here’s a screenshot: https://imgur.com/jjBzLZL.

    #ship-to-different-address {
    	font-size: 16px !important;
    	color: #009FEB;
    } 

    Thank you 🙂

  • 1. add this:

    .woocommerce-variation-add-to-cart {
        flex-wrap: nowrap;
    }

    2. not sure where you were referring to, can you take a bigger screenshot and highlight the section? I’m not very familiar with Woocommerce pages. thanks!

  • Yes, here you go: https://imgur.com/t4amWSN
    Thanks!

  • The CSS isn’t doing anything, it’s an H3 title, so it uses the color you set at cusotmizer > colors > h3, and the font-size is set to inherit by Woocommerce, so it’s using the font-size set for body.

  • What i don’t get is why it’s an H3 title and not a normal Body-tag?

    I added now some CSS to format it a bit and it’s looking okay now.

  • What i don’t get is why it’s an H3 title and not a normal Body-tag?

    It’s set by Woocommerce, I don’t know why either 🙂

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