Home › Forums › WoodMart support forum › Different headers

Different headers

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 20, 2021 at 9:28 pm #268101

    [email protected]
    Participant

    Hi

    First of all, Great Theme, the best in the market. 100%

    I have another question, this time about headers.

    I can choose which header to use in
    – all manually created pages
    – single product pages
    – shop page

    But I need to have different headers for my product categories. Pls give me an advise how do it, even with codes.

    Thank you.

    February 21, 2021 at 4:27 pm #268183

    Elise Noromit
    Member

    Hello,

    Try to add the following PHP code snippet to the child theme functions.php file to do this. Replace ids 10 and 11 with your categories ids and header_576762 with header ids.

    add_filter(
	'woodmart_get_current_header_id',
	function ( $id ) {
		if ( is_product_category() && is_object( get_queried_object() ) ) {
			if ( get_queried_object()->term_id == 10 ) {
				return 'header_576762';
			} elseif ( get_queried_object()->term_id == 11 ) {
				return 'header_496420';
			}
		}
		return $id;
	}
);

    Best Regards

    February 21, 2021 at 4:47 pm #268190

    [email protected]
    Participant

    Where can I find header ID?

    February 21, 2021 at 4:53 pm #268191

    [email protected]
    Participant

    Upd
    I found and the code is working perfect.

    THANK YOU A LOT

    February 21, 2021 at 5:31 pm #268196

    [email protected]
    Participant

    I have another question

    How can I change the background color of first mobile menu item.

    Attachments:
    You must be logged in to view attached files.
    February 22, 2021 at 12:02 am #268247

    Elise Noromit
    Member

    Hello,

    Please use this code and add it to the Theme Settings > Custom CSS > Global:

    .mobile-nav .woodmart-search-form{
background:yellow;
}
body .searchform .searchsubmit {
    color: red;
}
body .mobile-nav-tabs li.active {
    background-color: orange;
    color: red;
}
.mobile-nav-tabs li {
    color: red;
    background-color: olive;
}
body .site-mobile-menu li.current-menu-item>a{
color:blue;
background-color: orange;
}
body .site-mobile-menu li a {
    color: red;
    background:yellow;
}
body .site-mobile-menu li.opener-page>a, 
body .site-mobile-menu li:active>a {
    background-color: orange;
	   color:red;
}
body .site-mobile-menu .icon-sub-menu.up-icon{
    color: red;
    background-color: olive;
}

    Remove the code you do not need to use

    Please set your colors.

    Best Regards

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)