{"id":646,"date":"2018-09-21T10:30:40","date_gmt":"2018-09-21T10:30:40","guid":{"rendered":"https:\/\/grooni.com\/docs\/groovy-menu\/?page_id=646"},"modified":"2023-03-21T22:36:00","modified_gmt":"2023-03-21T22:36:00","slug":"automatic-integration","status":"publish","type":"page","link":"https:\/\/grooni.com\/docs\/groovy-menu\/integration\/automatic-integration\/","title":{"rendered":"Automatic integration"},"content":{"rendered":"<p>The easiest and most effective way to implement the Groovy Menu on your website is through the automatic integration option. This method involves displaying the plugin immediately after the opening HTML tag <code>&lt;body&gt;<\/code>.<strong>&nbsp;<\/strong><\/p>\n<div class=\"alert alert-warning\"><strong>Note:<\/strong> that enabling automatic integration doesn&#8217;t remove or disable the built-in menu provided by your theme. Instead, it adds a Groovy menu to the top of your site. After enabling automatic integration, you&#8217;ll need to take additional steps to disable the menu provided by your theme.<\/div>\n\n\n<hr class=\"wp-block-separator is-style-wide\"\/>\n\n\n<h2>Enable Automatic integration<\/h2>\n<p>To enable automatic integration:<\/p>\n<ul>\n<li>Install and activate the Groovy Menu plugin.&nbsp;<em>Learn more about how to install the plugin in this <a href=\"https:\/\/grooni.com\/docs\/groovy-menu\/installation-of-groovy-menu\/\" rel=\"noopener\">article<\/a>.<\/em><\/li>\n<li>From the WordPress dashboard, go to &#8220;Groovy Menu &gt; Integration&#8221; and check &#8220;Enable automatic integration\u201c, then click \u201dSave changes&#8221;.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-2033\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2020\/12\/gm-automatic-integration-1.jpg\" alt=\"\" width=\"1428\" height=\"1381\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2020\/12\/gm-automatic-integration-1.jpg 1428w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2020\/12\/gm-automatic-integration-1-300x290.jpg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2020\/12\/gm-automatic-integration-1-1024x990.jpg 1024w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2020\/12\/gm-automatic-integration-1-768x743.jpg 768w\" sizes=\"(max-width: 1428px) 100vw, 1428px\" \/><\/p>\n<ul>\n<li>Next, assign the Navigation Menu to the &#8220;Groovy menu primary&#8221; theme location under &#8220;Appearance &gt; Menus &gt; Manage Locations&#8221;. You can also assign the Navigation Menu to the &#8220;Groovy menu primary&#8221; from the global Groovy Menu settings. Both methods work the same way.\n<ul>\n<li>Variant A<br><img loading=\"lazy\" class=\"alignnone size-full wp-image-654\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-24-41.jpg\" alt=\"\" width=\"1208\" height=\"563\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-24-41.jpg 1208w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-24-41-300x140.jpg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-24-41-768x358.jpg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-24-41-1024x477.jpg 1024w\" sizes=\"(max-width: 1208px) 100vw, 1208px\" \/><\/li>\n<li>Variant B<br><img loading=\"lazy\" class=\"alignnone size-full wp-image-657\" src=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-28-54.jpg\" alt=\"\" width=\"1741\" height=\"953\" srcset=\"https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-28-54.jpg 1741w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-28-54-300x164.jpg 300w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-28-54-768x420.jpg 768w, https:\/\/grooni.com\/docs\/groovy-menu\/wp-content\/uploads\/sites\/3\/2018\/09\/screenshot-gm.local-2018.09.21-17-28-54-1024x561.jpg 1024w\" sizes=\"(max-width: 1741px) 100vw, 1741px\" \/>\n<p><\/p>\n<blockquote>\n<p><strong>Note:<\/strong>&nbsp;If you haven&#8217;t created a Navigation Menu yet, follow the instructions in this article to do so. <a href=\"https:\/\/grooni.com\/docs\/groovy-menu\/quick-start\/creating-navigation-menu\/\" rel=\"noopener\">article<\/a>.<\/p>\n<\/blockquote>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n<hr class=\"wp-block-separator is-style-wide\"\/>\n\n\n<h2>Integration into location<\/h2>\n<p>Integration into location works similarly to automatic integration, but it allows you to insert the menu into theme locations. This method is only possible if the theme author has prepared such areas for the theme.<\/p>\n\n\n<hr class=\"wp-block-separator is-style-wide\"\/>\n\n\n<p><a name=\"disable-built-in\"><\/a><\/p>\n<h2>How to remove the built-in theme menu<\/h2>\n<p>The steps to disable the menu provided by your theme can vary from theme to theme. Here is a list of steps by priority:<\/p>\n<ul>\n<li>Integrate the menu as &#8220;<a href=\"https:\/\/grooni.com\/docs\/groovy-menu\/integration\/integration-through-the-child-theme\/\">Integration through the child theme<\/a>&#8220;<br>Go to the &#8220;<code>Groovy Menu &gt; Integration<\/code>&#8221; Please check whether there is any additional information regarding the installation of your theme on the page. Additionally, there should be a link available to download the child theme. (If a child theme for your installed theme is available in our database, you can use this method.)&nbsp;<\/li>\n<li>Unset all of the navigation menus provided by the theme by goint to <code>Appearance &gt; Menus &gt; Manage Locations<\/code> and leaving only the Groovy menu (Groovy menu primary).<\/li>\n<li>Find the &#8220;<code>Theme options<\/code>&#8221; section in the theme that you use, if it exists, and find settings that disable the built-in header menu.<\/li>\n<li>Check header settings in WordPress Customizer<\/li>\n<li>You can also try to hide theme menu by using CSS code. Add the following code for the appropriate CSS selector<br>\n(e.g., .built-in-menu)<p><\/p>\n<pre>.built-in-menu (is a just example of selector name) {\ndisplay: none; \nvisibility: hidden;\n}\n<\/pre>\n<\/li>\n<\/ul>\n<ul>\n<li>If none of the above steps helped to hide the menu provided by the theme, please create a ticket <a href=\"https:\/\/grooni.ticksy.com\">here<\/a><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>The easiest and most effective way to implement the Groovy Menu on your website is through the automatic integration option. &hellip; <a href=\"https:\/\/grooni.com\/docs\/groovy-menu\/integration\/automatic-integration\/\">Read more &rarr;<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"parent":627,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/646"}],"collection":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/comments?post=646"}],"version-history":[{"count":2,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/646\/revisions"}],"predecessor-version":[{"id":2717,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/646\/revisions\/2717"}],"up":[{"embeddable":true,"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/pages\/627"}],"wp:attachment":[{"href":"https:\/\/grooni.com\/docs\/groovy-menu\/wp-json\/wp\/v2\/media?parent=646"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}