Magazine Theme Modules

A HubSpot theme contains Theme modules & Common modules.
The common modules are supplied to each theme by HubSpot.
Our devs developed these Theme modules!
They have specific behavior that works with the theme.
Here they will be listed how to use them and what you can obtain!

All these modules can be used on webpages & landings pages

magazine-module-accordion

This module is used here to manage a FAQ on an accordion base. The module can collapse / expand. You can choose the initial phase.

magazine-module-accordion-example

 

 

magazine-module-button

In the general setting you have declared several button style.

Take a look at all the parameters you can manage.

  • alignment
  • add icon
  • link
  • style 
  • size
  • ...

magazine-module-button-example

magazine-module-button-parameter

 

 

 

 

magazine-module-custom-section-header

This module you can use as a header , as a separator, add text or add a menu

magazine-module-custom-section-header-example-2

magazine-module-custom-section-header-parameter

 

magazine-module-custom-section-header

This module is used in the footer global module, here you can easily control the columns in the footer doormat.

magazine-module-footer-row-example

magazine-module-footer-row-parameter

 

magazine-module-custom-section-header

Use this module in a column / as a vertical element on your webpage. 

  • Select blog, topic, recent popular
  • Select 1,2,3,... articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display only first image

Same module used in 3 columns with different parameters
magazine-module-grid-1-col-example

magazine-module-grid-1-col-example-2

magazine-module-grid-1-col-parameter

 

magazine-module-custom-section-header

Use this module in a row / as a horizontal element on your webpage. This module always comes with 1 big article

  • Select blog, topic, recent popular
  • Select 1,5,9,... articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display only first image

magazine-module-grid-1-row-4-col-example

magazine-module-grid-1-row-4-col-example-2

magazine-module-grid-1-row-4-col-parameter

 

magazine-module-2-col

Use this module in a row / as a horizontal element on your webpage. This module gives you the possibility to add a newsletter subscription form.

  • Select blog, topic, recent popular
  • Select 2,4,6,... articles
  • Or select 1,3,5,.. + form
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display only first image

magazine-module-grid-2-col-parameter

magazine-module-grid-2-col-example

magazine-module-grid-2-col-example-3

magazine-module-grid-2-col-example-2

 

 

magazine-module-grid-1-col-2-col

Use this module in a row / as a horizontal element on your webpage. This module hold 5 articles. First article has a big image, article 2-5 are square

  • Select blog, topic, recent popular
  • Select 5, 9, 13,... articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display images

magazine-module-grid-1-col-2-col-parameter

magazine-module-grid-1-col-2-col-example

magazine-module-grid-1-col-2-col-example-2

 

 

magazine-module-grid-1-col-2-col

Use this module in a row / as a horizontal element on your webpage. Default the module holds 3 articles, but you can have 2 or 4

  • Select blog, topic, recent popular
  • Select 5, 9, 13,... articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display images

magazine-module-grid-3-col-parameter

magazine-module-grid-3-col-example

magazine-module-grid-3-col-example-4

magazine-module-grid-3-col-example-2

magazine-module-grid-3-col-example-3

magazine-module-grid-3-col-example-5

magazine-module-grid-3-col-example-6

magazine-module-grid-2-3-col

Use this module in a row / as a horizontal element on your webpage. Default the module holds 1 big article with 2, 3, 4 articles at the right without images.
When you use the display image switch you can obtain some unique variation and use the module in a column modus

  • Select blog, topic, recent popular
  • Select 3 or 4 articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display images

magazine-module-grid-2-3-col-parameter

magazine-module-grid-2-3-col-example

magazine-module-grid-2-3-col-example-2

magazine-module-grid-2-3-col-example-3

magazine-module-grid-3-1-col

Use this module in a row / as a horizontal element on your webpage. Default the module holds 1 big article with 2, articles at the right with images.
You can add an extra 4 articles at the bottom, or remove all the images to make it lighter.

  • Select blog, topic, recent popular
  • Select 3,7 articles
  • Display/hide  date time to read
  • Display/hide topic/read all
  • Display/hide post summary
  • Display images

magazine-module-grid-3-1-col-parameter

magazine-module-grid-3-1-col-example

magazine-module-grid-3-1-col-example-2

magazine-module-grid-3-1-col-example-3

 

magazine-module-custom-section-header

Use this module in a column / as a vertical element on your webpage. 

  • Select a webpage or a landing page
  • Override the featured image 
  • add a description if needed
  • Display/hide  date 
  • Display/hide topic/read all
  • Display/hide post summary

Same module used in 3 columns with different parameters

 

icon-with-text

This module is a kind of card, can be used in a row or a colum, holds a title, icon or image, description and link. You can add extra hover functionalities.

magazine-module-icon-with-text-parameter

magazine-module-icon-with-text-example

magazine-module-icon-with-text-example-2

magazine-module-icon-with-text-example-3

magazine-module-icon-with-text-example-4

 

 

instagram-feed

This module can hold an embedded code such as a feed from instagram. You can use it in global modules or normal pages. 

magazine-module-instagram-feed-parameter

magazine-module-instagram-feed-example

map

Embed a google map in this module, use the greyscale functionality

magazine-module-map-parameter

magazine-module-map-example

masonry-with-slideshow

Use this module to add a gallery, when an image is clicked it will popup and will let you navigate to the next image

magazine-module-masonry-with-slideshow-parameter

magazine-module-masonry-with-slideshow-example

magazine-module-masonry-with-slideshow-example-2

instagram-feed

This module is used as the main navigation for this website. The module will display & control a menu

magazine-module-menu-parameter

magazine-module-menu-example

instagram-feed

Use this module to add information about the company like address, email and phone number

magazine-module-office-details-parameter

magazine-module-office-details-example

instagram-feed

Use this module to add the branches of the company from other countries.

 

magazine-module-other-office-details-parameter

magazine-module-other-office-details-example

instagram-feed

Use this module in a left sidebar, to control the navigation within your page using anchors

magazine-module-pillar-menu-parameter

magazine-module-pillar-menu-example

magazine-module-pillar-menu-example-2

instagram-feed

This module is typically used on the thank you page. add this module to add the social media of the company

magazine-module-social-follow-parameter

magazine-module-social-follow-example

magazine-module-social-follow-example-2

instagram-feed

This module add the typical subheader line next to the header

magazine-module-subheader-parameter

magazine-module-subheader-example

instagram-feed

Use this module to add the team members of the company

magazine-module-team-parameter

magazine-module-team-example

magazine-module-team-example-2

magazine-module-team-example-3

instagram-feed

Use this module to add the testimonial-slider members of the company

magazine-module-testimonial-slider-parameter

magazine-module-testimonial-slider-example

magazine-module-grid-1-col-2-col

Use this module in a row / as a horizontal element on your webpage. Default the module holds 3 articles, but you can have 2 or 4

  • Select a webpage or a landing page
  • Override featured image
  • add a description if needed
  • Display/hide date
  • Display/hide topic/read all
  • Display/hide post summary
  • Display images