Links help you connect pages on your website to each other and other sites on the web.
There are three main things to know about using links:
- The link's text.
- The Href attribute, or the URL that the user will be taken to when clicking on the link.
- The Target attribute, which controls where the link is opened (new tab or not).
When adding a new link, there will be two text inputs on the Element's cell. The first is for the text, similar to H1 or Paragraph Elements.
Elements can be nested within links, so it is possible to make images and divs act as one big link. In these cases, leave the Link Text input cell empty.
Warning: Never nest a link inside a link. This is illegal to HTML and will cause chaos on your page.
The second input is reserved for the
href attribute. This is the link that the user will be taken to when the link is clicked.
Note: providing an
href value will apply the default link styles which may turn the text blue and give it an underline. You can overwrite these styles with the text color and text-decoration styles.
Internal links are links that go from one page to another page that live on the same website. For these types of links, you can set the
href value equal to another page's build path.
It is also helpful to link external websites from your site. One use case would be to link your social media.
When linking to external pages, the
href should be the full URL, like www.the.com.
You can also set the
href to a file URL (PDFs, JPEGs, etc) in the same way you would external links.
target attribute controls if the link is opened in the current tab or a new tab. To access this attribute, click the Link Element's corner menu and then on Attributes.
By default, a Link's
target attribute will have the value of
_blank which means the link will open in a new tab. Delete the value in this cell (leave it empty) if you want the link to load in the current tab.