A few customization questions… Help?

Hey there, i emailed you before about my purchased basel theme, i went ahead and bought woodmart again because it had a feature i needed that basel didn’t.

First off, I love your theme. Yours is definitely the best theme on the market.
I do have quite the number of questions though.
**take your time 🙂

1. Can you provide me with the css code to edit the font-size and font-family of the (Add to wishlist & Compare) link buttons below the add to cart button?

2. On the shop pages, how can i align all the product titles and prices to the left like basel? I also like that they were underlined too… Can you help me out with that too.

3. On woodmart’s – handmade – demo theme, i noticed that once you sign up. The header doesn’t just say ‘My account’ … It says something personalized – in my case it said Hello, Nyabera —- How can i replicate this feature on my site?

4. I also liked the underline on the text that covered the (my account, lost your password and track order) pages… Can you help me underline it there too.

5. On the account dashboard… If you don’t have any orders or downloads… The text says something in the line of ‘No downloads/orders available yet’ there’s also a link that says ‘GO SHOP’ can you help me remove that. The ‘GO SHOP’

6. On the collapsible cart (not the actual page the one that opens up ) how can i edit the font-size and family of the ‘Shopping Cart’ text that is on top there?

7. On the shop page can you also tell me where i can edit the text that says ‘SHOW SIDEBAR’

8. On the My Account page / Account details section – there’s this text ‘This will be how your name will be displayed in the account section and in reviews‘ how can i edit this? I’d like to make it smaller and add some color.

9. Same for the reviews section of the product page… I’d like to edit the texts there too – make them smaller and colored

10. Back to the product tab… I noticed that the description tab is always opened on mobile by default… Can you provide me with the code to keep it closed.

11. Also can you provide me with the CSS code to change the font-family of the Mobile navigation bar (mobile menu)

12 ***How can i edit the cart page? I’d like to add a field? Or is that up to woocommerce?

Sorry for all the questions but i studied the forum before this and helped myself wherever i could.
I’d love the help.
Take your time and Regards.

I almost forgot… Last question… I really like the product hovers on Basel… The minimal add to wishlist, quick view and compare layout… Is that possible with woodmart? I was thinking maybe getting rid of the white background behind the quick add to wishlist?

Hi,

1. You need to add this code to the Theme Settings > Custom CSS:

.summary-inner>.yith-wcwl-add-to-wishlist a {
   font-size: 14px;
    font-family: lato,Arial,Helvetica,sans-serif;
    text-decoration:underline;
}
.compare-btn-wrapper a {
   font-size: 14px;
    font-family: lato,Arial,Helvetica,sans-serif;
    text-decoration:underline;
}

2.

.product-grid-item .product-title, .product-title{
text-align:left;
}
.product-grid-item .price {
   text-align: left;
}

3. Navigate to Woodmart > Header builder http://prntscr.com/iyd2pe

Choose the proper header type (your current) http://prntscr.com/iyd333

Configure this in Account element http://prntscr.com/kt967v

4. Do you mean pages in My Account page? If so here is the code:

.woocommerce-MyAccount-navigation ul li a {
    text-decoration:underline;
}

5. Here is the code:

.woocommerce-Button{
 text-decoration:underline;
}

6. Add styles to this code:

.widget_shopping_cart .mini_cart_item a {
   margin-bottom: 0;
}

7 Here is the code:

.woodmart-show-sidebar-btn {
   font-size: 14px;
    color:#000000;
    }

You can translate all theme and plugin texts via PO file in WordPress. Here is a video tutorial that should help you translate your website texts with a Loco Translate plugin https://www.youtube.com/watch?v=D3NsDdMzsls&list=PLMw6W4rAaOgKKv0oexGHzpWBg1imvrval&index=3

8 Here is the code:

.woocommerce-MyAccount-content p span em{
   font-size: 14px;
    color:#000000;
}

9. Here is the code:

.description{
   font-size: 14px;
    color:#000000;
}

10. Sorry, but it is not possible to do this in WooCommerce.

11

.site-mobile-menu li.opener-page>a, .site-mobile-menu li:active>a, .site-mobile-menu li:focus>a{
   font-size: 14px;
    color:#000000;
}

12. You will need to find a plugin or customize Woocommerce.

13. You can find all available hover styles for products in Dashboard -> Theme Settings -> Shop.

Regards

Hey Artem… Do you mind checking the questions again? Especially questions 4, 5, 6, 7, 9 & 11 ? They seem super off.

Thanks again – The others worked okay 🙂

Hello,

Checking the code:

#4 http://prntscr.com/kud5sp

#5

.woocommerce-Button{
display:none;
}

#6. Add the styles to the code:

.product_list_widget>li .product-title {
    font-size: 16px;
}

and

.widget_shopping_cart .quantity {
    color: #bbb;
    font-size: 13px;
    display: block;
}

and

.widget_shopping_cart .quantity .woocommerce-Price-amount {
    color: red;
    font-size: 17px;
    display: block;
}

#7

.woodmart-show-sidebar-btn span:not(.woodmart-side-bar-icon) {
    vertical-align: middle;
    font-size: 30px;
}

#9 code is workable, set the font-size as per your needs:

.description{
   font-size: 14px;
    color:#000000;
}

#11 Add the styles as per your needs:

.site-mobile-menu li a span{
   font-size: 30px;
    color:#000000;
}
.site-mobile-menu .menu-item-wishlist .wishlist-info-wrap .wishlist-label {
   font-size: 30px;
    color:#000000;
}
.site-mobile-menu li a {
       font-size: 30px;
    color:#000000;
    
}

Best Regards

Hey Elise, they all worked perfectly. You’re awesome.

I checked out the hover styles as you mentioned,,, Is there css code to remove the hover styles completely.

Also on the mobile navbar is there a way to remove the icons on wishlist and log in/register (photo attached)

Lastly to create the two-column mobile menu like on your demo (photo attached)

Again Thank you for you help. Kind regards 🙂

Attachments:

You must be logged in to view attached files.

Hello,

In order to remove hover styles you need duplicate the same styles to both :link and :hover.

Here is the code to hide icons whishlist and My account

.menu-item-wishlist .woodmart-wishlist-info-widget .wishlist-icon{
display:none!important;
}
.menu-item-my-account a:before{
display:none!important;
}

As for mobile menu. Navigate to Header builder, switch to the mobile view and add the category menu into the mobile menu element.

Best Regards

Hey Elise i added the code and the login button disappeared 🙁

Hello,

Please provide your site admin access.

Best Regards

Hey Elise…it’s just betaversion101.thefindclub.com (for testing purposes)

i’m planning on transferring it to thefindclub.com in a month. So maybe you can alert me as to how you did it so iwon’t have to bother you later.

Hello,

I have added the code and icons have gone, which button has disappeared?

http://prntscr.com/kwkl65

I see the option for log in https://gyazo.com/28d32c67a5caf4e2c431437ee726b96c

Best Regards

Hey Elise that’s weird it doesn’t show on my end… Maybe it’s on mobile only? Here.. I’ll attach a photo

Attachments:

You must be logged in to view attached files.

Hello,

Please clear your cache. I have checked in other browsers it works.

Best Regards

Hey Elise… My bad i placed this code

`.woocommerce-Button{
display:none;
}

inside ‘Custom CSS for mobile’ that’s why it didn’t work. Apologies

So, have you solved the issue?

I have 🙂 Thanks so much

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts