3.5 Building a Website on Webflow Pt.3

Welcome to episode 5!

Our Lancify Abroad website is really starting to take shape now that we have changed all the content on the different pages of the website. Now, let me take you through a few key things to help us take this website to the finish line.

Let's head back to the homepage. First off, these tabs that you see on the top aren't named what we want them to be. So let’s go ahead and change that. Starting with “Features”. Our features page is supposed to be “Why us?” so let’s change that up right here. I can just double click and make the changes as required.

I’m going to change “premium” to “Our services”, and “Pricing” to “Plans”.  And I'm going to remove the about page. I’m also going to go ahead and remove Sign In - here.

Another thing we can do is go to the top here to the page section and click on the gear icon on the side. This will let me change the names of the pages here as well. So we’ve got three tabs. What we’ll do now is remove these three sections since we’re already talking about these down here. And there you go. 

Your homepage is good to go!

The next thing that is important to know is how you connect buttons or CTAs to where it is supposed to take you. Any CTA on a webpage is meant to take you somewhere. First you need to ask the question, what are we looking to get out of this page?What is the action we want the student to take? 

Since Lancify Abroad wants to get them to schedule a free session, let's click on this CTA and change the title to “Schedule a free session”. Now when I click on the top right of the navigation bar, and then double click here to go to Settings, where you'll find this space on the right that let’s me change the URL. 

I’m going to enter the URL lancifyabroad.com/free-session

I want all the buttons on this page to take us to the same form. As the only desired goal for us is for students to sign up for a free session. To connect this button to the same link, I click here and then on the right - over here - is a place for me to put in the link.

And there you go. We’ve connected all the CTAs on our homepage. I’m going to go quickly clean up the other pages the same way as well, and connect any CTAs that need to be.

The next thing you want to do is change the logo up here. The logo is probably one of the most important parts of the website, so let’s not forget that. You can just double click on the logo element here and click “choose an image” and select the logo image that you want. And there you go!

If you come down here, we need to change the logo at the footer as well. There. And now, a few more things to clean up at the footer here. We aren't using all these links, so for now let's go ahead and remove some of them. To remove, I just click on a link and hit delete.

Social links just connect your website to the brand’s social media pages. So if you want to connect to Twitter, Facebook, Instagram or LinkedIn, you can just click on these icons on the left here, and easily link to the respective platforms. There you go. 

The next thing we’ll go through is the blog page. Let’s go here and see what the blog page looks like. Now, this page is slightly different from the others. On all the other pages, the content is what we call “static” which means it’ll just stay the same. So once I’ve changed an image or text to what I want it to be, and publish it on the page, it stays that way on the website.

With a blog, you want the content on this page to be constantly updated. Everytime you add a new blog, you want the page to show the most recent blog. And you don’t want to go and change the image and the content every time you write a new blog. That would be a colossal waste of time.

What you need is an automated system that uploads your latest blogs on your page without you having to change it each time. This happens through a CMS or Content Management System.

So if you look to the top left, you'll find 'Blog Posts'. Now here’s what happens. 

Everytime you want to upload a new blog post, you just have to “Create a new blog post”, put in a title, and add the slug, which is basically the URL of your blog. Add the date along with a summary and then your actual blog content. You can then go ahead and add images. Just drag and drop images here, or upload one from your computer. You can also pick an image for your thumbnail. And now you can publish your blog.

So what happens is, on the date that you've put on the blog, the CMS will show your blog to be the most recent one on your page. This way you don’t have to update your blog page each time. The CMS will do it for you as long as you upload the blog content and set dates for when they need to show up on your page.

The next thing we’re going to do is look at the contact page. If you go to the contact page, you can see that we have a form here. We can change up the form as you want. A form basically allows people to reach out to you. So people can put in their name, email Ids, and any message or question that they may have for us. It’s a standard part of most websites.

When someone fills out a form, their data gets automatically stored. Where does it get stored? If you just go to your dashboard here on the top left, and click on your project, and then on settings - you go to “forms”, that data shows up here. So every time someone signs up with your form, the website stores the data for you.

And another thing you can do with it is that you can set up the tool to notify you whenever someone fills out a form on your website. That’s pretty cool, right?

It’s recommended to set up notifications so you know when people are reaching out to you and respond as quickly as possible.So with a form on your website, you’re going to have a whole lot of data and particularly email Ids coming in. You can download the CSV and keep these emails to later engage with the users on your website.Now let’s go back to our website. Seems like we’re good to go. All our systems are working and in place.

Now if we go up here, it’ll ask you to put your custom domain name. We don’t have that just yet, but we'll get to it in the next episode. For now if you want to check out what your website looks like, go back to your project, go up here and hit publish. 

And there, it begins publishing your website.Now if you click this button right here, it’ll open it up on an actual website and this is what it looks like.

And there you have it! You have a brilliant, functioning, good looking website without having to write a single line of code!

In the next episode we’ll talk about how you can take this website you’ve built and put it on your own custom domain. And once you do that, well, your website is good to go!