UberMenu 3 Demo Tutorials – Part 7: Dynamic Submenu

In this video, we recreate the Dynamic submenu from the UberMenu 3 demo site: http://wpmegamenu.com/dynamic

::Jump to section::

0:27 Submenu Layout Overview
— 0:43 Top section: Row of Dynamic Items
— 1:00 Middle section: Custom Content
— 1:08 Bottom section: Nested Tabs

1:22 Menus Panel Structure Overview
— 1:49 Top section: Row of Dynamic Items
— 2:27 Middle section: Custom Content
— 2:33 Bottom section: Nested Tabs

3:10 Top Section: Row of Dynamic Items
— 3:25 Dynamic Items Overview
— 4:02 Building menu items dynamically from site content terms & posts
— 4:53 Adding a Dynamic Terms Item
—- 5:40 Filtering by taxonomy
—- 6:55 Limiting the number of terms
—- 7:22 Filtering by a specific parent (“Europe”)
—- 8:30 Filtering by a specific ancestor
—- 8:45 Excluding specific terms
—- 8:50 Sorting terms
—- 9:14 Sort order
—- 9:35 Hiding empty terms
—- 9:43 Dividing terms into columns
—— 10:12 Columns – items organized left to right, then top to bottom
—— 11:00 Columns – items organized top to bottom, then left to right
—- 12:25 Applying settings to all resulting terms
—- 13:18 Setting 4 Columns to recreate the demo layout
— 13:38 Adding Dynamic Posts as Column Contents
—- 14:34 Adding a Dynamic Posts Item
—- 16:41 Limiting the number of posts
—- 17:03 Filtering by Post Type
—- 17:38 Filtering Posts by Taxonomy Term (Location)
—— 18:52 Inheriting Term from Parent Item
— 20:05 Recap of the top section

20:47 Only use Dynamic Items when you have dynamic content
— 20:54 Efficiency of dynamic vs static terms
— 21:31 Deciding whether to use Dynamic Items or not
— 22:20 Don’t use Dynamic Items for static content

23:02 Bottom Section: Nested Tabs
— 23:06 Adding a Tabs Block
— 23:43 Adding Dynamic Terms to create Tab Toggles
—- 24:00 Filtering Terms to top level terms only (no parent)
— 25:23 Adding Dynamic Terms child items
—- 26:04 Inheriting the parent term
— 26:33 Creating Nested Tabs
—- 27:08 Adding a second Tabs Block and making Dynamic Terms as Toggles
— 28:03 Adding the Post Image Grid within Nested Tabs
—- 28:20 Adding Dynamic Posts Item
—- 29:18 Setting Featured Images for Dynamic Posts (Dynamically Inherit)
—- 30:20 Formatting the items into 3 columns
— 31:09 Adjusting Width of Tab Toggles vs Tab Content Panels
—- Creating equal sized columns within nested tabs
— 33:05 Aligning images within a grid (equal inner and outer padding)

33:37 Middle section: Custom Content
— 33:51 Adding a Custom Menu Item
— 34:09 Adding custom content within the item
— 34:31 Adding some custom CSS to style the custom content
— 36:18 Adding custom CSS to the Custom Tweaks box
—- 36:48 Pasting the CSS in the Custom Tweaks
— 26:42 Changing Columns Width of custom content to Full Width

Leave a Reply

Your email address will not be published.