Header image module (picture included)

[Kihulane]

I have a question about creating a custom module.

I need to create a "Header image" module that lets the content creator choose which kind of image he/she wants to display in the blog post. I want to use specific template on each option (narrow, wide, superwide) but right now Hubspot only let's me use one template on all of the blog posts.

Something like this: 

Any suggestions if this is even possible?

[Stephanie-OG]

Is that the new landing page drag-and-drop editor? Unfortunately I haven't had the chance to work with it yet but if it's similar to the email one I don't think you can add in custom modules at the moment. 

If you're working with regular templates, you can create a custom module that sets a background image. I usually create something like this that can be added anywhere but you could also create a module that also sets the content. 

---

Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

If this helped, please mark it as the solution to your question, thanks!

[Kihulane]

Hi Stephanie,

First of all thank you for answering my question and sorry for replying you so late. 

I followed through the tutorial you linked me and created a custom module which has all the "background image" features enabled. I'm not sure if you can help me with this but I have a problem using this module. It doesn't show up in my blog post editor view. 

The module is added in the design tools template:

And it's showing up in my blog post editor view with the editable options for background image:


The problem: It's not displaying anything.

Do you know any solution why my custom module is not displaying anything in the post view?

[Stephanie-OG · Accepted solution]

The height of the background image will adjust to the content within the container. So if you were to add any content module (e.g. a Rich Text module) to that "Homepage Hero" container (just below the background image module), it should show up behind the content. 

If that's still not working, could you please send me a link or preview link to the page?

---

Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

[Kihulane]

Thank you! I can see the image now.