Did you know you can link a text, button, or element on a page or post using Thrive Architect?
Thrive Architect allows you to add links to elements in two fundamental ways. Some elements also have a link option, which we’ll see in the article below.
- Creating inline text links or hyperlinks
- Creating a link from (almost) every other element
- Linking to a different position on the same page (jump links/anchor links)
- Inserting dynamic links
- Linking to a specific position on a page & using the link on another page
Creating Inline Text Links or Hyperlinks
Text links or hyperlinks are most commonly used to direct users from one page or element to another.
Let us quickly look at adding a static link from a piece of content to another page.
To begin, select the text to which you want to add a link and click on the chain icon (linking options) in the Panel Options.
When you click on the icon, select Static from the drop-down menu and enter the destination URL in the respective field.
In the URL field, you can copy the page URL or post it to the reader. This field also allows you to add a shortcode that’ll get executed when a reader/visitor clicks on the link.
The URL field also lets you fetch a page or post created and published on the website. To do so, start typing the page’s name or post and select it from the search results below.
Do you need more options to be included in the search results? To do so, click on the Settings icon on the right side of the URL field.
When you click on the Settings icon, a popup appears. You can select the content you want to include in the search results while entering the URL. You can choose the content by checking the boxes and clicking the Continue button.
Once you have filled in the URL field, you can choose to open the destination page in a new tab.
You also see an option to decide whether you want this link to be a Nofollow. When checked, this option will tell search engine crawlers not to follow the link and not crawl the page you linked to.
After working around these options, click the Insert button to get going.
Now that we’ve seen how to add a link, you can open it using the chain icon and choose to edit to remove it if needed.
Creating a Link From (Almost) Every Other Element
If there’s anything except text you’d want to add a link to, you can do that through the Animation & Action attributes and the Main Options.
Adding Links Through the Animation & Action Attributes
To begin with, let’s try the Animation & Action attributes by clicking on the element to which you want to add the link.
When you click/select the element, you’ll find all the attributes associated with that element in a left-side panel.
In the panel, scroll down to Animation & Action to insert the destination page/post link in the given field.
The Target URL field also allows you to add a shortcode that will be executed when a reader or visitor clicks on the link.
Do you want to fetch published pages/posts from the website? To do so, start typing the name and select it from the search results that appear.
Link a normal text link; you can also decide whether to open the target URL in a new tab and whether it should be a Nofollow link.
Adding Links Through the Main Options
Some elements, such as the Button, the Content Box, or the Image, have a quick access link option, in addition to the Animation and action one. This is purely for convenience. There is no right or better way to apply the link; you can use whichever option you prefer.
The quick access link option can be found under the Main Options of the element.
To set this up, click on the element and open the Main Options in the left-side panel.
Under Main Options, you’ll find the Target URL field, where you can enter the destination URL or simply start typing the page/post name to select it from the search results.
Everything else here is the same as the method above.
Linking to a Different Position on the Same Page (Jump Links/Anchor Links)
If you want to link to a specific element within the same page, there are two ways in which you can do this.
- Using the Table of Contents element to add a link automatically to every chapter you include on the page. You can read more about this in our article here.
- Using the JumpLink option to pass a link to an element.
Using the JumpLink Option to Pass a Link to an Element
To begin using the JumpLink option to pass a link within the page, you’ll first need to open the post in the Thrive Architect Editor.
This, too, can be done in two ways.
- Inserting a JumpLink to text
- Inserting a JumpLink to an element like a button, image, or content box.
Inserting a JumpLink to Text
In the editor, scroll to the text you want to add the link and click on the chain icon (Linking option) in the Panel Options that appear.
After clicking the chain icon, select JumpLink in the drop-down and check the box beside Smooth Animation if you want the transition to look smooth.
Selecting Smooth Animation will make the window smoothly scroll to the anchor/the target element when users click on the jump link you have set up.
If you leave the “Smooth Animation” unchecked, then, instead of seeing the animation, the users will be taken directly, with an ‘instant jump,’ to the anchor/the target element after clicking on the jump link.
Once you’ve selected the JumpLink option with or without the Smooth Animation, you must choose the target by clicking the Select Target button.
Clicking on the button will activate the “Select Target” mode on the page, represented by the orange borders. In this mode, the left sidebar is disabled to provide instructions for next steps.
In the Select Target mode, you can scroll up and down the page/post and click on the element you want to set as the target.
Once you click on the element, an orange dotted border appears around it, and the Add Jumplink button on the floating panel turns orange.
Once you know the target element, click the Add Jumplink button.
Inserting a Jumplink to an Element Like a Button, Image, or Content Box.
Unlike text, Thrive Architect has an inbuilt option for adding links to elements like Buttons, Images, and Content boxes.
Let’s say we want to add a JumpLink to a button. To get started, you must select the button by clicking on it and extend Main Options in the left-side panel.
Under Main Options, scroll down to the Button Linking option, where you click on the anchor icon representing the Jumplink option.
Selecting Smooth Animation will make the window smoothly scroll to the anchor/the target element when users click on the jump link you have set up.
If you leave the “Smooth Animation” unchecked, then, instead of seeing the animation, the users will be taken directly, with an ‘instant jump,’ to the anchor/the target element after clicking on the jump link.
Once you’ve selected the JumpLink option with or without the Smooth Animation, you must choose the target by clicking the Select Target button.
Clicking on the button will activate the “Select Target” mode on the page, represented by the orange borders. In this mode, the left sidebar is disabled to provide instructions for the next steps.
In the Select Target mode, you can scroll up and down the page/post and click on the element you want to set as the target.
Once you click on the element, an orange dotted border appears around it, and the Add Jumplink button on the floating panel turns orange.
Once you know the target element, click the Add Jumplink button.
Inserting Dynamic Links
Adding dynamic links with Thrive Architect is a detailed procedure that you can read about in our article here.
These were the primary ways to add hyperlinks using the Thrive Architect editor.
If you are looking for ways to pass links to elements on another page, here is an article you can refer to.