Link block

Link blocks are like div blocks except… wait, make your guess!

Bingo. Indeed, they create a link out of everything you add inside. This makes them perfect candidates for creating clickable banners or link things like images, layouts and headings.

Adding a link block

To add a link block, click on the Pointer icon in the top panel and then click Link block.

At first, you’ll see nothing but if you start adding elements inside the link block, then you will. You can add any element into a link block.

To add the URL, navigate to the Settings tab on the right-hand side and choose from the dropdown menu what type of link you want to insert.

It can be a page, custom URL, phone number or email address (we’ll add the tel: and mailto: for you, you can just enter the phone number and email directly in the field).

Tip: If you want to make it clearer that a text or heading is a link, you can go into the Design sidebar, unfold Typography, click on More options and then underline the text.

States

You can also design how link blocks look when in different states (disabled, active, hover and focus), as shown in the example below.

Click the link block and unfold Neutral in the Design tab, and then select Hover from the dropdown menu. You can then use all the settings, like adding different background colors or changing the font text.

Once you’re done, you can switch back to the neutral view.