Tales

jump to navigation jump to search

Post Headers

Documentation Navigation

  • Documentation
    • Installation
    • Menus
    • The Home Page
    • Customisation
    • Post Headers
    • Cover Photos
    • WordPress

The Tales WordPress theme lets you customise a variety of different post and page headers.

Below is a guide for typographic and half-page headers. You can see examples on the demo website. See Cover Photos for more options.

By default posts use a typographic header:

Tales post with typographic header.
Tales post with typographic header.

As you can see in the screenshot above, the post title is followed by the published date as a sub-title below. Pages start with the same typographic header but have no sub-title by default. All customisation is done using the Post Header tool. You can find this underneath the main text editor when editing posts.

Tales post header tool for authors.
Tales post header tool for authors.

The centre Sub-Title column gives you three options:

  • None (default for pages)
  • Date (default for posts)
  • Custom

Select “Custom” to enter any sub-title you want. Make sure to preview your changes because very long titles will eventually break the design.

The screenshot below shows a half-page banner with custom colours:

Tales post with half-page header and colours.
Tales post with half-page header and colours.

To achieve this effect select “Banner” from the Format column and then enter your colours to the right. Here’s the final configuration:

Tales post header tool with half-page banner options.
Tales post header tool with half-page banner options.

The best way to learn the Page Header tool is to experiment with the options and see the results! It’s advisable to use dark background colours because the navigation and search icons will always be white when overlaid.

See Cover Photos for a guide to images.

dbushell.com newsletter

  • Home
  • Updates
  • Documentation
  • Developers
  • Download
  • License

The Author

Tales is a WordPress theme created by David Bushell, an all-round responsive designer and HTML, CSS, & JavaScript developer. You can follow him @dbushell.

Copyright © David Bushell

Navigation

  • Home
  • Updates
  • Features
  • Documentation
  • Developers
  • Download
return to top of page