{"id":101728,"date":"2017-01-17T15:02:57","date_gmt":"2017-01-17T15:02:57","guid":{"rendered":"https:\/\/www.megamenu.com\/documentation\/adjust-hover-transition-speed-copy\/"},"modified":"2020-12-10T12:35:37","modified_gmt":"2020-12-10T12:35:37","slug":"how-to-add-a-logout-link-menu-item","status":"publish","type":"ht_kb","link":"https:\/\/www.megamenu.com\/documentation\/how-to-add-a-logout-link-menu-item\/","title":{"rendered":"How to add a Logout Link to your menu"},"content":{"rendered":"<p>Adding a logout link to a menu in WordPress is not as easy as it sounds, as the WordPress logout URL is customised for each user. The logout URL has a &#8220;nonce&#8221; parameter which is unique to the logged in user. If the &#8220;nonce&#8221; is incorrect then the user will be redirected to a &#8220;Are you sure you want to do this?&#8221; page.<\/p>\n<p>Therefore, we need to <strong>dynamically generate logout links<\/strong>, unique to the current user. This is possible using the Replacements functionality in Max Mega Menu Pro.<\/p>\n<h3>Step 1:<\/h3>\n<p>Create a new Custom Link item and add it to the menu:<\/p>\n<p><a href=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-101735\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item.png\" alt=\"\" width=\"2366\" height=\"1690\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item.png 2366w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item-300x214.png 300w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item-768x549.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item-1024x731.png 1024w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-custom-item-50x36.png 50w\" sizes=\"auto, (max-width: 2366px) 100vw, 2366px\" \/><\/a><\/p>\n<p>The URL is not important, we&#8217;ll use the replacements functionality to swap out the URL with a customised logout link further on.<\/p>\n<h3>Step 2:<\/h3>\n<p>Once you&#8217;ve added the item to the menu, save the menu, then hover over the &#8220;Logout&#8221; item and click the blue Mega Menu button. Click the &#8220;Replacements&#8221; tab.<\/p>\n<p><a href=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-101737\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement.png\" alt=\"\" width=\"2366\" height=\"1690\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement.png 2366w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement-300x214.png 300w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement-768x549.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement-1024x731.png 1024w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-replacement-50x36.png 50w\" sizes=\"auto, (max-width: 2366px) 100vw, 2366px\" \/><\/a><\/p>\n<ol>\n<li>Set the Mode to &#8220;Replace the menu item URL&#8221;.<\/li>\n<li>Set the HTML to:<br \/>\n<span class=\"lang:default decode:true crayon-inline  \">https:\/\/www.megamenu.com\/wp-login.php?action=logout&amp;redirect_to=https%3A%2F%2Fwww.megamenu.com&amp;_wpnonce=264cf8b9c7<\/span><\/li>\n<li>Click &#8220;Save Changes&#8221;.<\/li>\n<\/ol>\n<h3>Making sure the Logout item is only visible to Logged in users<\/h3>\n<p>Click the &#8220;Roles&#8221; tab and set the Display Mode to &#8220;Logged in users&#8221; and Save.<\/p>\n<p><a href=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-101741\" src=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link.png\" alt=\"\" width=\"2366\" height=\"1690\" srcset=\"https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link.png 2366w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-300x214.png 300w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-768x549.png 768w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-1024x731.png 1024w, https:\/\/www.megamenu.com\/wp-content\/uploads\/2017\/01\/logout-link-50x36.png 50w\" sizes=\"auto, (max-width: 2366px) 100vw, 2366px\" \/><\/a><\/p>\n<p>You&#8217;ll now have a dynamic logout link inside your menu, which is only visible to logged in users.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Adding a logout link to a menu in WordPress is not as easy as it sounds, as the WordPress logout URL is customised for each user. The logout URL has a &#8220;nonce&#8221; parameter which is unique to the logged in user. If the &#8220;nonce&#8221; is incorrect then the user will&#8230;<\/p>\n","protected":false},"author":1,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"ht-kb-category":[14],"ht-kb-tag":[],"class_list":["post-101728","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-faqs"],"uagb_featured_image_src":[],"uagb_author_info":{"display_name":"Tom Hemsley","author_link":"https:\/\/www.megamenu.com\/author\/megamenu\/"},"uagb_comment_info":0,"uagb_excerpt":"Adding a logout link to a menu in WordPress is not as easy as it sounds, as the WordPress logout URL is customised for each user. The logout URL has a &#8220;nonce&#8221; parameter which is unique to the logged in user. If the &#8220;nonce&#8221; is incorrect then the user will...","_links":{"self":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/101728","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/comments?post=101728"}],"version-history":[{"count":8,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/101728\/revisions"}],"predecessor-version":[{"id":101730,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb\/101728\/revisions\/101730"}],"wp:attachment":[{"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/media?parent=101728"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb-category?post=101728"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/www.megamenu.com\/wp-json\/wp\/v2\/ht-kb-tag?post=101728"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}