📣 VideoGPT Deep Links Across All Gallery Layouts

Read more
Customization

Adding a Cincopa Module into Hubspot

Learn more about Adding a Cincopa Module into Hubspot in Cincopa.

This guide will provide you with the information you need to create a Cincopa module within Hubspot so that you can quickly and easily add your Cincopa galleries into your Hubspot webpage

Hubspot can be a valuable marketing and lead generation tool as well as an in-depth website design platform.

Getting Started

  • Log into your Hubspot account and navigate to Marketing --> Files and Tools --> Design Templates

Creating and editing Modules

In the design manager tool within Hubspot, you can create custom coded modules to add custom or advanced features to your blog, pages, or emails. The module editor has three editor panels for writing HTML and HubL, CSS, and JavaScript. Custom modules offer a wide range of functionalities so that content can be fully customized within the page, email, or blog editor.

Adding a Cincopa Module into Hubspot

Create a new module

  • In your HubSpot account, navigate to Marketing > Files and Templates > Design Tools.
  • At the top of the finder, click the File dropdown menu and select New file.
  • In the dialog box that appears, select Module.
Adding a Cincopa Module into Hubspot
  • Select page templates and blog templates.
  • Select the local module option.
  • Give the module a file name, we recommend naming the module 'Cincopa Gallery' then click Create.
Adding a Cincopa Module into Hubspot

Copy You Cincopa gallery embed code into the Hubspot module

  • Once the Module has been created we are going to copy our Cincopa embed code into the Hubspot module (HTML + HubL) Design window
Adding a Cincopa Module into Hubspot
  • Copy the embed code from your Cincopa Gallery
Adding a Cincopa Module into Hubspot
  • Paste the code into the HTML + HubL module window
Adding a Cincopa Module into Hubspot

Add fields to your module

  • In the module inspector on the right, click the Add field dropdown menu in the Fields section, then select a field to add to your module.
  • Use the 'TEXT' option under Content, you will need to scroll down to find it.
Adding a Cincopa Module into Hubspot
  • Label the text field 'Gallery ID', leave all other settings at default.
  • Under the HubL variable name under Gallery ID we are going to select 'Copy' and choose 'Copy value only'
Adding a Cincopa Module into Hubspot
  • Next we are going to replace the 'FID' in the Cincopa embed code with the value we copied
Adding a Cincopa Module into Hubspot
Adding a Cincopa Module into Hubspot

**Don't forget to publish your changes!**

Adding your new Cincopa module to a new or pre-existing template design.

  • Navigate to the page you wish to add the module to by selecting Marketing --> Website Pages and select the page.
Adding a Cincopa Module into Hubspot
  • The page will open and by default you will find yourself on the 'Content' page. You will want to navigate to the 'Settings' page.
Adding a Cincopa Module into Hubspot
  • Scroll down and expand the Advanced Options menu. Continue to scroll down once the advanced options menu is expanded and you will find the option to 'Edit this template'
Adding a Cincopa Module into Hubspot
  • Select 'Edit this template' and a new tab will open and take you to the design manager for your page.
  • Once the design manager is open you will want to select the 'Add' option in the upper right hand corner of the page.
  • Search for 'Cincopa' (the name that we applied to the module earlier in this guide) to quickly locate the new module.
Adding a Cincopa Module into Hubspot
  • Click and drag the new module onto your template in the position that you wish to have it in. (You can re-arrange the modules at any time)
Adding a Cincopa Module into Hubspot
  • Next we will want to select the 'Publish Changes' option in the upper right hand corner of your screen.
Adding a Cincopa Module into Hubspot
  • Once the changes have been published we will want to navigate back to our page by selecting Marketing --> Website Pages and choosing the page in question.
Adding a Cincopa Module into Hubspot
  • Select the page that we added the new Cincopa Gallery module to, and you will now see 'Cincopa Gallery' in your module list.
Adding a Cincopa Module into Hubspot
  • Click on the 'Cincopa Gallery' module and you will be presented with a text box where you can enter in the Cincopa Gallery ID from any of the galleries you have created in your Cincopa profile. (This Gallery ID will need to be collected from your Cincopa Profile so you will need to navigate there to find it)
  • Once the Gallery ID has been added and the page saved, the corresponding Cincopa gallery will appear in the area that you have designated on your webpage.
Adding a Cincopa Module into Hubspot

Locating the Cincopa Gallery ID through your Cincopa profile

  • Navigate to Cincopa.com and log-in to your profile
  • Select the 'Galleries' option in the upper left hand corner of your profile.
Adding a Cincopa Module into Hubspot
  • Each Cincopa Gallery has a unique Gallery ID. We can see the that ID for the first gallery is AoKABvuKrd96.
  • Copy this code and paste it into the Cincopa ID text window that is now available in your new HubSpot module.
Adding a Cincopa Module into Hubspot
  • Once the Gallery ID has been entered you can save your changes and re-load the page. The attached Cincopa Gallery will now be available for viewing!
  • Any updates to the gallery through your Cincopa profile will automatically be reflected on your HubSpot page. Give the system a few minutes to process the cache after making changes.

Remember to save your changes!

If you require any additional assistance with Cincopa integrations please don't hesitate to visit our Knowledge Center by following this link.

Adding a Cincopa Module into Hubspot