Skip to content

Adding a new page

Brian Hurst edited this page May 19, 2021 · 9 revisions

Page template

Located at _layouts/page.html, this is the template that is most frequently used on beta.ada.gov. It is responsible for creating content pages like Intro to ADA.

General workflow

1. Start development server

In order to preview your changes on your local machine it is necessary to have the Jekyll development server running. Follow the instructions in the README to learn how to run the application.

2. Create a new branch

Atom

  1. Switch to the main branch
  2. Click the "Fetch" button
  3. Click the main branch button again
  4. Give the branch a unique name and click the "New branch" button

Terminal

Within your project folder:

  1. Run git checkout main
  2. Run git pull
  3. Run git checkout -b new-unique-page

3. Create new file(s)

  1. Within Atom, create a new file in the _pages directory. Be sure to create the file within a folder that will allow it to be easily found in the future. For example all of the guide pages (such as Intro to ADA) are found within _/pages/guides/. Be sure to give the file a unique name as well, using the format my-new-page.md (no spaces or special characters).
  2. Copy and paste the required front matter in as your starting point, replacing with your own unique content:
---
title: Introduction to the Americans with Disabilities Act
permalink: /guides/intro-to-ada/
---

Hello world!

4. Add page content

  1. Using markdown, add your content to the markdown file.
  2. For more advanced content, such as content nested within an accordion, reference the documented markdown widgets.
  3. In the event that a component is need that does not already have a custom markdown widget, reference the USWDS documentation to copy the HTML markup of the desired component.

5. Push your changes

Atom

  1. Click the "Stage All" button in the "Unstaged Changes" bar
  2. Once you've staged your changes, enter a commit message. Finalize by clicking the Commit button.
  3. When you're ready to share your changes to GitHub, click the Push button in the Status Bar
  4. Visit the beta-ada repo to create a new Pull request.

Terminal

Within your project folder:

  1. Run git add .
  2. Run git commit -m "First draft of new page"
  3. Run git push origin new-unique-page
  4. Visit the beta-ada repo to create a new Pull request.