✍️ How to convert Rich Text into HTML in Airtable for Products and Collections descriptions?
Need help with Airtable? We’ve launched SyncBase Studio to assist you! Feel free to reach out at theau@syncbase.app 💬
Step-by-Step Setup
1. Add a new field in Airtable
In your Products
table:
- Create a field called
Product Description Rich Text
→ Field type: Long text, enable rich text formatting.
2. Set Up the Automation
Go to Automations > Create new automation.
Trigger:
- Trigger type: When a record is updated
- Table: Products
- Field: Product Description Rich Text
Action:
- Action type: Run a script
In the script editor:
- Click “+ Add input variable”
- Name it:
recordId
- Select value:
- Name it:
👉 Step 1: When record is updated > Record ID
- Paste the following script:
- Use the following script (you can copy and paste it):
// Markdown to HTML converter (improved version with proper <ul><li> handling)
function markdownToHtml(md) {
if (!md) return "";
let lines = md.split('\n');
let htmlLines = [];
let inList = false;
for (let line of lines) {
let trimmed = line.trim();
// List item
if (/^[-+*] /.test(trimmed)) {
if (!inList) {
htmlLines.push('<ul>');
inList = true;
}
htmlLines.push(`<li>${trimmed.slice(2).trim()}</li>`);
} else {
if (inList) {
htmlLines.push('</ul>');
inList = false;
}
// Titles
if (/^###### /.test(trimmed)) htmlLines.push(`<h6>${trimmed.slice(7).trim()}</h6>`);
else if (/^##### /.test(trimmed)) htmlLines.push(`<h5>${trimmed.slice(6).trim()}</h5>`);
else if (/^#### /.test(trimmed)) htmlLines.push(`<h4>${trimmed.slice(5).trim()}</h4>`);
else if (/^### /.test(trimmed)) htmlLines.push(`<h3>${trimmed.slice(4).trim()}</h3>`);
else if (/^## /.test(trimmed)) htmlLines.push(`<h2>${trimmed.slice(3).trim()}</h2>`);
else if (/^# /.test(trimmed)) htmlLines.push(`<h1>${trimmed.slice(2).trim()}</h1>`);
else {
// Inline formatting
let processed = trimmed
.replace(/***(.*?)***/gim, '<strong><em>$1</em></strong>')
.replace(/**(.*?)**/gim, '<strong>$1</strong>')
.replace(/*(.*?)*/gim, '<em>$1</em>')
.replace(/\[(.?)\]\((.?)\)/gim, "<a href='$2' target='_blank'>$1</a>");
// Line breaks
htmlLines.push(processed === '' ? '<br><br>' : `${processed}<br>)`;
}
}
}
if (inList) htmlLines.push('</ul>');
return htmlLines.join('\n');
}
// --- Airtable automation logic ---
let table = base.getTable("Products");
let inputConfig = input.config();
let recordId = inputConfig.recordId;
let record = await table.selectRecordAsync(recordId);
let markdown = record.getCellValue("Product Description Rich Text");
if (markdown) {
let html = markdownToHtml(markdown);
await table.updateRecordAsync(recordId, {
"Product description in HTML": html
});
}
Test the Setup
- Fill in a product description using rich formatting in the
Product Description Rich Text
field. - Wait a moment (or manually run the automation).
- Check that the
Product description in HTML
field now contains the HTML version, ready for Shopify!
Bonus Tips
- You can reuse this setup for any field where rich text → HTML is needed, not just product descriptions.
- You can do this the other way around so HTML is converted to → rich text in the new added column.
- If you need image support or more advanced markdown (like tables or code blocks), consider using Make.com or a custom webhook with
marked.js
.
Updated on: 13/08/2025
Thank you!