Rich Text Editing and Beyond with TinyMCE and Vue

Add Common Links with Link Lists

In this lesson, learn how to add link lists to a email editor powered by TinyMCE and Vue.js. Link lists make it easy to add commonly used links to newsletters, e-commerce emails, and more!

Links

LESSON TRANSCRIPT

Another quick but useful feature that we can add to our email editor is link lists. It's common for marketing to use the same links over and over again in emails. Wouldn't they just love it for you to make it easy for them to add? No problem.

Let's throw a link list option on the editor. Then we can provide as many links as we'd like. Each is an object with a title property, that labels the link in the editor UI, and a value property where we store the actual link. Let me just copy and paste some dummy ones in here to save some time.

Remember that these don't have to be hard-coded. js application, there's nothing stopping you from loading these from a REST API, a CRM, or a headless CMS. Back over in the browser, now whenever we go to add a link, At the bottom of the modal, there's a new dropdown that wasn't there before. Isn't marketing just going to love that?

Another quick but useful feature that we can add to our email editor is link lists. It's common for marketing to use the same links over and over again in emails. Wouldn't they just love it for you to make it easy for them to add? No problem.

Let's throw a link list option on the editor. Then we can provide as many links as we'd like. Each is an object with a title property, that labels the link in the editor UI, and a value property where we store the actual link. Let me just copy and paste some dummy ones in here to save some time.

Remember that these don't have to be hard-coded. js application, there's nothing stopping you from loading these from a REST API, a CRM, or a headless CMS. Back over in the browser, now whenever we go to add a link, At the bottom of the modal, there's a new dropdown that wasn't there before. Isn't marketing just going to love that?

This transcript is generated automatically from the lesson video. Spotted an inaccuracy? Let us know at team@vueschool.io.