Honeydew - Page Templates + Link in Bio

There are 3 page templates you can use that comes with Honeydew:

  • Instagram Landing (link in bio page)
  • Default + Featured Image (adds a large hero image to a page)
  • Widgets + Content (adds a widget above page content)

How to Select a Template for a Page:

When creating a page, look to the right side under the Document tab. Find the Page Attributes section towards the bottom and click the down arrow to open it. From the dropdown, choose the template you want. The default template for each page is the “default” template, which will display your page normally.

01. The Default + Featured Image Template

This page template simply adds a large hero featured image to the top of your page. You can see it in action here. When using this template, you will also need to set a featured image for the page for the hero image to show up. I recommend this image to be at least 1700 pixels wide or larger. The height can be whatever you want. Use this page template for any page you want to have a large featured hero image.

02. The Widgets + Content Template

The Widgets + Content Template adds a full width widget area above your page content. To see it in action, see this page. You can see how I’ve added a newsletter widget to my Widgets + Content widget area, so my newsletter sign up form is showing above my page content.

After you’ve selected the Widgets + Content template for your page, go to Appearance > Widgets. Look for the “Template: Widgets + Content” widget area on the right side. Any widgets you place here will show up at the top of the page above your page content.

** PLEASE NOTE: because you are adding a widget(s) to ONE widget area for this template, you CANNOT have different widgets showing up on a bunch of different pages! Any widgets you add to this widget area will show up on EVERY page using the page template. This template is NOT for building pages. The purpose of this template is to add an important widget or two above a page(s), like the newsletter widget I used for example. Please build your pages using the normal block editor.

03. The Instagram Landing/Link in Bio Page Template

The Instagram Landing page is the page you will add to your Instagram bio. It will simply be a list of links. You can also add some featured blog posts, as shown below. This template will remove everything else, except the logo & footer, making it easy to create an engaging experience for Instagram visitors! See this page template in action here!

How to set it all up:

  1. Create a page called “Instagram Landing” or whatever you want the name to be, and choose the Instagram Landing template (see “How to Select a Page Template” at the top of this page for instructions). If you don't know how to make a page, you can learn more about that here.
  2. Go to Appearance > Menus and create a new menu called “Instagram Links”, or whatever you want the menu to be named. To learn more about how to create a menu, see here.
  3. Add any menu items or custom links you want. These links will end up showing up on the Instagram Landing page. 
  4. You don’t need to set a “menu location” for this menu because we’re just going to add this menu to a widget area using a widget. So leave the menu location blank at the bottom.
  5. Go to Appearance > Customize > Widgets. Add a Navigation Menu widget to the “Template: Instagram Landing” widget area on the right.
  6. Choose the menu you created in Step #2 from the dropdown & save.
  7. You can also add a Genesis Featured Posts widget below if you want to display a few blog posts. You can see how I’ve set up my widget for this below.

Add the Instagram Link to your Instagram Bio

  1. From your Dashboard, go to Pages
  2. Hover over the Instagram page you made earlier and click "View". This will open your Instagram Landing page!
  3. In the browser tab, you'll find the URL that you need to add to your Insta profile
  4. Open your Instagram app on your phone and click "Edit Profile"
  5. Add the URL in the "Website" section and save!

This is what my Instagram Landing page looks like on mobile when I'm done. Yours should look similar: