Module 5: Going Live
You’ve done all the hard work: designing with AI, converting your code, and publishing your homepage. This module is about the final, crucial steps to ensure your website is fully functional, easy to navigate, and ready for visitors. We’ll cover how to create new pages and finalize your homepage setup.
Creating and Linking Your Pages
Your website is likely to have more than one page (e.g., "About," "Services," or "Contact"). Blogger's "Pages" feature is perfect for this. We will use a similar process to what we used for our course modules.
-
Step 1: Create New Pages
In your Blogger dashboard, go to the **Pages** tab and click **"New page."** Create a separate page for each part of your website, like an "About Me" page or a "Contact Us" page. In the editor, switch to "HTML view" and paste the custom code you generated for that page.
-
Step 2: Hide the Title
After publishing each page, edit it and delete the title from the title field. This is the trick that ensures the page content fills the entire screen without any extra Blogger-generated titles appearing at the top.
-
Step 3: Update Your Navigation Menu
Go back to the post that acts as your homepage. In "HTML view," add links to your new pages within your custom navigation menu. This is how visitors will navigate your site. For example, add a link like this:
<a href="https://www.printful.com/blog/how-to-write-an-about-us-page">About</a>
The Single Post Homepage Trick
By default, Blogger will show your most recent posts on the homepage. We need to tell it to display our custom post as the permanent landing page. This is a crucial, one-time setting change.
-
Step 1: Go to Settings
From your Blogger dashboard, click on the **Settings** tab in the left-hand menu.
-
Step 2: Adjust Homepage Settings
In the Settings menu, find the **"Posts"** section and look for **"Max posts shown on main page."** Change this number to `1` or less. This setting tells Blogger to only show one post on your homepage, which will be our custom-coded landing page.
-
Step 3: Save Changes
Once you change the number, scroll to the top of the Settings page and click **"Save changes"**. Your custom homepage will now be the only thing that appears on your website's main URL, making it look and function like a professional, static site.
Congratulations! You have successfully launched a professional, fully functional, multi-page custom website hosted on Blogger, for free. You have all the skills you need to build any kind of website you can imagine.