Changing the header on Email subscription template

[KCooperUK]

I would like to change the logo file on the header.html file [@hubspot/cmsdefaultsystempages/templates/partials/header.html]

I have added the new logo to the BrandKit and can link to it by using the code [<img src="{{ brand_settings.logos[3].src }}"].

I have cloned the file email-subscription-prefences.html and also the partials/header.html file without any issues, however it seems I also need to create a clone of the system-base.html file in order to point to the new cloned header.html file and I am not able to create a successful clone of the system-base.html file outside of the system folder.

It seems that the easiest way to do this would be to be able to edit the original partials/header.html file but I am not able to do that.

Is it possible to allow me access to do this or suggest an easier way to accomplish this?

Thank you

[KCooperUK]

Thank you Evaldas. I created the clone in the same way you did. I then updated the new cloned subscriptions template file to link to the new [systems-base.html] file and am getting various different errors.  I have attached some screen grabs which might help. To keep things tidy all 3 cloned files are in their own folder at the root.

Thank you so much for taking a look, I appreciate your time.

Original link to default system-base.html file with no errorsupdated to cloned system-base.htmlerrorslink to new cloned header.html fileerrors on new cloned header.html file

[evaldas · Accepted solution]

Sure thing. Anytime you clone something from the system folder, all of the relative path references (i.e. "../macros/helpers.html") get broken since the relative path assumes you have all the same files placed in the same folder structure.

For example, if you have:

{% from "../macros/helpers.html" import load_fonts %}

You would need to update that to be:

{% from "../@hubspot/cmsdefaultsystempages/macros/helpers.html" import load_fonts %}

This will require some combing through the code and updating each reference to either your cloned version or a full path to the system folder.

Also, if you want to reference files that sit in the same folder (same hierarchy), you will need to reference this as so:

{% include './header-touch.html'%}

Above example is for including the "header-touch.html" in the "system-base-touch.html" file, as they sit in the same folder.

Hope this helps! 

[KCooperUK]

That worked perfectly, thank you so much for taking the time to walk me through this, it's hugely appreciated! 😁

[evaldas]

Hi @KCooperUK 

What method are you using to clone the "system-base.html" file and what kind of error are you seeing (if any)?

You should be able to right click on the file and then select "Clone template", which would then create a copy of the file in the root folder in the Design Manager:

Confirming it worked for me and I got a file called "system-base copy.html"