前端【免费下载链接】foundation-emailsQuickly create responsive HTML emails that work on any device and client. Even Outlook.项目地址https://gitcode.com/gh_mirrors/fo/foundation-emails点击查看免费下载本指南基于仓库 docs/pages/gem-guide.md 展开系统讲解 Foundation for Emails 的 Ruby 生态inky-rb如何把简洁的自定义 HTML 标签编译成邮件必备的 table 布局premailer-rails/roadie如何自动内联样式以及只需样式资产、不想要模板语言的场景下如何改用foundation_emails。读完你可以在 Rails 项目中完成从 Gemfile 配置、生成器初始化、.inky模板重命名到 Asset Pipeline 样式导入的完整接入并了解背后 Rails Engine 的实现细节。工作原理从简单标签到邮件级表格HTML 邮件几乎完全依赖table嵌套布局才能在各客户端包括 Outlook中稳定渲染。直接用表格手写邮件意味着大量重复、冗长、易错的结构代码。Inky正是为解决这一问题而生的模板语言它让你写row、columns这类语义化标签再由编译器转换为复杂但合规的 table 结构。inky-rb是 Inky 模板语言的纯 Ruby 实现——它不依赖 Node/Gulp 工具链直接内嵌于 Rails 应用。其工作流程如下图所示整体流程可以拆解为两步Inky 编译解析邮件模板中的row、column等自定义标签将其展开为邮件所需的复杂 table 结构。这些自定义标签最终不会出现在收件人的收件箱里因为它们在发送前已被翻译成标准的表格式 HTML。CSS 内联使用premailer-rails或roadie等 CSS inliner 解析邮件模板定位模板引用的样式表遍历其中所有选择器把匹配的样式逐一内联到文档对应元素上。这样一来你无需在标记中手动嵌入style属性模板依然保持精简。两种能力组合的结果是以传统方式手写邮件所需代码量的零头产出同样精美、同样响应式的 HTML 邮件——模板保持可读样式集中管理渲染结果则由工具链保证兼容性。快速上手在 Rails 应用中接入 inky-rb在 Rails 应用中安装 inky-rb 只需几个简单步骤。1. 在 Gemfile 中声明依赖打开应用的Gemfile添加以下两行gem inky-rb, require: inky # Stylesheet inlining for email gem premailer-rails说明inky-rb默认不会自动被require因此需要显式指定require: inky这样 Inky 模板渲染能力才会被加载进应用。premailer-rails负责第二步的样式内联如果你更偏好 roadie也可以用gem roadie-rails替代两者都是文档认可的 CSS inliner 方案。2. 安装依赖执行bundle install3. 运行安装生成器运行以下命令初始化所需的样式与 mailer 布局rails g inky:install如果你想自定义生成的 mailer 布局文件名可以像这样传入参数rails g inky:install some_name即生成器会把some_name作为邮件布局的名字。4. 重命名邮件模板为.inky扩展名把你的邮件模板扩展名改为.inky。注意.inky模板内部依然可以使用 ERB所以原有的动态内容逻辑完全不受影响welcome.html welcome.html.inky pw_reset.html.erb pw_reset.html.inky完成以上四步你就可以直接在 Rails 应用里用 Inky 标签编写响应式邮件了——container、row、columns这些标签会被自动编译为兼容各客户端的表格 HTML。只想要样式资产使用 foundation_emails 独立 Gem如果你的需求仅仅是在 Asset Pipeline 里引入 Foundation for Emails 的样式而不使用 Inky 模板语言请使用foundation_emailsgem对应仓库的 gem 目录。这正好呼应 gem-guide 的「Standalone Assets」一节。安装与导入参考 gem/README.md# Gemfile gem foundation_emails执行bundle install后在邮件样式表如app/assets/stylesheets/your_emails_stylesheet.scss中导入import foundation-emails;背后的实现一个极简的 Rails Engine从源码看foundation_emails 是一个典型的「资源型」gemgem/lib/foundation_emails.rb 是入口依次require版本号与引擎require foundation_emails/version require foundation_emails/enginegem/lib/foundation_emails/engine.rb 定义了一个继承::Rails::Engine的空引擎类require rails module FoundationEmails class Engine ::Rails::Engine end end这个空引擎的作用是让 Rails 自动把 gem 内的资产目录vendor/assets 等挂载进 Asset Pipeline从而使import foundation-emails在应用中直接可用。gem/foundation-emails.gemspec 中可以看到打包规则spec.files除常规文件外还通过Dir.glob(vendor/assets/stylesheets/foundation-emails/**/*.*)显式包含样式资产spec.require_paths [lib]指定加载路径。当前仓库中 gem 的版本号定义在 gem/lib/foundation_emails/version.rb值为2.4.0.0。仓库还提供了最小化的 RSpec 测试 gem/spec/foundation/emails_spec.rb验证FoundationEmails::VERSION存在配合 gem/spec/spec_helper.rb 与 gem/Rakefiletask :default :spec可通过bundle exec rake运行测试。两条路线如何选择场景推荐方案依赖是否使用 Inky 标签想用row、columns等模板标签写邮件inky-rbpremailer-railsRuby 实现 Inky 编译 CSS 内联是只想引入现成样式、手写 table 或混合编写foundation_emails纯样式资产经 Rails Engine 注入 Asset Pipeline否两条路线都绕开了「手动把样式写进每个元素」的痛点前者通过 inliner 自动内联后者则直接使用框架自带的、已在各大邮件客户端测试过的样式体系。配套知识Inky 支持哪些标签虽然 gem-guide 的重点是 Rails 集成但理解 Inky 标签体系能帮你更快上手模板编写。仓库的 docs/pages/inky.md 列出了当前支持的标签网格container、row、columns按钮button提示框callout菜单menu、item例如一个最基础的模板骨架container row columnsPut content in me!/columns /row /container这些标签在发送前都会被转换为合法的表格 HTML不会真正出现在收件人的邮箱中。注意 Inky 是可选的——你完全可以用纯 table 编写邮件或在同一封邮件中混用 table 与 Inky 标签详见 docs/pages/inky.md 的 FAQ 部分。常见问题与注意事项.inky模板里还能用 ERB 吗可以。文档明确说明.inky扩展名不影响 ERB 的使用pw_reset.html.erb重命名为pw_reset.html.inky后动态内容照常渲染。生成器布局名如何定制rails g inky:install默认生成 mailer 布局追加一个参数如some_name即可自定义布局文件名。inliner 与模板的关系inliner 会解析模板中引用的样式表、遍历选择器并匹配文档元素所以模板里应正确引用外部样式表而不是把样式写死在标签内。适用前提以上配置均以当前仓库文档描述为准适用于使用 Rails Asset Pipeline 与 Sassimport的项目若你的构建链完全不同如纯 Gulp 前端流程则对应的是 Inky 的 Node 实现而非本文所述的 Ruby Gem 方案。小结Foundation for Emails 的 Ruby 生态给出了两把钥匙inky-rb让你用声明式标签写邮件并自动编译成表格 HTML配合premailer-rails等 inliner 免去手动内联样式foundation_emails则只把经过各客户端验证的样式资产接入 Asset Pipeline。从 Gemfile 一行声明到rails g inky:install、再到.inky模板重命名接入成本极低而源码中那个精简的Rails::Engine正是「资产即插即用」这一体验的实现基石。赞分享前端【免费下载链接】foundation-emailsQuickly create responsive HTML emails that work on any device and client. Even Outlook.项目地址https://gitcode.com/gh_mirrors/fo/foundation-emails点击查看免费下载相关推荐premailer: CSS-inliner for HTML emailspremailer: CSS inliner for HTML emails 项目简介 Premailer 是一个 Python 库可以将你的 HTML 样式Foundation for Emails CSS 快速上手从零构建、内联并测试响应式 HTML 邮件Foundation for Emails CSS 快速上手从零构建、内联并测试响应式 HTML 邮件 本指南基于 Foundation for Emails前端3分钟永久激活IDM开源脚本让下载神器免费终身使用3分钟永久激活IDM开源脚本让下载神器免费终身使用 还在为Internet Download Manager的付费授权而烦恼吗IDM激活脚本为您提供了完美的CLI上一篇WPF内存泄漏如何修复图像缓存与资源释放完整指南3步瘦身法下一篇如何用FiftyOne打造高质量生成式AI视觉内容从创建到评估的完整指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考