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
<

28. Child Themes

A child theme inherits the functionality of the parent theme and allows you to modify the styling, the layout ... of the parent theme to any extent without editing the files of the parent theme itself. Without a child theme, when you update the Dottoro Theme, your changes will be overwritten and lost. Therefore, if you plan to modify your theme, it is highly recommended to use a child theme.

How to install:

1 Download our demo child theme.
2 Log in to your WordPress dashboard and navigate to Themes / Install Themes / upload. Upload the downloaded file, install and activate it.
3 You are done. Now you can get to work and make changes in your child theme.
We use this child theme on our demo site. The style.css file of the demo child theme contains several CSS rules responsible for the responsive design. These CSS rules give you a good basis to create your own responsive design based on the content of your website. For further details, please read the Responsive Design section.

Important Changes in Dottoro Theme 1.13

Prior to version 1.13, the Dottoro theme loads the style.css file of a child theme as standard in WordPress. It means if a child theme is used, the theme only loads the style.css file of the child theme and if you want to load the stylesheet of the Dottoro theme, you have to import it (@import rule).
The main drawback of this mechanism is that every time the Dottoro theme is updated you have to change the version number in the @import rule manually (?ver=...) to ensure that your visitors get the latest stylesheet of the Dottoro theme. If you forget to modify the version number, the browsers of your returning visitors won't download the latest version of the theme's style.css file so your website will not appear properly.

To solve this problem, the loading mechanism of stylesheets has been changed in version 1.13.
Dottoro theme from version 1.13 loads both the style.css file of theme and the style.css file of the child theme in the following order:

In addition, the URL pointing to the style.css file of the theme ends with the version number of the theme (style.css?ver=...), the URL pointing to the style.css file of the child theme ends with the last modified timestamp of the file. So you don't need to worry about browser caching issues neither on theme updates nor when you modify the content of your child theme's style.css file.

To avoid duplicated stylesheets, please remove the @import rule from the style.css file of your child theme that loads the style.css file of the Dottoro theme:
@import url("../dottoro/style.css?ver=...");