Skip to main content

Link - Basic Component

This component allows you to add a hyperlink to a text to redirect users to a page, URL, etc.

To add a link, go to the “Basic” category under the Components panel and drag and drop the "Link" component in the canvas.

DrapCode Builder Link

After dropping the link component in your canvas, just double click in the component, delete the default text and start typing the text you want to hyperlink. You can also change the font style of the added text to Bold, Italics, Underline or Strike-through if you want.

Link - Settings​

After adding the text, click this icon, DrapCode Builder Additional Tools to open the link settings. Here, you can hyperlink the added text to a URL, a page, an e-mail address or a phone number and also bind workflow events to it.

DrapCode Builder Link Settings

Let's closely look at each setting option one by one:

DrapCode Builder Link Settings

This icon, DrapCode Builder URL Link contains the settings to add a URL link to a text. So, click on it and fill in the URL you want to create a hyperlink to. If you want to open the hyperlink in a new tab, then tick the checkbox.

  • Adding a Page Link​

This icon, DrapCode Builder Page Link contains the settings to create a hyperlink to another webpage of your website. To do so, just select the page you want to create a hyperlink to and also add a URL parameter of the page. In case, you don't know, the URL parameter is that part of a URL which begins with a question mark, for example: DrapCode Builder URL Parameter

Also, if you want to open the hyperlink in a new tab, then tick the checkbox as well.

This icon, DrapCode Builder Mail Link contains the settings to create a hyperlink to an e-mail address in a webpage, so that a visitor can directly open the default email address in his/her device to send an email very conveniently.

This icon, DrapCode Builder Phone Link contains the settings to create a hyperlink to a contact number to add click-to-call feature in your webpage. Just type the number you want to hyperlink so that your end-users can contact you easily with just one click.

Additional Tools​

The link component also has a set of additional tools, positioned on the right side of the component. Know more.