HubSpot All-In-One Marketing is a free marketing plugin that helps you capture more leads and grow your email list with powerful tools like forms, pop-ups, and live chat all built on top of a free contact management platform (CRM).
And if you’re using Genesis on your site, getting started has been made easy! If a Genesis child theme is activated on your site, HubSpot’s tools (live chat and popups) will match the default style (font and color) of your theme automatically.
Note: If you’ve changed the default color in Appearance > Customize > Colors or if you’ve customized your theme to use different fonts, the default theme styles will still be applied in the HubSpot setup process. You can, however, change the HubSpot styles as described in this article.
In this article:
To begin, install and activate the HubSpot All-in-One Marketing plugin.
Then click the HubSpot link in the dashboard menu and follow the prompts to create a free HubSpot account or connect your existing account, as shown in the image below.
Once you’ve successfully connected the plugin, you can create forms, monitor new contacts and enable live chat from within your WordPress admin by selecting HubSpot from the menu.
Now you can go to HubSpot > Forms to see a list of existing forms or to add new forms.
Click Create a free form and follow the prompts to add a form with your specifications, such as a contact page or a pop up newsletter subscription.
When viewing a list of forms, hover over the form name and click “Copy Shortcode” to load the form in a specific area of your website.
Live Chat Widget
To setup Live Chat, click HubSpot > Live Chat. You will be taken to Chatflows on your HubSpot account, where you can customize the appearance of the widget and interact with your visitors.
Style the Forms
By default, form styles (font and color) will match the default style of your theme, but you can change them, if desired.
In your HubSpot account, go to Settings (gear icon) > Marketing > Forms to edit the font and color of your forms, as shown in the image below.
We also recommend visiting the Non-HubSpot Forms tab to sync your other form tools to your HubSpot CRM. This is useful if you are using another third-party plugin to embed contact or opt-in forms. Using this feature, no matter what form tool you’re using, the contact information you collect will be centralized in your CRM.
Style the Live Chat Widget
By default, the live chat widget will match the default accent color of your theme, but you can change it, if desired.
In your HubSpot account, go to Settings (gear icon) > Conversations > Inboxes and then click on the name of the inbox you’d like to change.
On the next screen, click Chat to select a new accent color.
If you need help with configuring the HubSpot tools, please refer to the following resources: