Articles in this section

Adding Call, Text, and Email Links through the WYSIWYG Editor

Pavlos Kaimakis
  • Updated
Follow

Overview

You want to use the WYSIWYG (What You See Is What You Get) Editor so you can add a phone number (call) and/or a text message or and/or an email address link. This article shows how you can link your contact info into your app. 

Solution

Having navigated to Create -> Build -> <Your_feature> -> Content (In the following example we used an Info-1-Tier feature)

mceclip3.png

You can integrate Call, Text, and Email into your app in two ways:

Using the Link Option

  1. To create a Call, SMS, or Email link, simply highlight the text or image you want to create the link for, then click the hyperlink (Screen_Shot_2019-09-09_at_2.36.25_PM.png) option.
  2. In the URL field enter:
    • tel: followed by the phone number to create a Call link and click Insert

      Screen_Shot_2019-09-09_at_2.43.48_PM.png

    • SMS: followed by the phone number to create a Text Message link and click Insert

      Screen_Shot_2019-09-09_at_2.44.09_PM.png

    • mailto: followed by the email address to create an Email link and click Insert

      Screen_Shot_2019-09-09_at_2.44.38_PM.png

  3. On the upper right-hand corner, click Save when done.

mceclip4.png

Important: The Open in New Tab function should be switched off.

mceclip0.png

Using the HTML Option

You can achieve the same thing using the HTML option.

  1. Just click the HTML button (Screen_Shot_2019-09-09_at_2.47.52_PM.png) and add the following codes wherever you want the links to appear:
    • Call: <a href="tel:123456789">Text or Image URL Here</a>
    • Text: <a href="sms:123456789">Text or Image URL Here</a>
    • Email: <a href="mailto:youremailaddress">Text or Image URL Here</a>

    Note: Change the italicized text with the appropriate values.

    Screen_Shot_2019-09-09_at_2.52.37_PM.png
  2. On the upper right-hand corner, click Save when done.

mceclip4.png

Tip: You can get creative with the email settings as well. Check out the article Link to Email for some additional options.

 Back to top

Testing

Once you created the links, you will be able to see this on your app. For instance, you may have the following result:

mceclip5.png

Important: If you use the CMS App Preview's Native Preview Option, these links are not clickable. You can use, instead, one of the methods outlined in one of the KB articles below:

Back to top

Related Articles

 

 

 

Comments

0 comments

Please sign in to leave a comment.