I’ve been attempting to create a way for my users to input URL’s into an input which will be used as the Body content of Emails they send. I have been using the <a href="… phrase instead of [url]… as the first option is what works with the Postmark HtmlText api field.
Anyways, I can have my users insert the links no worries but i’m trying to make it so the placeholder text they input is what is shown inside the email body input but when it comes time to send the email, the original link phrase should be used so the actual link comes through the email and not just the placeholder text.
I have created a test environment demonstrating my progress so far:
Preview:
Editor:
Let me know if you have any ideas, Im also willing to pay for someone to create a custom plugin for me to achieve this.
Hi, I can not understand what your question or issue is.
Given your test environment :
"however i cant find a way for my app to automatically find and replace each link in the input and replace it using the Placeholder they inputted. "
I just updated the test app with a cleaner and clearer ui and more information.
To answer your question; there are 2 issues here.
I would need a way to do a Find and Replace on all the link phrases that appear in the email body input and replace them with the respective Placeholders. eg Find: {a href=“LINK1”>Placeholder1</a} and Replace with “Placeholder1”. Keep in mind the user may want 2 Placeholders called “Click Here”, making any way of identifying the link it is meant to refer to impossible.
Assuming I could fix the first issue, when the user sends the email It should send the original Link phrases in the email body (not just the placeholders in the input).
Apologise for the confusion, I hope i have made my issue clearer.
I believe you should not just only display the Placeholder in your text editor, as this could confuse the user. Generally what I see is using Mustache or other similar template. So for example your customer will see things like {{placeholder}} in the text, and then know that this is not just a word but it will later be interpreted by the system.
Anyway, back to your question. Several ideas to solve this, not exhaustive
Depending on your UX, you could have 2 zones, one for the text editor where the user will see the whole HTML stuff. And a second one as a “Preview” where he will see how the HTML will be displayed after being interpreted.
Use a plugin, an HTML text editor. There are several.
You know how many links the user has inserted in the text, you can have a workflow that runs on each link and “find & replace”
