Table of Contents
Status
Published
Do not index
Do not index
Words
966
Intro
I started my new newsletter because of the 5-week challenge that I was doing, and called it “5 Stories, 5 Weeks”, which then changed to “#5Weeks Digest”. You can check the archives here.
Initially, this was my setup in managing this newsletter(s).
- Also, every time I wanted to create a new issue, I would:
- Login to Canva
- Open previous template
- Delete old texts, and type new ones
- Save it, and download it
- Add the new banner image to the email draft
- Repeat step 1.
It was OK for the first few times, but it became a boring chore.
My solution?
- Create a template and automate them, so I don’t have to log in into Canva, Figma or any other graphics tools any more.
I’m going to share my personal “recipe” here.
Are you ready? Let’s GO!💃🏻
But first, let’s plan the design.
Decide what you want to edit, every time.
Will it be:
- Background image?
- If your banner reflects your mood, then yes.
- Otherwise, the background is fixed throughout the course.
- The logo?
- If you’re undecided on the logo, or maybe you’re using some stock images, then yes.
- The title of your newsletter?
- I’ve learned that I might want to change my title, which happens quite frequently. So, you might want to consider this too.
- The issue numbering?
- Some people like putting the issue numbers for reference purposes. If you’re one of those people, then yes.
- The topic?
- Just like the numbering, this is also optional. Some people just put the topic at the email subject like Christine here. Be like Christine!😘
So, basically in my case, it looks like this. I only want to focus on the newsletter name, issue number and the topic of that particular issue.
The tools
- Canva — Create background image and logo/brand
- Stencil — Image generator
- Airtable — Automate the image generation
Setting up the tools
Airtable
Set up the new Airtable table with what you need:
- Name (Default as reference)
- Newsletter → The name of the newsletter
- Issue → Issue numbering
- Topic → Topic or subject of the issue
- Image (Attachment) → This is where the banner appears, magically 🎩
Stencil
After you signed up, start with 1. Creating a new project
Then, 2. Create a new template. Choose the size → Twitter (1200x675), name it and save.
This will be your main template.
3. Add Static Image as background → adjust the size to cover all white spaces
3a. Add Text as header → select font, colour & size → name it as “Newsletter”
3b. Add Text → select font, colour & size → name it as “Issue”
3c. Add Text → select font, colour & size → name it as “Topic”
Stencil to Airtable integration
4. Add new Airtable integration. From the template, click Console → Integration → Airtable → Add now
4a. Copy Airtable API key from https://airtable.com/account
4b. Paste the API key
4c. Back to integration
- View Templates → Console → Integration → Airtable → New Action
4d. Get your Base ID from Airtable → Help → API Documentation
4e. Go back to the New Action page, and fill up as below.
The test result should be like this.
4f. Map inputs as per [2. Set up Airtable] and choose your preferred file type, JPEG or PNG or both.
4g. Test the integration. But before that, let’s create a new data in Airtable.
5. Demo — The moment of truth!
- At the Console, click Run Action
- Go to Airtable and see the banner appears under “Image”
Bonus: Airtable Automations
Before anything else, we need to add a “Status” field to our table.
6a. Add the “Status” field to the base
- Create — Execute script to generate new image
- Done — This is to remind us, the image has been created.
6b. Add new data
6c. Create new automation. Click on the Automations tab, next to Data at the top left.
- Go down to “Create Automation”, name it, and press Enter to save
6d. Add trigger:
- Choose “When a record matches conditions”
6e. Add Actions to run script
6f. Copy this script and paste it inside
The Script:
// From Project settings
const API_KEY = "xxx"
// It starts with "https://api.usestencil.com/v1/airtables/..."
const ENDPOINT = "xxx"
// Generate image using our synchronous API
await fetch(ENDPOINT, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${API_KEY}`
}
})6g. Here’s how to get the Project API Key
6h. And, get the Endpoint
- Projects → Templates → Console → Integrations → Airtable
6i. Script test
- Once the script is ready, let’s do a script test.
- You should get a “✅ Test ran successfully”
That’s done. Let’s run the final test!
Don’t forget to enable automation, before testing.
Done! Try it out yourself.
You can download the Airtable template for free.
There are a few more automations you can add to this.
- Change the status from “Create” to “Done”,
- and, send the banner to your team via email, every time a new banner is created.
If this is something that interests you, read below.
Outro
I decided to work on a new project that showcasing my discoveries from working on solutions for communities and startups.
Even my own projects like No Code Asia, Community Builder Kit, and a lot more private ones.
Introducing Airtable Wiz, indie hacking your way with Airtable.
Every week, you’ll get a bite size guide working towards a bigger goal. Like this one.
Why smaller parts? Because most of us are side-hustlers. We only work on side projects whenever we’re free. So, if you can spare at least 30 mins a week, this is for you.
P/s Do you like the Airtable Wiz banner? Guess how I did it?😉
Cheers,
Leif🧙🏼♂️
Written by