August 25, 2020

How to add a Woocommerce Log in/Out to your Oxygen WordPress menu

The Oxygen Builder is one of the most powerful builders available for WordPress. While anyone can use it, it's full potential is limited to developers who can harness the light weight rawness of it's coding canvas that's available.

While some see this as a weakness, to the developer we see it as a blank canvas awaiting our masterpiece.

During a recent Woocommerce build I found that the normal PHP that would add a "Log in/Register" and "Log out" to your menu does work as easily in Oxygen when you have two menu's. Basically it puts the link in every menu because you can't select a primary menu. Why? Oxygen disables all themes which is what allows a "primary" menu to be set.

Not an issue though, as some quick research on the WordPress Developers area helped me narrow down what I needed.... to use a specific menu by it's numerical ID.

After a bit of tinkering I was also able to easily add the link and have it match the styling by adding and ID and Class to it within the List tag.

** Please note that this is using the basic menu block in Oxygen, so you may have to use inspect for the appropriate selector names.

You'll need a way to add the PHP to a "functions" file since Oxygen disables the one in the theme. You can do this using several different plugins, in this case we used the premium plugin Advanced Scripts but alternatively you can use the free plugin Code Snippets. Personally I prefer Advanced Scripts due to its feature set and the fact it has a Safe Mode so that if you enter back code, it doesn't kill your site.

  • Simply create a new snippet using that plugin, paste the below code.
  • Change the menu ID number (you can find this by viewing the URL of the menu you are editing/viewing).
  • Change the Log in/Log out text to your tastes.
  • Save and activate it, then go view your menu.

That's pretty much it. Enjoy!

add_filter( 'wp_nav_menu_items', 'woo_loginout_link', 10, 2 );

/*** Adds WooCommerce My Account Login/Logout to a specific Menu ***/
function woo_loginout_link( $items, $args ) {

if (is_user_logged_in() && $args->menu == '18') { //change menu number to one you want to add link to
$items .= '<li id="menu-item-777" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-777"><a href="'. wp_logout_url( get_permalink( wc_get_page_id( 'shop' ) ) ) .'">Log Out</a></li>'; //change log out text and link to where you want it to go on log out, currently set to shop
}

elseif (!is_user_logged_in() && $args->menu == '18') {//change menu number to one you want to add link to
$items .= '<li id="menu-item-777" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-777"><a href="' . get_permalink( wc_get_page_id( 'myaccount' ) ) . '">Log In/My Account</a></li>'; //change log in my account text and link to where you want it to go on log in, currently set to myaccount
}

return $items;
}}
Have a question?

Get in Touch

=
Copyright © 2011 - 2023 | Jeff Brigman
enveloperocket linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram