Bootstrap 4 integrationSOLVE
Jun 19, 2019 12:49 PM - edited Jun 20, 2019 11:58 AM
Hi @gwineman ,
no, it shouldn't. You have full control over the markup you wrap your editable fields in. Using the traditional drag and drop editor, you have the ability to wrap modules in specific html. Using the custom module editor makes this much simpler, though.
Here's an example of how that works:
a template builder template, with flexible columns used in the header, footer, and body section. A preset collection of modules attached to each. This template does not need to have any css or javscript document attached to it. In this example, the modules will do all of the structural work for the site, so the css and js should be directly connected to the modules, not the template.
An Example of a custom module in the custom module editor. This module is using bootstrap 4 class controls. The bootstrap css and js can be attached to each module directly, if/as needed. if a module does not require js then it isn't necessary to include framework js to a module. Notice the use of the container class within the module. in bootstrap, this is equivalent to how a lot of hubspot developers use "page-center". It is the section width control for the framework. This means that each module will make up a section of a page. You can use custom module fields to make options and take full advantage of bootstrap features.
There use to be two issues with using bootstrap in Hubspot:
1. There used to not be a way to control the markup output by the advanced menu module. a list of menu variables have been added to the hubl documentation that should make this possible now: https://designers.hubspot.com/docs/hubl/hubl-supported-variables
2. the jquery version forced on hubspot templates was out of date for use with bootstrap 3-4. There is now a drop down option in your portal settings that allows you to change the jquery version.