Using The Content Editor

Up until this point we've only focused in on the consumer facing content reader we've built at Guides.co. Moving forward we will discuss the process of inputting content into Guides, the tools we've built for managing the content, as well as information on how to directly input important content parts like picking a title, adding sections and pages, as well inputing marketing images, cover images, and other widgets to your Guide.

The first time you open the Guide editor, you'll be met with an Example Introduction, as well as two example pages for your Guide. The editor is displayed in the exact same fashion as your actual Guide. On the left is the Navigation Bar, and it acts in the same manner as your customer facing Guide.

The bold titles are Section headers, and the secondary, non-bolded, titles are the individual pages for your Guide.

Sections

Section headers are often, but not always, used as introductory content that explains what a reader can expect throughout the upcoming section. By default, once you create your Guide, there will be one Example Introduction section. This section can be edited, or removed entirely before you start inputting your content.

Pages

The bulk of your content will find a home in Pages. These Guide segments are designed to help readers navigate content quickly, and effectively. By default, we've also included two example pages. These pages can also be edited, or removed by hitting the delete button at the end of the content editor.

The What You See Is What You Get (WYSIWYG) Editor

Our content editor has been built to make life easy for content creators. We've built both a WYSIWYG editor, and an HTML editor so that everyone can create content in a way they feel comfortable.

The WYSIWYG editor will display text, and formatting exactly how a reader sees it when they open up your Guide. The HTML editor, on the other hand let's content creators dig deeper into the markup to structure content at a much more granular level.

Tools Built Into The WYSIWYG Editor

While we won't be getting into all the tools, and their functionality in this section of the Guide, the tools that do appear in the WYSIWYG editor are as follows, from left to right:

  • HTML Editor (Advanced)
  • Quick Text Formatting
  • Bolding Text
  • Underlining Text
  • Italicizing Text
  • Text Alignment
  • Unordered List Formatting
  • Ordered List Formatting
  • Outdenting Text
  • Indenting Text
  • Adding ImagesAdding Videos
  • Adding Tables
  • Adding Links
  • Changing Font Colors
  • Highlighting Text
  • Changing The Font Size

A Quick Note On Editing The HTML

An understanding of the HyperText Markup Language (HMTL) is important before jumping into the HTML editor. It's really easy to break the markup of your content if you don't have a full grasp on HTML.

This is an excellent opportunity to brush up on your HTML fundamentals. There's an excellent HTML course here that you can check out. If the contents on the page we've linked to is daunting, you may want to avoid the HTML editor.