Woocommerce Cart in Widget

Sorry, another quick question while I have you. I need to move the Hero Content on the Home page Banner up, but if I use the Padding it makes the actual banner image bigger. How do I just move the 'Hero Content' up.

Hi there,

this was the solution i proposed:

https://generatepress.com/forums/topic/prime-theme-banner-image-and-search/#post-1301745

Have you tested this ? Maybe create a staging site where you can make those changes and we can take a look.

Question 2 - you have 34% top padding and 0 bottom padding. split the padding between both planes e.g 17% top and 17% bottom will vertically center the content.
If you need any more help on this - open a new topic, it will make it easier for you and others to find in the future.

Hey David,
I seem to have fixed the banner issue, thanks to your advice David. I may need to open another ticket however to discuss it's responsiveness.

Anyway, weird things are happening with this cart still.
I followed your instructions and a cart is now appearing. However it only floats left?

If I follow step 3. Customizer > Layout > Secondary Navigation –> Set location to Float Right, it floats left. Interestingly if I change it to Float Left, it floats right in the Customizer, but actually still floats left on the front end?

Also, am I able to add the text 'Cart' into that box next to the basket icon and make both icon and text bigger?

Thanks

Hi there,

Try adding this CSS:

.secondary-nav-float-right .secondary-navigation {
    order: 5;
}

As for the Cart text, would you want it to show up before or after the number of items/amount?

Hi Tom,
Thanks, that worked perfectly.
I am thinking the text should be to the left. It would also be nice if the cart icon could be bigger too, even if I have to use a different icon to achieve this. If the cart icon size is too hard though, I can probably live with it.

Is there anything I can do to change the way the cart displays responsively too? Not having the three lines on that Cart Menu would be an improvement I think. Maybe only showing the icon would be best for Mobile?

I will probably submit a different ticket anyway, as most of the widgets are not working responsively. However if i can get the cart bit looking better, that will be a start.

The icon and text size will use the font size set in Customizer > Typography > Secondary Navigation.

Try this CSS to switch the icon and text:

.secondary-navigation a.cart-contents:not(.has-svg-icon).shopping-basket:before {
    display: none;
}

.secondary-navigation a.cart-contents:not(.has-svg-icon).shopping-basket:after {
    content: "\f291";
    display: inline-block;
    font-family: "GP Premium";
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing:grayscale;
    margin-left: 0.5em;
}

This doc explains how to stop the mobile menu on secondary nav:

https://docs.generatepress.com/article/disable-secondary-navigation-mobile-menu/

Thanks David,

I messed around with switching the icon to the right and decided against.
The link to the Mobile Menu bar removal worked perfectly.

Thanks again.

Glad we could be of help