Any published Page can be designated as the Front Page of your blog, instead of displaying the recent posts first.
Create A New Page
First, a Page needs to be published to your blog. Open the Compose button drop-down menu and select New Page. After you complete your page, click Publish.
Set Page As Front Page
To set your page as the Front Page, go to Settings > Posts. Under the Front Page section, select to Display a "page" as the front page, and choose a page from the drop-down menu. Click Save Changes to update your blog.
Link To Blog Index
Once a Page is designated as the Front Page, the recent posts for the blog will be available in the blog index. The blog index can be accessed by adding blog_index.html to the end of your blog's address. For example:
http://example.typepad.com/blog/blog_index.html
Note: Blog index URL will not be availabe until a Page is set as Front Page.
A link to the blog index will need to be added to your blog to allow readers to find the recent posts easily. The best option is to place a link to the blog index in the Navigation Bar. At Design > Content, click the pencil icon next to the Navigation Bar module, add the blog index link, click OK, and click Save Changes to update your blog.
Hide Sidebars On Landing Page
If you wish to remove the sidebars from the landing page, you can add some HTML to the Page. The code you add will depend on the theme and layout selected for your blog.
For a design created with the Design Lab, you can find the code to hide sidebars for two and three column layouts in the article Design Lab Tip: Hide Sidebars
If you are not using the Design Lab, go to Design > Layouts, determine which classic layout you are using for your blog, and select the corresponding code below:
Two Column (Right)
<style>
#alpha { width: 100%; } /* main content column */
#beta { display: none; } /* hide sidebar */
</style>
Two Column (Left)
<style>
#alpha { display: none; } /* hide sidebar */
#beta { width: 100%; } /* main content column */
</style>
Three Column (Right)
<style>
#alpha { width: 100%; } /* main content column */
#beta, #gamma { display: none; } /* hide sidebars */
</style>
Three Column (Right)
<style>
#alpha, #gamma { display: none; } /* hide sidebars */
#beta { width: 100%; } /* main content column */
</style>
To add the code to your Page, click to the HTML tab when composing your page, paste the code at the end, and click Publish to update your blog. Do not use the Rich Text tab to preview your page after adding the code. Instead, click the Preview button.
The above tip works without further adjustment for many themes. Some themes, however, may require some additional code to adjust for borders and padding. For help with code adjustment, contact Typepad support at Help > New Ticket.
Updated 07 May 2018
Not quite what you are looking for? Check out these other articles:
- If you are looking for information on creating a responsive design, check out the article on the Design Lab.
- For tips on making additional design changes with CSS, see the Custom CSS article.
- To create add a linked image to the sidebar, you can use the Add Sidebar Image module at Design > Content. Learn more.