Совместимость с Gmail для создания шаблонов
Я использую почтовый шаблон , который я хотел бы использовать через gmail, но я увидел на сайте CanIMail, который «импортирует»:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');
@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css');
и "ссылка":
<link href = "https://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css" rel = "stylesheet">
<link rel = "stylesheet" href = "css/main.css">
<link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link href = "https://fonts.googleapis.com/css?family=Pacifico" rel = "stylesheet">
несовместимы, и это большая проблема, потому что у меня есть значок начальной загрузки, который не будет отображаться для получателя почты, и он также не сможет увидеть шрифты Google, которые мне нужны.
Пожалуйста, есть ли способ преодолеть эту проблему?
Ответы 1
К сожалению, Gmail также не поддерживает @font-face для пользовательских шрифтов: https://www.caniemail.com/features/css-at-font-face/ Даже если вы встроили CSS, который используете с @import или link тег, шрифты (и шрифты значков) использоваться не будут.
Если у вас все остальное работает, одним из вариантов будет сохранить шрифты из Google Fonts, но установить некоторые резервные шрифты для таких клиентов, как Gmail, которые не смогут их использовать. Бывший:
font-family: Poppins, Avenir Next, Futura, Verdana, sans-serif;
В зависимости от того, что вы пытаетесь сделать, Bootstrap также может работать не так, как вы ожидаете — есть несколько подобных фреймворков, которые специально написаны для совместимости с почтовыми клиентами, поскольку некоторые из них, такие как Gmail, по-прежнему сильно отличаются от того, что поддерживают современные браузеры.
Если вы используете только небольшое количество значков, вам, вероятно, больше повезет, если вы превратите эти конкретные значки в изображения PNG.
Рад, что это сработало для вас! Не могли бы вы отметить это как принятый ответ?
Спасибо @kennethormandy, это то, что я в итоге сделал. Я надеюсь, что Google исправит эти проблемы с совместимостью, чтобы мы могли расширить наши возможности в создании шаблонов электронной почты.