Widget module

ProPhoto provides several modules which can be used to create items in your page layouts. Find each type of module in the Elements sidebar area within the Visual Builder tool.

You will usually use the normal modules to add text, graphics, forms, WordPress page content, videos, featured images, and lots of other items to your layouts.

But the widget module can be used when you want to add a widget to your layout that is provided by WordPress or a widget that is added by a plugin you’ve installed.

For example, use a widget module to add a search box to your site, to add some custom HTML or embed code, even to add a MailChimp signup form created with a WordPress plugin you have installed.

Add a widget module to your layout

To add a widget module into a part of your layout, follow these steps:

Visit the Appearance > Widgets screen in WordPress.
Add all widgets you need to the “ProPhoto Widgets” section.
Configure each widget with any title or options you wish to use and save.
Edit a layout using the Visual Builder tool.
Visit the Elements > Modules sidebar to drag-and-drop a widget module into any area of your layout.
Configure the module by selecting the widget you wish to use, and choose any other style settings.
Save your layout, and the widgets will appear when you view your website.

For a video demonstrating this workflow, please click here to see a search box and a MailMunch plugin’s form added to the blog layout sidebar:

Due to the dynamic nature of WordPress widgets, they cannot be shown in the visual builder yet so a placeholder will appear instead. You can easily see them by clicking to view your page.

Remember, there are lots of WordPress plugins which can create widgets to use in a sidebar, footer, or other part of your theme, so if you need to add a special item in your site layout check the Plugins > Add New area of your dashboard to find tools to help you add new things to your site.

Embed custom HTML or JavaScript code

Before proceeding with these steps, you should know that many features are built into ProPhoto already, so check out these guides if they cover what you need to do:

Add a video or background video to your layout
Add an Instagram thumbnail grid to your layout
Add a Facebook page box to your layout
Setup Google Analytics tracking for your site
Setup Google Search Console tools for your site
Add a bit of Custom CSS styling to your site
Add a bit of JavaScript or HTML code into the <head></head> area of your site

Even if your needs aren’t covered above, it is strongly recommended that you first try to search for a WordPress plugin to help you add what you need to your website. Plugins can prevent mistakes and can update to remain secure and compatible with WordPress in the future. Plugins may also make it easier to setup what you need. Search for a plugin in the Plugins > Add New area of your WordPress dashboard.

If you cannot find a plugin to help you add what you want to your website, or if you need to embed code for a badge from another website like Wedding Wire, The Knot, etc. then you can copy the HTML or JavaScript code you’ve been given and paste it into your ProPhoto layout(s).

To embed code in a ProPhoto page layout, follow the steps in the section above but choose the Custom HTML widget in WordPress and paste your code, as seen in this clip:

This Custom HTML widget will be available when you work with the widget module – again, see the section above in this page for a full explanation of how add this widget into your ProPhoto layout.

Embedding code into the content of a page/post

It is even easier to add custom code into WordPress pages and posts directly instead of adding the code to your layouts … if your page or post content can be used, simply paste your code into the Text editor view in WordPress, seen here: