I want to create a landing page that uses the header and footer from my website. I envision two different ways to make this happen.
1) Copy and paste the header and footer html and coresponding CSS in to the page builder in HubSpot. Create the content within the body section of the page. I have tried this by making a new landing page, adding my header code to the “Aditional <head> markup” area etc…
2) Crete a landing page without a header and footer and integrate it into our website via a new page template where the content that was created on HubSpot is simply put into the page, thus taking on our header and footer.
I have searched long and hard on the knowledge are of hubspot, google and youtube and have yet to find any concrete answers.
I’ve done this a few times for clients. It’s a pain, but I usually go option 1 as option 2 would either require rendering the HS page as an iframe within your existing site (which is bad practice and will likely give you all kinds of problems) or a very complex custom build pipeline to take the HS content and sort of repackage it for your website. That will likely be massive overkill for 99% of sites.
As per @Mike_Eastwood you won’t be able to add any code in the <head> as that’s for meta information about the page (and your header would need to be inside the <body></body> tags).
My approach is always to create a custom module for the Header and another one for the Footer in Design Manager. I usually build those modules with a couple of controls, so I can have some variations (e.g. have a ‘landing page’ flag which turns off the menu, or even let it take custom buttons on certain pages). You can plugin a HS Menu object too, if you like, which means you can still maintain the HS menu through the nice menu functionality in HS, so non-technical users can make updates without having to go into Design Manager.
You will have to dual maintain this along with your website, but if your menu code is clean, it’s not that hard - as generally site headers and footers don’t change too often, and you’re probably not using a huge amount of CSS.
Hope that helps - let us know if you need any more pointers!
Cheers,
Mike
---
Did I answer your question? If your question is answered, please mark it as a solution. If you need more help, hit that big orange ‘Reply’ button!
Mike, we are planning to engage a resource to port our header and footer over to Hubspot. About how long should it take? Seems like just a few hours to get it right, no?