Skip to main content
All CollectionsPage SetupSite Pages
How To: Create a Linktree-Style Landing Page for Your Instagram Profile
How To: Create a Linktree-Style Landing Page for Your Instagram Profile
Jovana T avatar
Written by Jovana T
Updated over 9 months ago

As we all know, Instagram is not what you would call a "sharing friendly" platform. It will only let you share one live link in one place, your page's bio. This article will show you how to create a Linktree page.

Table of Contents

CREATE YOUR LINKTREE PAGE

To get started, make sure you are logged in to your site manager.

1. Click on ADD PAGE

mceclip1.png

2. Once clicked, ADD PAGE will expand into a window with a bunch of options. You are looking for ASF Template.

mceclip2.png

3. Select Linktree from the dropdown menu, and click on CREATE

mceclip3.png

4. Once you click on CREATE, you will immediately be led to a your new page's backend.

mceclip4.png

5. Here, you can edit the basic info about your new page. You can change the name, Headline text, but also the smartURL under SEO OPTIONS tab. If you click on the CONTENT tab, and click on the hyperlinked "Click Here to preview your site and build this Experience Page.", you will be taken to y our live site, where you can use our On Site Content Builder to edit the placeholder content on the page.

mceclip5.png

CUSTOMIZE YOUR LINKTREE PAGE

6. On the page it self, you will notice several placeholder sections that you need to update with relevant info. First of those is Logo image. To add your Logo image, click on the placeholder logo on the page, and select the image icon that appears after you click.

mceclip6.png

Clicking on the image file will open up your computer's explorer where you will be able to select the correct logo file you wish to upload.

7. The next step would be to update the Instagram handle below the logo. You can do so simply by clicking on the text, changing it so it reflects your IG profile, add click on the hyperlink icon that appears in the top right side.

mceclip7.png

8. Clicking on the Hyperlink icon will allow you to add a URL to this text, making it clickable, and, when clicked on, it will take the visitor to the URL you specified in this field.

mceclip8.png

9. The same rule applies for the text boxes too. Click on the box you wish to edit, and click on the Hyperlink icon to add a URL you wish that box to open when clicked on.

mceclip9.png

10. You can remove the box by clicking on the "x"

mceclip10.png

11. If you wish to create another link box, click on the "Duplicate" option,

mceclip11.png

This creates a duplicate of the box you choose, and will add it right below the chosen box.

mceclip12.png

Now all you need to do, is create a space between them. This is done by clicking on the "Settings" or the Gearbox icon, and adding a Top Padding of 30px to your box.

mceclip13.png
mceclip14.png

12. To change the Page's default background image, click on the green "Image" icon on the very bottom of the element, and select the image you'd like to use from your computer.

mceclip15.png

13. Make sure to click SAVE CONTENT when you make the changes to the page, and you are satisfied with the results.

mceclip16.png

How to disable the Lead Capture Tool pop-up in the Linktree page

It’s possible to disable the Lead Capture Tool from displaying on your Linktree page. To accomplish this, you will need to follow these steps:

1. To find the Smart URL, go to your on the Linktree page, click on the SEO OPTIONS tab

mceclip0.png

2. Copy the Smart URL and save it, so you can add it on the Lead Capture tool.

mceclip1.png

3. Now, go back to your Site Manager pages, click on your Lead Capture Tool form. In the example below this form is called Newsletter Sign up Form

mceclip2.png

4. Click on the Lead Capture Tool tab

mceclip3.png

5. Scroll down to find the field labeled Do Not Appear On The Following Url Paths. Here, you will be able to add the Linktree page Smart URL previously copied. Make sure to add a ‘/’ before the Smart URL. On this example we will add the URL path as follows: /linktree

mceclip4.png

6. When done, make sure to click on the Save button to prevent losing the changes made.

How to disable the Announcement bar from displaying in the Linktree page

In order to disable the Announcement bar, we will need to add a Script on the Linktree page.

1. Navigate to your Linktree page, and click on the Scripts tab.

mceclip5.png

2. Copy the following Script and paste it in the Head section, then click on Save.

<style>

div#announcement_bar_container {

display: none !important;

visibility: hidden;

}

</style>

mceclip6.png

Troubleshooting

  1. My page won’t save properly.

    1. You may need to use an approved browser. If you’re using anything other than Firefox or Chrome, you should stop and use either Chrome or Firefox.

    2. If you’re using an approved browser, you may need to clear your cache. Check out how to clear the cache by using the article on How To: Clear your Cache.

Did this answer your question?