undkonsorten/email-template

使用 Inky 标签构建基于表格的电子邮件模板。

安装: 4

依赖项: 0

建议者: 0

安全: 0

星标: 0

观察者: 4

分支: 0

开放问题: 0

语言:CSS

类型:typo3-cms-extension

1.0.0 2024-03-14 08:42 UTC

This package is auto-updated.

Last update: 2024-09-25 11:51:30 UTC


README

扩展键: email_template

依赖项

  • TYPO3: 版本 11.5 或 12.4
  • EXT: html_mail_utility

它做什么?

Email Templates 为基于 Foundation for Emails 2 (以前称为 Inky) 的 TYPO3 提供响应式新闻通讯模板 (https://foundation.npmjs.net.cn/emails/docs/)。这些 Foundation-Inky 模板可以直接在 fluid 中使用,并将转换为坚不可摧的旧式 HTML 表格代码。这些模板可用于在 TYPO3 中构建新闻通讯模板。

安装

Composer 安装

使用

composer require undkonsorten/email-template

依赖项 html_mail_utility 将由 composer 自动安装。

非 Composer 模式

不支持使用 composer 外使用!

包含 TypoScript 设置

包含以下 TypoScript 模板

  • HTML 邮件实用工具 (html_mail_utility)
  • 内容元素 (fluid_styled_content)
  • 默认模板
    • 新闻通讯 HTML 邮件渲染 (email_template): 包含 Main/setup.typoscript
    • 新闻通讯纯文本渲染 (email_template)
  • ? 关于 html 邮件实用工具呢?

包含: 页面 TSConfig

为您的新闻通讯文件夹包含页面 TsConfig(来自扩展)

  • EmailTemplate 默认页面 TS (email_template): 包含一个单列 BE-布局和一些其他默认设置
  • EmailTemplate BE 布局单列: 包含默认 BE-布局的页面 TS

配置

大部分所需设置都可以通过 TYPO3 常量编辑器中的常量来定义。重要的设置包括

  • plugin.tx_emailtemplate.htmlMail.typeNum: 将用于电子邮件渲染的页面类型。默认为 1485434607。在发送电子邮件时,在浏览器中使用它以查看使用的 HTML 代码。
  • plugin.tx_emailtemplate.plainText.typeNum: 应定义用于电子邮件纯文本渲染的页面类型。默认为 1485434634

查看 Configuration/TypoScript 文件夹中的 TypoScript 文件,以查看您可以在自己的 TypoScript 模板中使用哪些更多设置。

使用 Foundation 前端构建

全局安装它,并查看指南中的其余部分 [https://foundation.npmjs.net.cn/emails/docs/]

sudo npm install --global foundation-cli

重要的是要使用

npm run start

如果您使用 npm run build,则可能会删除未使用的 CSS 类。尽管如此,您应该从生成的 app.css 中删除内联源映射。

要创建 app.css,请使用 npm run build 运行 foundation

app.css

app.css 文件将由 TYPO3 扩展 HTMl Mail Utility 内联到标记中。app.css 可以在 dist/css 文件夹中找到。

inject.css

inject.css 将作为 style 标签包含在 TYPO3 中。

inject.scss 只会由 npm run build 命令创建。输出中将有一个内联的 <style>@media ...</tag> 块。您需要手动创建 inject.css 文件并将其添加到您的 CSS 文件夹(公共资源)中。

这有助于保持包含的样式规则的足迹(仅伪元素和媒体查询)。

在 TYPO3 中包含的 CSS 文件

通过 TS 常量定义的 CSS 文件

plugin.tx_emailtemplate.cssFile = EXT:my_theme_extension/Resources/Public/Css/app.css
plugin.tx_emailtemplate.injectCssFile = EXT:my_theme_extension/Resources/Public/Css/inject.css

页面类型

HTML新闻通讯使用自定义页面类型发送邮件(见常量)。如果新闻通讯未使用此页面类型,则不会渲染在线阅读链接退订链接

新闻通讯内容

新闻通讯页面属性

  • 页面标题
    • 用于新闻通讯的主题
    • 在新闻通讯模板中用于版次行(Fluid:{data.title})
  • 页面副标题
    • 可以通过Fluid模板中的{data.subtitle}调用
  • 页面描述
    • 用于通常视觉上隐藏的Foundation "预览头"。预览头将在Outlook、Gmail等电子邮件客户端中显示。它防止在那些电子邮件客户端中显示“在线阅读此新闻通讯”的行作为预览/摘要。其长度应为50-100个字符。
    • 可以通过常量defaultDescription定义一个回退,以防编辑器未填写页面描述

新闻通讯内容元素

新闻通讯可以显示以下内容元素

  • 内容菜单(具有*部分索引(标记为部分菜单的页面内容)类型的特殊菜单)。这里仅列出已检查外观选项卡中的显示在部分菜单中字段的元素
  • 标题(仅标题,无文本)
  • 文本-媒体用于图像和文本(带有图像在上、左、右)或仅文本
  • 分隔符(用于内容元素之间的水平分隔符)
  • 插件

测试您的模板