How to add UberMenu to your Thrive Architect layout
To add UberMenu to your Thrive Architect layout, just add UberMenu inside a “WordPress Content” element via the Shortcode
1. Copy the UberMenu Shortcode
Go to Appearance > UberMenu > Main UberMenu Configuration
Set the Integrate Specific Theme Location to Primary Menu
Copy the generated shortcode
[ubermenu config_id="main" theme_location="primary"]
2. Add a WordPress Content element to your Thrive Architect layout
Open your Thrive Architect editor.
Click the plus icon on the right sidebar.
Select a WordPress Content element and drag it into your layout in the desired position.
3. Add UberMenu to the WordPress Content element
Switch to the “Text” tab within the WordPress Content editor.
Paste the shortcode from step 1 into the text editor.
Click Save
4. Remove extra spacing added in Thrive if desired
Thrive Architect will add margins and padding to the content block. Go to the Layout & Position settings and reduce the margins and padding to 0 (or as desired)
5. Override margin and padding applied to menu by Thrive
Thrive also adds margin and padding to all ULs in the shortcodes for some reason.
Add this CSS to your CSS Tweaks to override it:
/* Overriding bad styles from Thrive */
#tve_editor .ubermenu ul{
margin-left:0;
}
.tve_flt .tve_shortcode_rendered .ubermenu ul{
margin-bottom:0;
padding-left:0;
}
6. Prevent Thrive from stripping out all the UberMenu CSS!
By default and without notification, Thrive strips out all CSS added by other plugins to the header. This will, of course, prevent you from using any UberMenu custom styling. To disable this, click the gear on the right of the Thrive Architect editor screen
Then go to Settings > Advanced Settings > CSS in the head section, and check Do not strip CSS from head
7. Save your work
Click the Save Work button to save your layout and UberMenu will now appear in your layout.