Articles on: Operations

✍️ How to convert Rich Text into HTML in Airtable for Products 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: 17/06/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!