Articles on: Operations

✍️ 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:

  1. Click “+ Add input variable”
    • Name it: recordId
    • Select value:

👉 Step 1: When record is updated > Record ID

  1. 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


  1. Fill in a product description using rich formatting in the Product Description Rich Text field.
  2. Wait a moment (or manually run the automation).
  3. 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

Was this article helpful?

Share your feedback

Cancel

Thank you!