When creating Drag and Drop emails, you can currently only choose between a selected few fonts. While custom fonts is possible in email templates, it is not currently possible in Drag and Drop emails.
As fonts are an important part of a brand and embedded fonts are gaining wide support in email clients, it would be very nice to have full control over fonts in drag and drop emails.
Simply put, If we can have Lato, why can't we have other popular fonts, such as Open Sans. Indeed, why can't we simply have any we'd like?
Weitere Ideen mit folgender Beschriftung anzeigen:
Hi @ro, thank you for the idea and for all the feedback. We are hoping to review this, but this is not planned for development in the next quarter. For transparency and clarity, I am updating this issue to 'Not currently planned' for the time being. I will update here once we have plans in place.
I have been using this 'HACK' to overcome the current issue of not being able to use the custom google fonts in the Drag & Drop Builder. Please use this with your 110% testing, but it works for me.
So this is what I suggest,
1. In your Drag & Drop email - you add HTML module (If you don't have it, download it from Marketplace.) 2. Once you add the HTML module, you will be able to see the left side editor as usual, this is where you add below listed code.
3. Things to know: In first part of the <style></style> you can define fonts that you would like to use. Then in the 2nd part of the <style></style> make sure you apply the fonts that you would like to apply with HubSpot provided data-hse-inline-css="true" attribute.
4. Once you do that you will instantly see the changes, then you can preview your changes and test it as well.
<!-- Add your font face style -->
<style type="text/css">
@media screen {
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459W1hyyTh89ZNpQ.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 500;
src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gTD_vx3rCubqg.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 600;
src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_bZF3gTD_vx3rCubqg.woff2) format('woff2');
}
}
</style>
<!-- Add your font face style -->
<!-- Add your regular style with data-hse-inline-css="true" if you are using this in Drag & Drop Buuilder -->
<style type="text/css" data-hse-inline-css="true">
table, tr, td, th, ol, li, ul, p {
font-family: 'Montserrat', Helvetica, Arial, sans-serif;
font-weight: 400;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Montserrat', Helvetica, Arial, sans-serif;
}
h1, h2 {
font-style: normal;
font-weight: 600;
}
h3, h4, h5, h6 {
font-style: normal;
font-weight: 500;
}
</style>
<style type="text/css">
<!-- Any extra CSS that you would like to override will go here unless you want to add those style to inline. Otherwise add that in above style tag -->
</style>
Voting this up! The explanation that custom fonts aren't supported by email clients is BS. It's frustrating that basic functions of HubSpot are often the ones that we have to go to battle for.
This is a huge problem for us as well. I don't understand why it's available for landing pages but not for emails. Even if we can't add custom fonts, as a compromise, we need a more significant list of web fonts available.
Hey, @LMontoyaLaske You are welcome. You can actually use the text editor itself to change the color. That feature already exists. You can select the text that you like to have a different color and change it.
Sie müssen ein registrierter Benutzer sein, um hier einen Kommentar hinzuzufügen. Wenn Sie sich bereits registriert haben, melden Sie sich bitte an. Wenn Sie sich noch nicht registriert haben, führen Sie bitte eine Registrierung durch und melden Sie sich an.