Adding Content

Updating chunks via the Content Hub:

Chunks can be updated via the Content Hub by searching for their unique content key and replacing the placeholder content, as required:

Below is a table of some of the most important chunks, along with their description and content key, to get you up and running with locating & replacing the placeholder content with that of your own:

Title

Page

Description

Content Key

Company Icon

All

Your company icon - appears as part of the company logo (to the LHS of the company name) throughout the site

logo_icon

Company Name

All

Your company name - appears next to company icon

company_name

Hero Headline

Home

Headline that appears as part of the hero section of the homepage

home_hero

Hero Image

Home

Image that appears next to the hero headline

home_hero_image

Updating chunks inline via the Magic Editor:

  • Enable inline editing from within the browser by either adding ?editmode=true as a query string parameter on the url or using the relevant keyboard shortcut. On mac that's: CMD, Shift, E, on windows its CTRL, Shift, E.

  • Select the content you would like to replace and begin typing. Images can be changed by either clicking the placeholder image and selecting the desired file from your desktop, or by dragging and dropping the desired file onto the dropzone (shown below).

  • Click the Save button on the Editmode toolbar and voila!

Some chunks cannot be edited inline. For example, the default meta title for each page must be replaced via the Content Hub.

These kinds of chunks use the useGetChunk() syntax within the codebase, as opposed to the regular <Chunk identifier="foo"/> syntax for inline editable content.

Below is a table containing all of the most important examples, along with a description and content key, that can be used to locate them via the Content Hub.

Title

Description

Content Key

Meta Title Tagline

By default, the meta title for each page will consist of your company name along with your chosen tagline.

eg. "Neo - The fastest, most comprehensive, location API".

company_tagline

Primary Color

Dictates the default color used for any instances throughout the site that have the text-primary,border-primary or bg-primary CSS classes applied to them. Usually found on page taglines and button backgrounds.

primary_color

Font Family Composition

Font family to be used throughout the site. By default this is DM Sans.

google_font_family_name

Company Phone Number

Shown to users on the Contact Us page.

contact_info_phone

Company Email Address

Shown to users on the Contact Us page. Also used as recipient email when a user submits a query via the Contact Us form.

contact_info_email

Company Business Address

Shown to users on the Contact Us page.

contact_info_location

Email Capture Email Address

Used as the recipient email when a user submits the email capture form shown in the footer.

email_capture_email_address

Contact Us Form Email Placeholder

Placeholder content for the form email input field found on the Contact Us page.

contact_form_email_placeholder

Contact Us Form Subject Placeholder

Placeholder content for the form subject input field found on the Contact Us page.

contact_form_subject_placeholder

Contact Us Form Message Placeholder

Placeholder content for the form message input field found on the Contact Us page.

contact_form_message_placeholder

Email Capture Placeholder

Placeholder content for the email capture input field found on the site footer.

email_capture_input_placeholder

Sign Up Form Email Placeholder

Placeholder content for the registration form email input field found on the Sign Up page.

registration_form_email_placeholder

Sign Up Form Password Placeholder

Placeholder content for the registration form password input field found on the Sign Up page.

registration_form_password_placeholder

Sign Up Form Password Repeat Placeholder

Placeholder content for the registration form password repeat input field found on the Sign Up page.

registration_form_repeat_password_placeholder

Sign In Form Email Placeholder

Placeholder content for the login form email input field found on the Sign In page.

login_form_email_placeholder

Sign In Form Password Placeholder

Placeholder content for the login form password input field found on the Sign In page.

login_form_password_placeholder

Registration Form URL

URL provided to the action attribute on the registration form found on the Sign Up page.

registration_form_url

Login Form URL

URL provided to the action attribute on the login form found on the Sign In page.

login_form_url

Primary Hero Call to Action

Refers to the link text and href attribute provided to the CTA button found on the hero section of the homepage.

home_hero_primary_cta

Secondary Hero Call to Action

Refers to the link text and href attribute provided to the CTA button found on the navigation bar.

home_hero_secondary_cta

Working with collection items:

A very common use case when displaying content is to have a list of resources which have the same attributes. An example of this is the "Meet The Team" page, which displays each employee's name, bio, headshot, and social links. We call this repeatable content.

Collections are what allows us to define and display repeatable content. A collection is simply a "Group" of chunks with the same fields. For example, each item in the "Team Members" collection has the fields Name, Bio, Twitter URL, Facebook URL, LinkedIn URL and Headshot.

Fields can hold different types of information. For example, the Name field above holds text, whereas the Headshot field holds an image.

Editing/adding a new collection item via the Magic Editor:

Via the Content Hub:

Pre-populated Collections

Name

Page

Description

Blog Posts

Blogs

Refers to the Blog Posts displayed on the Blogs page. Each Blog Post has a Title, Image, Published At Date and rich text Bodyfield. Edit an existing Blog Post or continue adding your own.

Call To Actions

All

Refers to the Call To Action links on the Homepage, Login Form, Registration Form and Contact Us Form. Each Call To Action collection item has a Button Text and a Linkfield that corresponds to the href attribute provided to the anchor tag.

Customer Logos

Homepage

Refers to the Customer Logos displayed at the bottom of the homepage. Each Customer Logo collection item simply consists of a Brand and a Logo field.

FAQs

Homepage

Refers to the Frequently Asked Questions displayed on the homepage. Each FAQ collection item consists of a Questionand an Answerfield.

Feature Highlights

Homepage

Refers to the Feature Highlights displayed on the homepage. Each Feature Highlight collection item consists of a Name, optional Tagline, Description and Image field.

Headline Sets

All

Many of the pages/sections of content contain a headline and a tagline. For example, by default the FAQs section of the homepage will have a tagline of "People often wonder.." and a larger headline of "Frequently Asked Questions" . We've grouped these sets together into a collection called "Headline Sets". Each Headline Set collection item consists of a Tagline and Headline field, as well as optional Description fields.

How it Works Steps

Homepage

Refers to each step displayed in the How it Works section of the homepage. Each Step collection item consists of a Title and Description field.

Job Postings

Jobs

Refers to the Job Postings displayed on the Jobs page. Each Job Posting has a Role, Team, Location, Job Type,Application Closing Date and Job Descriptionfield. Edit an existing Job Posting or continue adding your own.

Navigation Items

All

Refers to all Navigation Items displayed on the footer of the site. Each Navigation collection item consists of a Name and a URL field.

Pages

All

Refers to the Terms & Conditions, Privacy Policy, About Us, Organization and Our Journey static pages. Each page consists of a Title and rich text Body field.

Press Releases

News and Stories

Refers to the Press Releases displayed on the News and Stories page. Each Press Release has a Title, Image, Published At Date, Category and rich text Bodyfield. Edit an existing Blog Post or continue adding your own.

Pricing Packages

Pricing

Refers to each of the Pricing Packages displayed on the Pricing page. Each Pricing Package has a Title, Price and rich text Description field. It's also possible to replace the button text and href attribute on the Call to Action links displayed beside each package from within each collection item.

Social Links

All

Refers to each of the social icons displayed on the footer. Each Social Link collection item consists of an Image and URL field.

Team Members

Team

Refers to the Team Members displayed on the Team page. Each Team Member collection item consists of a Name , Avatar and Bio field. Links to social profiles for each Team Member can also be added from within each collection item.

Testimonials

Homepage

Refers to the Testimonials displayed on the homepage. Each Testimonial collection item consists of Name, Image, Role and rich text Comment field.

Last updated