Magento WordPress Integration MenusWordPress Integration

« Back to Magento WordPress Integration

  • In Magento 2 there are several ways to get a WordPress menu, build it and display it.

    Get a WordPress Menu as an Array

    // You can use constructor injection but this tutorial
    // uses the object manager for simplicity
    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
    // Get a Menu model object
    $menu = $objectManager->create('FishPig\WordPress\Model\MenuFactory')->create();
    // Load the menu by it's ID
    // You can get the Menu ID from the URL while editing
    // the menu in the WordPress Admin
    // Check that the menu has been loaded
    if ($menu->getId()) {
    	// Load the menu items as an array tree
    	$menuTree = $menu->getMenuTreeArray();
    	// This will print out the menu items
    	// You can also get the array as objects rather than static text
    	$menuObjects = $menu->getMenuTreeObjects();
    else {
    	echo 'No menu exits in WordPress with the given ID.';

    Get a WordPress Menu as HTML

    This method will provide you with the menu in HTML format. The HTML format is fixed and may not match the HTML required for your template so the above method is recommended over this.

    // You can use constructor injection but this tutorial
    // uses the object manager for simplicity
    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
    // Get the menu block
    $menuBlock = $objectManager->create('FishPig\WordPress\Block\Sidebar\Widget\NavMenuFactory')->create();
    // Set the menu ID
    // Print out the menu HTML
    echo $menuBlock->toHtml();
  • WordPress includes a great feature that allows you to build dynamic menu's based on your blog content directly from the WordPress Admin. This is a feature lacking in Magento so it's great that WordPress offers this. Using WordPress Integration, you can easily display any of these menu's in Magento and even append one to your main Magento navigation.

    Add a Menu to the Main Magento Menu

    If you're using an old version of Magento, this feature may not work. This feature will also only work if you using the default Magento menu system, as most custom menu's do not call the default menu events required.

    The first step is to create a menu in the WordPress Admin. To do this, select Appearance > Menus and add the elements to your new menu. Once you have created the menu and saved it, login to the Magento Admin and select WordPress > Settings from the Admin menu. Scroll down to the section labelled 'Menu' and select your new menu from the pre-populated list. Assuming you have one of the later versions of Magento installed and are using the default menu system, your WordPress menu will have been automatically added to your Magento menu.

    Add a WordPress Menu Anywhere in Magento

    If your Magento navigation system doesn't use the default menu events, you can manually create a menu block using XML or PHP and include it your navigation template. This is also great for including lists of links in other places that you or your client want to easily control, such as footer links.

    Create a menu in the WordPress Admin and take note of the ID that has been assigned to it. Assuming the ID assigned is 48, you can use the following code to create your menu block:

    Using XML

    <block type="wordpress/menu" name="">
    	<action method="setMenuId"><id>48</id></action>
    	<action method="setListId"><id>my-menu</id></action>
    	<action method="includeWrapper"><inc>1</inc></action>
    	<!-- The above Includes the wrapping <ul tag -->

    Using PHP

    <?php $menu = Mage::getSingleton('core/layout')
    	->includeWrapper(true) // Includes the wrapping <ul tag 
    	->setListId('my-menu') ?>
    <?php echo $menu->toHtml() ?>

    Using either of the above methods, you can take a WordPress menu and display it anywhere in your Magento website.

Magento 2 / WordPress Integration Add-on Modules

Here's a selection of our popular and new add-on modules for Magento 2 WordPress Integration.

View All Add-on Modules