CategoryTagArticle

admin

I'm a Full-stack developer

Tag

Linked List
Data Structure
Chat GPT
Design Pattern
Microservices
API
AWS CDK
ReactJS
AWS Lightsail
Flutter Mobile
Part 4: Creating Static Home Page on Ghost CMS
Published date: 17/06/2023

I believe that many of you are asking the question: How to fix the home page of Ghost CMS as desired? and are struggling to find many different sources of documentation. Here, follow your steps below, it will answer you in the most clear and obvious way.


Follow me:

Step 1: Download the theme you are using to your local machine


  • Login to the Ghost Administration Dashboard.
  • Switch to the Settings page by clicking the Setting Icon in the lower left corner of the dashboard screen.
  • Next, select Design session.


Step 2: Extract the theme you downloaded and open it

Step 3: Create home.hbs file

Step 4: Add content to the file home.hbs

{{!< default}}
{{!-- The tag above means: insert everything in this file
into the {body} of the default.hbs template --}}

{{!-- Main --}}
<main id="main">
    {{#page}}
        {{content}}
    {{/page}}
</main>


Step 5: zip your theme

yarn zip


Step 6: Update route.yaml file


  • On Administration Dashboard, go to settings then select Lab session
  • Download file

  • Edit the content file and re-upload Ghost
routes:
  /:
    data: page.home
    template: home

collections:
  /blog/:
    permalink: /blog/{slug}/
    template: index:post

taxonomies:
  tag: /tag/{slug}/
  author: /author/{slug}/


Step 7: Create a homepage on Ghost


  • The file URL should be /home


Step 8: Upload your theme to Ghost


After your theme has been successfully uploaded, you can experience your blog with a custom-designed home page.


Thank you for following!!!

Recommend

Difference Between Stack and Queue
admin07/04/2024

Difference Between Stack and Queue
In the fundamental data structure, besides the linked list, the stack and queue are also used widely in computer science and programming.
Semantic Versioning NodeJS
admin07/07/2023

Semantic Versioning NodeJS
How to Use Semantic Versioning in NPM
TypeScript Design Pattern - Abstract Factory
admin07/08/2023

TypeScript Design Pattern - Abstract Factory
The abstract factory pattern is one of five design patterns in the Creational Design Pattern group. The abstract factory provides an interface for creating families of related or dependent objects without specifying their concrete classes.
Newest

What are data structures?
admin06/04/2024

What are data structures?
In this article, I would like to introduce the Data Structures for a beginner's guide
How to integrate ChatGPT-3.5 Turbo into Node.js
admin10/01/2024

How to integrate ChatGPT-3.5 Turbo into Node.js
Step-by-Step Guide to Incorporating ChatGPT-3.5 Turbo into Node.js for Basic ReactJS Applications
Part 1: How to deploy Ghost Blog on AWS using Lightsail
admin17/06/2023

Part 1: How to deploy Ghost Blog on AWS using Lightsail
In this article, I want to introduce about how to deploy Ghost Blog on AWS using Lightsail.
Đinh Thành Công Blog

My website, where I write blogs on a variety of topics and where I have some experiments with new technologies.

hotlinelinkedinskypezalofacebook
DMCA.com Protection Status
Feedback
Name
Phone number
Email
Content
Download app
hotline

copyright © 2023 - AGAPIFA

Privacy
Term
About