Manage Content

Configuration
Deployment

Add Content 🍀

You can write content in markdown as well as with HTML tags. All the cards you see on home page under the heading documentation are separated pages.

Pages 🎒

You can create a new card either with cli or manually.

You can create a new page with -

hugo new page getting-started/index.md

Once the new page is created you will find below contents in the frontmatter of the md file.

title: ""           // Page title
date:               // Auto generated
draft: true         // If you need to keep it draft
Description: ""     // Will show up on home page cards
icon: ""            // Refer Phosphor Icons 
weight:             // Sequencing of the cards
pageClass: ""       // (Optional) if you want to add any page level class

Date will be auto-generated with your system time.

Incase you miss the icon field, a default cog icon will appear on the cards which can be changed from category-cards-home.md.

Table of Contents 🎄

Table of contents will be auto generated in the markdown file. It will have child nodes up to 1 level only.

Use following syntax - 

## Primary Heading
### Child Heading
### Child Heading 2
### Child Heading 3

## Primary Heading 2

the above code will have output as -

├── Primary Heading 
    ├── Child Heading
    ├── Child Heading 2
    ├── Child Heading 3
├── Primary Heading 2

Concluding, you have to use ## for main heading and ### for child heading.

Markdown Syntax ⏰

You can use Markdown syntax along with HTML tags in md file. You can refer to markdown cheatsheet here.

Syntax Highlighter 🎈

HUGO supports ~193 languages highlights. You can check the entire list of languages from here.

View entire HUGO Syntax Highlight documentation form here.

Emoji Support ⚽

Emoji runs a passed string through the Emoji emoticons processor.

Full Cheatsheet.

Visit Emoji Page for all emojis in our app.

Icons 💎

Xenon Docs uses Phosphor Icons . It has 4,098 icons with 5 font weights.

Refer their official documentation for all necessary codes required.

Visit Phosphor Icons Page for all icons in our app.

FAQs 🎀

The frequently asked questions data on Home page are generated form JSON which can be found in /data folder.

Currently we use 2 keys as per our requirement but you can modify as per your needs.

The structure of FAQs can be found in /partials folder named faqs-home.html.

[
    {
        "question": "",
        "answer": ""
    }
]

Team 🍜

Our team section on home page also gets its data from JSOn file under /data folder.

[
    {
        "name": "",
        "designation": "",
        "imageName": ""
    }
]

Currently we are capturing 3 values, but you can modify as per your needs.

In the current structure our team images are placed in /static/images/out-team, you can change but also keep in mind to update it in our-team.html file.

Incase you don’t put the imageName field, a default image will appear.

Go Home