Setting the Supabase Auth Email Templates in Production
Configure the Supabase authentication URLs and emails in the Next.js Supabase Starter Kit.
Makerkit provides a set of email templates that you can use for replacing the standard Supabase Auth emails. Additionally, you can customize these templates to match your brand.
How to set the Supabase Auth Email Templates in Production
Makerkit provides a set of email templates that you can use for replacing the standard Supabase Auth emails. Additionally, you can customize these templates to match your brand.
Setting the Email Templates in Supabase
Why should you use our email templates?
Please update the auth emails using the following documentation in Supabase.
Failure to do so will result in hiccups in the authentication flow when users click on an email and get redirected to a different browser than the one they used to sign up due to how the PKCE flow works.
- They will use the token hash strategy, which remediates the issue of users being redirected to a different browser than the one they used to sign up.
- They look better than the default Supabase templates and you can customize them to match your brand.
Customizing the Email Templates
Please clone the templates repository locally and customize them to your liking:
- Emails Starter: Clone our Emails Starter at https://github.com/makerkit/makerkit-emails-starter. This repository contains a React.Email project with the email templates already set up.
- Customize the templates: Next, you want to customize the templates as you see fit. For example, adding your product name, logo, and other branding elements.
- Export the templates: Export the templates with your own information
- Replace the templates: Replace the templates in the
apps/web/supabase/templates
folder - Update the email templates in your Supabase settings: Update the email templates in your Supabase's instance settings so that they use your custom templates.
Now your emails from Supabase Auth will look great and match your brand! 🎉