Hi,
1. You can get a feature to change header top link color in Premium version of the Zakra as instructed here https://docs.zakratheme.com/en/article/header-top-bar-overview-pro-40xyxb/. Otherwise, you can simply add this CSS:
.tg-site-header-top a {
color: #ccc;
}
2. Please create a child theme and override function to show the cart icon only when the cart has items. This article might help you with this: https://www.skyverge.com/blog/check-if-woocommerce-cart-is-empty/
3. Can you please provide the site URL and explain it more clearly?
Thanks.
Thread Starter
blue5
(@blue5)
Okay, thanks. Regarding #3; when I include “my account” or “checkout” in the top bar, it doesn’t show up on the mobile menu after clicking the menu icon (only on the desktop version). It appears the mobile menu list only includes the main navigation menu. I hope this is clear and you can help me to fix this. This is probably the main issue I have with your theme, otherwise almost everything else can be adjusted through css.
Can you please provide the site URL?
Thread Starter
blue5
(@blue5)
Hi, I don’t want to provide the site URL in public (plus it’s still under construction). Please check the following image links along with the included description for more clarification;
View post on imgur.com
View post on imgur.com
View post on imgur.com
The header top bar menu is not included in the Mobile menu as Mobile menu is for the Primary Menu only. So, if you want to show the header top bar menu in mobile devices, please add this custom CSS:
@media screen and (max-width: 600px) {
.tg-site-header-top {
display: block;
}
}
Thanks.
Thread Starter
blue5
(@blue5)
Thanks. I have already done this, but there is an issue. The mobile top bar becomes disorganized this way. I want to remove the right content (My Account and Checkout links) from the top bar and add them in the menu. Is there a way to do this?
In that case, you need to add those links on the Primary Menu (not in the top bar). Or, you can create a child theme and write a JS to append the header top bar menu items to mobile menu. https://themegrill.com/blog/tutorial-creating-wordpress-child-theme/
Thanks.
Thread Starter
blue5
(@blue5)
Thanks, can you provide the code needed to append the header top bar menu items to mobile menu (I already have a child theme)?
Please add the following code inside the JavaScript file of the child theme.
https://pastebin.com/nNpst1Bk
Thread Starter
blue5
(@blue5)
Okay, thank you, but it’s not working. I’m not sure why. What I did is this:
1) I created a new js file (named “append-topbar-menu-to-mobile”) inside a new js folder in the child theme, then included the code you provided inside the file.
2) I added the following code inside the functions.php file of the child theme to execute the javascript;
function menu_enqueue_scripts() {
wp_enqueue_script( ‘append-topbar-menu-to-mobile’, get_stylesheet_directory_uri() . ‘/js/append-topbar-menu-to-mobile’, array(), false, true );
}
add_action( ‘wp_enqueue_scripts’, ‘menu_enqueue_scripts’ );
Thread Starter
blue5
(@blue5)
I was able to solve the problem, thank you for your help.
Thread Starter
blue5
(@blue5)
After double checking, it seems there is another problem; the topbar right content (“My Account” and “Checkout”) disappear completely on desktop and tablet view. Is there a way to apply the java-script you provided to mobile only?
