Thrive Architect

Knowledgebase Docs » UberMenu 3
USEFUL? 1
UberMenu 3

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 .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.