Make sure to have the Flowbox plugin for WordPress with WooCommerce installed and activated on your WordPress page. If you don't have it yet, check the Installation guide first.
Once you have created a Flow in the Visual Marketing > Flows menu of the Flowbox dashboard, you can display the Flow on your WordPress/WooCommerce page using our plugin.
Copy the Flow Key
Get the Flow Key by copying it from the 'Copy Flow Key' option in the meatball (three-dot) menu in the Visual Marketing > Flows menu in the Flowbox dashboard.
Access the Flowbox plugin admin page
Go to your WordPress admin dashboard, and select the 'Flowbox' option on the sidebar to get to the Flowbox plugin's admin page.
Add new Flow
Click the 'Add New Flow' button at the top of the page to configure a new widget in your store.
You can add three different types of Flows:
Static Flow – reflects the exact, static content which you have distributed in the Flow. This type of Flow is suitable for pages like the home page and/or a community page, where you might want full control of what is shown and the order of it.
Dynamic Product Flow – serves content dynamically based on a product identifier. This type of Flow is suitable for product pages, where you want to showcase content containing a specific product and similar products.
Dynamic Tag Flow – serves content dynamically based on tags. This type of Flow is suitable for pages like category pages, where you want to display content related to a specific product category, or any other landing page where you want theme-specific content.
It's important to choose the same Flow type here that you created on the Flowbox dashboard. If you copied the Flow Key of a 'Static Flow' from the Visual Marketing > Flows menu in the Flowbox dashboard, make sure you select 'Static Flow' in the WordPress plugin to configure it correctly.
Adding a Static Flow
Adding a Static Flow
To create a Static Flow, first, click on ‘Static Flow’ and then 'Next'.
Enter a name for your Flow and click 'Next'.
Insert the Flow Key of the specific Static Flow that you want to display on your website and click 'Next'.
Add a locale to your Flow. In order to get a correct translation you will have to pick a locale from the list of supported locales.
Click the 'Create Flow' button. Your newly added Flow will show up in the list of Static Flows.
To insert the Flow to one of your pages, you will need to use the WordPress shortcode of the Flow. Copy the shortcode by clicking on the 'Copy' icon.
Go to the editor of the page where you want to use the Flow. Add the shortcode to your page exactly at the position where you want to display the Flow.
After saving the changes, your Flow will be displayed on your page.
Adding a Dynamic Product Flow
Adding a Dynamic Product Flow
To create a Dynamic Product Flow, first, click on ‘Dynamic Product Flow’ and then 'Next'.
Enter a name for your Flow and click 'Next'.
Insert the Flow Key of the specific Dynamic Product Flow that you want to use in this Flow and click 'Next'.
Add a locale to your Flow. In order to get a correct translation you will have to pick a locale from the list of supported locales.
Choose the identifier referring to the products. Make sure to choose the same identifier used on the import of product catalogs to Flowbox.
Choose the location where you want to display the Flow within the product page.
If you only want to display the Dynamic Product Flow on the product page of a specific product or category, in the next window you can select the product or collection. If you don't choose any product or collection here, the Dynamic Product Flow will be displayed on all the product pages of your store which is the default functionality of this Flow type.
Click the 'Create Flow' button. Your newly added Flow will show up in the list of Dynamic Product Flows.
To display the Dynamic Product Flows on your product pages, you don't need to use shortcodes.
After saving the changes, your Dynamic Product Flow will be automatically shown on all product pages if you did not select any specific product, or on the product/category pages of your chosen product/category in case you have selected one.
Adding a Dynamic Tag Flow
Adding a Dynamic Tag Flow
In order to create a Dynamic Flow based on tags, you need to first have collected posts with tags added in the Visual Marketing > Flows section in the Flowbox dashboard.
To create a Dynamic Tag Flow on your WordPress website, first, you need to click on ‘Dynamic Tag Flow’ and then 'Next'.
Enter a name for your Flow and click 'Next'.
Insert the Flow Key of the specific Flow that you want to use in this Static Flow and click 'Next'.
Add a locale to your Flow. In order to get a correct translation you will have to pick a locale from the list of supported locales.
In the next step, you can change the behavior of the Dynamic Tag Flow to include posts that have all the tags added or any of the tags added. If you leave it blank, the default setting will be the option that you set for this Flow on the Flowbox dashboard.
Add the tags that you want to use in this Dynamic Tag Flow.
Click the 'Create Flow' button. Your newly added Flow will show up in the list of Static Flows.
To insert the Flow to one of your pages, you will need to use the WordPress shortcode of the Flow. Copy the shortcode by clicking on the 'Copy' icon.
Go to the editor of the page where you want to use the Flow. Add the shortcode to your page exactly at the position where you want to display the Flow.
After saving the changes, your Flow will be displayed on your page.