rsvpify / laravel-inky
Foundation Inky email templates in Laravel
Requires
- illuminate/support: ^5.7|^6.0|^7.0|^8.0|^9.0|^10.0
- illuminate/view: ^5.7|^6.0|^7.0|^8.0|^9.0|^10.0
- incentfit/inky: 1.3.6.5
- symfony/dom-crawler: ^2.7|^3.0|^4.0|^5.0
- tijsverkoyen/css-to-inline-styles: ^2.2
Requires (Dev)
- graham-campbell/testbench: ^5.3
- phpunit/phpunit: ^8.0|^9.0
README
Allows you to use Foundation's Inky email templates nicely in Laravel 6-10.
Any views with a .inky.php extension will be compiled with both Inky and Blade, allowing you to use both templating engines seamlessly together. CSS is automatically inlined so styles work in email clients that don't support external stylesheets.
Installation
Require with composer
composer require rsvpify/laravel-inky
Usage
Check the Foundation for Emails docs for full usage on how to use Inky and Foundation for Emails CSS.
Use Mail as usual in Laravel
Mail::send('emails.welcome', ['name' => $user->name], function ($m) use ($user) { $m->from('hello@app.com', 'Your Application'); $m->to($user->email, $user->name)->subject('Welcome!'); });
You can create a Blade layout to inherit from e.g. emails/layout.inky.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width"/> </head> <body> @yield('content') </body> </html>
then create an Inky view e.g. emails/welcome.inky.php
@extends('emails.layout') @section('content') <container> <row> <columns>Welcome, {{ $name }}</columns> </row> </container> @stop
CSS Inlining
Anything in your inky.php templates <style> elements is automatically inlined.
To apply CSS stylesheets to your inky.php templates, do not include any <link> elements. Rather, run php artisan vendor:publish which will create a new inky.php file in your config directory. This file contains an example stylesheet you will want to include for Foundation templates. Be sure to reference the location of the Foundation CSS file from your base path. You will have to obtain a recent copy of this file from Foundation, for instance at https://foundation.zurb.com/emails.html
'stylesheets' => [
'public/css/foundation-emails.css',
// you can add additional CSS files here to apply to your emails.
]
In the above array, reference any additional CSS file(s) you want to apply to your emails. Be sure to include each file starting from the base path.
Here's a handy reference for CSS in emails: CSS Support Guide for Email Clients