Skip to content

Hexo Guide

Add A Contact Form To Hexo

Here is a guide for integrating Fabform with a Hexo site:

Step 1: Create a new Hexo site

If you haven’t set up a Hexo site yet:

  1. Install Hexo CLI: Install Hexo CLI globally using npm:

    Terminal window
    npm install -g hexo-cli
  2. Create Hexo Site: Run the following commands to create a new Hexo site named hexo-personal-site:

    Terminal window
    hexo init hexo-personal-site
    cd hexo-personal-site
  3. Install Dependencies: Install dependencies for the Hexo site:

    Terminal window
    npm install
  4. Start Hexo Server: Launch the Hexo development server:

    Terminal window
    hexo server

Hexo will start a hot-reloading development environment accessible at http://localhost:4000.

Step 2: Add a Contact Section to your Hexo site

  1. Create Contact Page: Inside the source/_posts directory of your Hexo site, create a new directory named contact.

  2. Create Markdown File: Inside the contact directory, create a new markdown file named

  3. Update Contact Page Content: Replace the content of with the following code block:

    title: Contact Us
    date: 2020-11-27 17:30:49
    <form accept-charset="UTF-8" action="{your-form-endpoint}" method="POST">
    <input type="email" name="email" placeholder="Your Email">
    <input type="text" name="name" placeholder="Your Name">
    <input type="text" name="message" placeholder="Your Message">
    <button type="submit">Send</button>

    Note: Replace {your-form-endpoint} with the unique form endpoint provided by Fabform.

Step 3: Run your Hexo site locally to finalize setup

  1. Start Hexo Server: Run the following command to see your Hexo form in action at localhost:4000/contact/:

    Terminal window
    hexo server

That’s it! Your Hexo site is now integrated with Fabform for handling form submissions.