Magento 2 WordPress Integration Shortcodes & Widgets Documentation

Installation

You can install the module for Magento 2 using Composer or you can manually install it using FTP.

# Add the FishPig Composer repo
composer config repositories.fishpig composer https://repo.fishpig.com/

# Install the module using Composer
composer require fishpig/magento2-wordpress-integration-pluginshortcodewidget:*

# Enable the module in Magento 2
php bin/magento module:enable FishPig_WordPress_PluginShortcodeWidget

# Run the Magento upgrade system
php bin/magento setup:upgrade

# Enable the module in Magento 2
bin/magento module:enable FishPig_WordPress_PluginShortcodeWidget

# Run the Magento upgrade system
bin/magento setup:upgrade

↑ Back to Top

Shortcodes

Shortcodes can be rendered anywhere inside Magento and this is done via the \FishPig\WordPress\Block\Shortcode class.

Shortcodes in .phtml Files

If the .phtml file is loaded using a block that extends from \FishPig\WordPress\Block\AbstractBlock, you can make use of the renderShortcode method:

echo $block->renderShortcode('[gravityforms id="1"]');

If the above doesn't work, you are using a Block that does not inherit from \FishPig\WordPress\Block\AbstractBlock. In this case, you will need to create a Shortcode block.

echo $block->getLayout()
    ->createBlock(\FishPig\WordPress\Block\Shortcode::class)
    ->setShortcode('[ninja_form id=1]')
    ->toHtml();

Using a Shortcode in a Magento 2 WYSIWYG Editor

If you're adding content to a WYSIWYG editor, you won't be able to use PHP. Instead, you can use the pre-made block to add shortcodes. [contactform7 id="123"]

One important thing to note is that any " in the shortcode must be escaped using a slash (eg. \") so id=123 becomes id=\"123\"

↑ Back to Top

Product Shortcode

The Shortcodes & Widgets add-on module allows you to use a Product shortcode to quickly and easily add product lists directly into your WordPress posts and pages.

Product Shortcode Options

There are several options for the product shortcode and these can be used separately or combined.

ids

A comma separated list of product IDs. Products will be ordered using the order you enter the IDs.

[product ids="123,54,76,124"]

skus

A comma separated list of product SKUs. Products will be ordered using the order you enter the SKUs.

[product skus="first-sku,second-sku,another-product"]

category_id

A single category ID. Products will be ordered using the position in the category.

[product category_id="3"]

on_sale

A 1 to include products on sale and a 0 to include products not on sale

[product on_sale="1"]

limit

Entering 0 removes the limit. Any other number will limit products to this number. This must be used in conjunction with another option.

[product on_sale="1" limit="12"]

Combining Options

You can combine options above into a single Product Shortcode.

This shortcode will display 12 products that are on sale from the category with the ID or 3.

[product category_id="3" on_sale="1" limit="12"]

Custom Product List Template

By default the shortcode uses the Magento_Catalog::product/list.phtml template. This makes the products look exactly the same as they would on your category page, as this is the template used there.

You can change this template by using the product_list_template argument:

[product on_sale="1" limit="12" product_list_template="Magento_Catalog::product/list/shortcode.phtml"]

You would then create the Magento_Catalog/templates/product/list/shortcode.phtml file in your custom theme and add the code to display your custom product list. If you are unsure what to put in this template file, you can copy the contents of the default template (Magento_Catalog::product/list.phtml) and then modify it to achieve the design you require.

↑ Back to Top

WordPress Functions

From version 3.0, the module now uses the WordPress API rather than direct code access. As a result it's now possible to integrate WordPress on different servers. It is no longer possible to run WordPress code in Magento. Any such code will need to be refactored into Magento code, which will be more secure. If you need help with this then please get in touch.

↑ Back to Top