/, Tutorials, Weebly Themes/How to Create a Landing Page in Weebly (2019)

How to Create a Landing Page in Weebly (2019)

A landing page is a is usually designed to get your visitors’ attention. For example, getting their emails via a web form. They are designed to target a specific audience depending on the product you are marketing.



In this article, we are going to explain how to create a landing page in Weebly. That would be the entry point of your website.

Creating Landing Pages With Weebly

There used to be a simple feature to add landing pages in Weebly, but this was unfortunately disconnected by Weebly.

We will discuss the option we have right now to have your Weebly landing pages built.

To start, you can add a new page to your Weebly website, or work on any existing one with a splash layout. Once done, you can add the content you’d like to on your landing page then you’ll likely want for sure to hide the navigation on that page.

In this example, we have used “Unite 2 – Business “as the theme for a restaurant website. We chose the Splash page as layout type

Splash page Weebly

So far looks great but we would like to hide the navigation so that the page will have only the content we put in the middle.

Most browsers nowadays come with an extremely useful tool called the “Inspector”. There are many interesting things you can do with this tool, though in our example we just need to get the class or ID of the element that has the navigation menu.

To do so, right-click or CTRL-click on your navigation, then choose “Inspect”.

A new window will popup, and the element you right-clicked on will be selected within the code displayed. Inspector tool makes this really handy because it will highlight the element on the page. You can see in our screenshot that the element we want to hide has an ID of “wsite-menu-item”.

Hide weebly navigation

Next, go back to the Weebly Site Editor and go to the Pages tab. Select the landing page in object, then click on “SEO Settings”. In the Header Code field, enter this code:

<style>
	#wsite-menu-item { display:none; }
</style>
Landing page Weebly

Now you just need to re-publish your Weebly website and you’ll see your landing page live.

Are you guys using landing pages in your Weebly websites? Can you share your experience and/or challenges you’ve found along the way? We’d love to hear all about it!

By | 2019-02-08T02:11:06+01:00 February 8th, 2019|Beginners Guide, Tutorials, Weebly Themes|1 Comment

About the Author:

Editorial Staff at WeeblyTutorials is a team of Weebly experts.

One Comment

  1. Soren April 1, 2019 at 9:47 pm - Reply

    Great trick, but can’t make it work! I’m using the Birds Eye Theme, but it won’t let go of the birdseye-header …
    Theme: Elijah Soul – Birdseye 2

Leave A Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.