A Blog Article About A Blog Component Dispatcher

When it comes to entering content for any customized backend, designers and developers use different layouts in order to best convey the information at hand. With blog articles, for example, everything that appears south of the listing image is considered the body of the page and needs to be entered according to a specific layout. These layouts are called components, and each component allows the user to convey information in unique ways.

Our component dispatcher, as a sidebar on the right, enables the user to select a component and place it anywhere on the page.

WYSIWYG (What You See Is What You Get) text editors are great for entering text and can offer variations of the same layout in its easy-to-navigate toolbar. Such variations might include:

  • Custom UI styles for paragraph text, headings and quotations
  • Hyperlinks
  • Standard bold, italic and underline styles
  • Unordered and ordered lists (bulleted, numbered, none, etc.)
Single column text editor component.
2-column text editor component (paragraph and quotation), with option to swap the columns.

Patterns for content administration

Depending on the extent of your text editor’s capability, you might have to include other customized page components in order to achieve your goals.

As we were gathering requirements for our blog section of the Acorn Interactive site, certain components such as Container Image, Full Width Image, Image Gallery, and Video Player were already being used elsewhere, so our WYSIWYG text editor did not have to provide for these.

Here are the other non-text based components our dispatcher can offer:

Container image with caption.
Full width image.
Image gallery with captions and alert tags if an image’s ALT text is missing. This gallery can have up to 6 images.
Video player with caption.
Tweet embed.
Prototype of a Person Reference with truncated bio dropdown.

As you can see,

the sky’s the limit for component creation when working with a fully customizable backend. It offers creative freedom for the designer, functional control for the developer and a flexible playing field for business strategists to adapt to their target audiences.