How to Use
Installation: Navigate to Marketing > File & Templates > Design Tools > @marketplace > Pinetco folder to find the Hero Header Slider Module. Install it.
Integration: In the Marketing section, choose Website Menu > Website Pages and add the "Hero Header Slider Module" module to your desired page.
Content Customization
-
Slider Background Type: Select a background type for the slide: Video, Image, Solid Color, or Gradient Color.
-
Add Sup Title: Check this box to display the slide's sup title.
-
Sup Title: Enter the sup title for the slide.
-
Add Title: Check this box to display the slide's title.
-
Title: Enter the title for the slide.
-
Add Description: Check this box to display the slide's description.
-
Description: Enter the description for the slide.
-
Add First Button: Check this box to add the first button to the slide.
-
First Button: Enter the text and link for the first button on the slide.
-
Add Second Button: Check this box to add the second button to the slide.
-
Second Button: Enter the text for the second button on the slide.
Style Customization
Utilize the Style Group options to refine the Recent Blog Posts:
-
Enhance Your Design: Text Alignment, Container, Spacing, Bottom Spacing, Color, Columns, Show Slider Arrow and its settings, Show Pagination dots and its settings, Checkbox for Show Sliding Effect Infinity, Checkbox for Add Fade Effect, Checkbox for Add Autoplay Effect, Checkbox for Make Pagination Vertical, Checkbox for Make Slider Vertical, Height of Header, First Button Settings and Second Button Settings.
Module Usage
Please note the following important considerations when using this module:
-
Slider Fade Effect: The Slider's Fade Effect cannot be used in conjunction with the Vertical Sliding Option. Please select either the Fade Effect or the Vertical Sliding Option for optimal performance.
-
Vertical Sliding Option Height Settings:
- When using the Vertical Sliding Option, you must specify the height as either Full Viewport or Custom Height.
- Auto Height is not supported with the Vertical Sliding Option, so please ensure to avoid this setting.
- If you choose Custom Height, it is essential to account for the total height of the content, including any padding. Ensure that the combined height of your content and padding matches the specified Custom Height for proper display.
By following these guidelines, you can ensure the module functions as intended on your website. Thank you for your attention to these details!
Conclusion
In conclusion, the Hero Slider is a powerful tool for enhancing your HubSpot website with engaging and customisable content. Its seamless video integration and stunning animations allow you to create eye-catching hero sections that attract visitors and drive conversions. By following the setup and customization guidelines in this documentation, you can fully leverage the Hero Slider’s features to effectively showcase your brand and key messages. Start transforming your website today with the best Hero Slider in the HubSpot Marketplace!