Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 21, 2021 at 3:00 am #1321699
    navindesigns

    Hi,
    On my site, I have done some custom CSS to make the my logo in the middle of my navigation items (2 on the left and 2 on the right of the logo)
    It works great except for one small issue. If I hover over or click the left of the “Research” menu item, it is still pointing to the logo url and not the Research url. The right hand side of the word is correct not the left side of it.

    Home

    Thanks

    September 22, 2021 at 4:38 am #1321843
    Ismael

    Hey navindesigns,

    Thank you for the inquiry.

    Part of the logo is covering the menu items. You will have to add this css code to fix it.

    #header .main_menu {
    z-index: 1000;
}

    Please toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css code.

    Best regards,
    Ismael

    September 23, 2021 at 4:56 pm #1322064
    navindesigns

    Thanks

    i just checked this – and now when click on the words “the reading specialists” in the logo, nothing happens – its only when you click on the book then you get taken to the homepage. I need the entire logo to be clickable to the homepage

    Thanks

    September 24, 2021 at 7:36 am #1322144
    Ismael

    Hi,

    Thank you for the update.

    Looks like the main menu is covering that part of the logo. Try to use this css code to limit the height of the menu to 44px.

    .main_menu {
    height: 44px;
}

    The main menu container is also covering the middle part of the logo, which is why it is not clickable. To fix it, add this script in the functions.php file.

    // open logo link
function ava_custom_script_mod_click_logo()
{
?>
	<script>
		(function($) {
			$(".main_menu").on("click", function(e) {
				if($(e.target).is(".avia-menu")) {
					window.location.href = $(".logo a").attr("href");
				}
			});
		})(jQuery);
	</script>
<?php
}
add_action('wp_footer', 'ava_custom_script_mod_click_logo', 10000);

    Then use this css code to enable the pointer cursor in the middle part of the logo.

    .avia-menu {
    cursor: pointer;
}

    Best regards,
    Ismael

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