Dottoro Theme Documentation

Tutorial to get your theme to work

PrologueFirst StepsFront PageCreating a custom front pageBlog, News and Portfolio post typesPost Type specific settingsGeneral settingsSingle post settingsCategory / Tag / Date archive page settingsPermalink settingsOptions on single post pagesGeneral page optionsImage optionsGallery settingsPage Templates and PagesPage SettingsPage TemplatesPages created from page templatesGeneral page settingsGallery settingsBlog page settingsNews page settingsPortfolio and Imagefolio page settingsContact page settingsArchives page settingsAuthors page settingsBoomarks page settingsSitemap page settingsSpecial pagesCategory and tag page settingsArchive and date page settingsSearch page settingsAuthor page settings404 page settingsHeader and MenuSubheadersSubheader specific shortcodesPredefined SubheadersCreating SubheadersAssigning subheaders to pagesFooterWidgets in the FooterCopyright and other notices in the FooterSidebarWidgets on the SidebarWidth and alignment of the sidebarWidget AreasWidgetsBreadcrumbShortcodesShortcodes In Alphabetical OrderShortcodes By CategoriesNested ShortcodesPost TemplatesOverlaysMedia and External MediaOverview of galleries, gallery listings and slideshowsGalleries and Gallery ListingsAbout Galleries In GeneralCreating And Managing Galleries[gallery_list] shortcodeSlideshows and Popup SlideshowsSlideshowsPopup SlideshowsSlideshow SettingsMost Often Used Slideshow OptionsAll Slideshow OptionsSlideshow Templates - Slideshow Specific ShortcodesStyling Guide For SlideshowsStyling Of Slideshow and Post TemplatesSlidesPopupsSelectorsWeb FontsGeneral Theme SettingsUser RolesExport / Import SettingsCreating theme designsLocalizationHeadingsChild ThemesCSS ClassesResponsive DesignCSS Extension JavaScript ToolkitJavaScript LibraryAction HooksFilter HooksCompatibility Issues
<

6. Subheaders

Tip: Check out our video tutorial on Subheaders.
The Subheaders menu has been moved to the Headers menu in version 1.41.

The Dottoro Theme provides an extremely flexible support for creating subheaders. There are a couple of ready-made subheaders you can choose from and you can also create custom ones. The contents of custom subheaders can be edited the same way as the contents of pages and posts. You can also use shortcodes in them.

6.1 Subheader specific shortcodes

Subheaders often contain information about the page (title, teaser). The [subheader_title] and [subheader_teaser] subheader specific shortcodes are intended to make it easier for you to display these information. Thus you don't need to create different subheaders for different pages because you want to display the title/teaser of the page in the subheader. The [subheader_title] and [subheader_teaser] shortcodes do not support any attributes; the following attribute is supported only for the 6 nested shortcodes: On the basis on the above described, [subheader_title] and [subheader_teaser] shortcodes may seem unnecessary since titles and teasers are displayed by the nested shortcodes. The [subheader_title] and [subheader_teaser] shortcodes, however, they have other, as yet unmentioned properties as well. In most cases, titles and teaser need to be displayed in heading tags in the subheader (<h2>title</h2>, <h4>teaser</h4>). But if a page has no title or teaser, it is practical not to display the formatting HTML tags either, because empty formatting tags take up unnecessary space in the subheader. That is why the [subheader_title] and [subheader_teaser] shortcodes are needed; if the nested shortcodes don't display any content, they will also not display any content.

6.2 Predefined Subheaders

Tip: The content of predefined subheaders can be seen under Headers » Built-in Subheaders.

Dottoro Theme comes with a number of predefined subheaders designed to meet the most frequent needs. Predefined subheaders contain subheader specific shortcodes introduced in the previous section. To fully understand predefined subheaders we recommend you reading the previous section as well.

In that case if predefined subheaders don't meet your expectations, you can always create custom subheaders. The predefined subheaders give you a good basis to create your own subheaders. For further details, please see the Creating Subheaders section.

Details of predefined subheaders:
Name Source
Own This subheader displays the page title and teaser under each other on the left.
<div class="dottoro_subheader_own simple subheader_padding">
[subheader_title]<h2 class="subheader_title">[own_title /]</h2>[/subheader_title]
[subheader_teaser]<span class="subheader_teaser">[own_teaser /]</span>[/subheader_teaser]
</div>
Own 2 Cols The subheader displays the page title and teaser side by side; the title on the left, the teaser on the right.
<div class="dottoro_subheader_own simple subheader_padding">
[row]
	[col2]
		[subheader_title]<h2 class="subheader_title">[own_title /]</h2>[/subheader_title]
	[/col2]
	[col2]
		[subheader_teaser]<span class="subheader_teaser">[own_teaser /]</span>[/subheader_teaser]
	[/col2]
[/row]
</div>
Category This subheader displays the title (category name) and teaser (category description) of the category page assigned to the page under each other on the left. You can use this subheader on single post pages to display information about the category the post belongs to in the subheader.
<div class="dottoro_subheader_category simple subheader_padding">
[subheader_title]<h2 class="subheader_title">[category_title /]</h2>[/subheader_title]
[subheader_teaser]<span class="subheader_teaser">[category_teaser /]</span>[/subheader_teaser]
</div>
Category 2 Cols Similarly to the 'category' subheader it displays the category page title and teaser, but the title and teaser appear side by side; the title on the left, the teaser on the right.
<div class="dottoro_subheader_category simple subheader_padding">
[row]
	[col2]
		[subheader_title]<h2 class="subheader_title">[category_title /]</h2>[/subheader_title]
	[/col2]
	[col2]
		[subheader_teaser]<span class="subheader_teaser">[category_teaser /]</span>[/subheader_teaser]
	[/col2]
[/row]
</div>
Matching Page This subheader displays the title of the closest matching post list page. You can use this shortcode on single post pages and also on category, tag and date archive pages. The closest matching page will be selected according to criteria set in Page Priority options. Use this subheader if your website contains multiple list pages in the same post type and you would like the subheaders of single post pages to correspond to the subheader of the list pages the post is displayed on.
<div class="dottoro_subheader_matching simple subheader_padding">
[subheader_title]<h2 class="subheader_title">[matching_title /]</h2>[/subheader_title]
[subheader_teaser]<span class="subheader_teaser">[matching_teaser /]</span>[/subheader_teaser]
</div>
Matching Page 2 Cols Similarly to the 'matching page' subheader it displays the closest matching page title and teaser, but the title and teaser appear side by side; the title on the left, the teaser on the right.
<div class="dottoro_subheader_matching simple subheader_padding">
[row]
	[col2]
		[subheader_title]<h2 class="subheader_title">[matching_title /]</h2>[/subheader_title]
	[/col2]
	[col2]
		[subheader_teaser]<span class="subheader_teaser">[matching_teaser /]</span>[/subheader_teaser]
	[/col2]
[/row]
</div>

6.3 Creating Subheaders

Custom subheaders can be created and managed under Headers » Subheaders.

To create a custom subheader:

1 Click 'Add New' at the top of the page.
2 Enter the name of the subheader. Always use a unique name for each subheader, so you can identify it later.
3 Create the content of the subheader. The contents of the subheaders can be edited the same way as the contents of your pages and posts. Subheaders can contain shortcodes; e.g. with the [widget_area] shortcode you can place widgets inside the content of subheaders.
Subheaders often contain information about the page (title, teaser). You can display this information with the [subheader_title] and [subheader_teaser] shortcodes.
4 After creating the content, click 'Publish'.

Additional steps:

6.4 Assigning subheaders to pages

The Subheader option under Theme Options » General » Header allows you to select a subheader for the whole website. This will be the default subheader for all pages and posts on your site.
This setting can be overridden
Tip: Selectors allow you to target posts and pages according to their attributes, such as post type, post format, categories and tags, authors, etc. For instance, you can select a subheader for posts from a certain category on the Advanced tab in the "Single Post Settings" section under Posts » Post Settings. So you don't need to change the subheader of posts one by one and you also don't need to change the subheader every time you create a new post. For further details, please see Selectors.