Tempera FAQs

A. Legal

A1. Is the theme free?

A2. Is the theme released under GPL license?

A3. Can I remove the credit (powered by) text in the footer?

A4. But I really need to remove the link. I’m doing this site for my employer/company/grandmother and I have to. Is there no other way?

B. WordPress Functionality

C0. Pages? posts? presentation page?

Apparently you’re not accustomed to WordPress’ structure, so lets take this from the beginning…

Posts, pages, presentation page

WordPress allows you to display various… let’s call them areas, or sections.
In a particular area/section, you can display 1 ‘page‘, 1 ‘posts‘ or ‘a lists of posts‘ – a category (or archive). The pages and posts are the content you write/edit.

Also, the menu items (created automatically by WordPress or manually added by you) link to these areas/sections.

What users see when they get to your http://mydomain/ site is the ‘homepage‘. That’s just a particular area/section. WordPress lets you configure this to display either a ‘list of posts‘ (the default) or a ‘page‘ by using the Frontpage option in the Settings > Reading section.
The theme adds one more (invisible) feature here, allowing the display of the ‘presentation page‘ (not actually a ‘page‘ in the WordPress sense but a special theme area/section).

As plain obvious as this sounds – you can only set one of these to be the ‘homepage‘ at one time. Your users will only see one ‘homepage‘, what you configured it to be: the ‘list of posts‘, the ‘page‘, or the theme’s ‘presentation page‘. Note however that the theme’s presentation page will only replace the list of posts homepage when enable and never a static page.

If you set the theme to display the ‘presentation page‘ on the ‘homepage‘, obviously, the ‘list of posts‘ will not be visible anymore, but the presentation page itself includes a list of posts below its dedicated custom content (which can be turned on/off in the theme settings).

If you don’t want to display posts on the homepage at all but want them in another section, the theme takes care of this by providing another feature (described in the C17 question) with which you can create a ‘page‘ (note the term) which will ‘list posts‘. This is not the actual ‘list of posts‘ used by WordPress on its default homepage but rather a replacement provided by the theme.

Arranging the menu items

Now, to get to all these ‘pages‘, ‘posts‘ or ‘homepage‘ a visitor (or you) would need to know the actual links… and this would be crazy.

This is where ‘custom menus‘ come in. WordPress will automatically list all your ‘pages‘ in its main menu by default. But at many times this is not preferred or desired.

Using a custom menu you can add whichever ‘items‘ (buttons/links/elements) you want in your menu, each of those ‘items‘ linking to one area/section (‘page‘, ‘post‘, category or some other form of content) or external URL.

Now, as a custom case scenario, you’d probably want one an ‘item‘ (button/link/element) to point to your ‘homepage‘ (which in this particular case is set to be the ‘presentation page‘), one to point to your ‘lists of posts‘ custom ‘page‘, and perhaps others to link to other ‘pages‘.

And depending on what content you add to your ‘presentation page‘, the ‘homepage‘ will also point to various ‘post‘s and ‘page‘s around the site… (or none at all)

Best way for you to get accustomed to all this is to first use WordPress’ built-in functionality (and leave the presentation page disabled). Once you learn how various changes/edits you make in the backend affect your visible site, you can move up to using the theme’s more powerful options.

C9. How do I disable comment forms altogether?

We made a small tutorial about that, available here.

C18. How do I re-order / rename / re-arrange my menu items?

This is not really theme-related functionality. To (absolutely) control your menu and menu items, we recommend using a custom menu.

We wrote a small tutorial on using custom menus here.

C21. Translations? Multilanguage?

The theme is “translation ready“. This means it supports WordPress’ built-in translations functionality, allowing you to translate it into your own language without editing a single theme file. If someone was kind enough to send us a translation in your language, you may be lucky to find it already there. Otherwise see our “how to translate” part I & part II tutorials.

Multilanguage” is a different notion. It means your site will have its content in several languages at once, being accessible to readers in various native languages. A theme doesn’t need to support multilanguage content since this is not its job. This functionality is only provided in WordPress by additional plugins. The theme should be compatible with all multi-language plugins, however only some plugins are capable of translating the theme’s presentation page special fields:

(*) since Parabola 1.5.0 / Tempera 1.3.0 / Nirvana 1.1.0

If you find other plugins capable of supporting multi-language translations of the presentation page fields, do let us know.

C28. Something in my dashboard is not working (outside of theme settings)

Plugins and (active) themes can interfere with everything in the dashboard as well as site functionality, including each other.

Recently themes are better checked when approved (or updated)​​​​​​ but there are plugins that wreak havoc in a dashboard and yet they are in the repository. One can assume they got there before better checking rules were implemented. However even now plugins have a lot more freedom to add functionality, but also break existing functionality.

​​Whenever having issues in a dashboard, try to get WordPress down to the cleanest version (by deactivating everything you can), and then slowly build your way back to the desired functionality, checking for the reappearance of the issue(s) after every extension activation.

C. Theme Functionality

C1. I cannot change the layout in the Theme Settings?

First make sure you are using the latest WordPress and theme versions. If that doesn’t solve it, try a different browser (perhaps you’re using Internet Explorer?).

If nothing works, a plugin could be the culprit.

C2. How do I use a different font than the ones that are available with the theme?

If you need any other fonts beside what the theme and Google Fonts offer, you’ll have to do it yourself by editing files or using plugins.

C3. How do I remove the paragraph indent?

There’s an option to disable that in the theme settings > Text Settings section.

C4. My post titles and headers have extra padding or spacing. How do I remove that?

There’s an option to disable that in the theme settings > Text Settings section.

C5. I want to disable a background colour / What happens if I delete the colour code inside a colour input field?

If it’s a background color field – that area will become transparent.
If it’s a text color field – the default color for that text will be used (either browser default or inherited from parent HTML element).

C6. How do I hide page titles?

There’s an option to hide them in the theme settings > Graphics Settings section.

C7. How do I hide the “Comments are closed” or the “Comments off” texts?

There are options in the theme settings > Post Information Settings section to hide those.

C8. How do I hide the text under the comment form?

There’s an option in the theme settings > Post Information Settings section to hide that.

C10. How do I disable displaying posts on the presentation page?

There’s an option for that in the theme settings > Presentation Page.

C11. How do I use an image for the site header and also hide the site title & description?

You can set the site header via the Appearance > Header section. Just make sure your image is the proper size, otherwise it will be cropped or distorted.

The “Site Title” option under theme settings > Header Settings allows you to chose between the classic “Site title and description”, the custom “Site Logo” (which you can upload separately from the background header image), the specific “Clickable header image” and the basic “Empty” (nothing at all).

No matter if you chose to display the site title and description or not, still make sure the “Site Title” and “Tagline” fields are filled in under Settings > General, otherwise you will see a stray dash in the browser title. This is no longer the case in the latest theme versions.

If you do wish to hide the previously filled in site title and tagline from the site header area, just set the option to anything but “Site title and description” – logo (if you have one), clickable header (if you’ve set a header image) or empty will all do.

C12. How do I make the site’s header image clickable and link to the homepage?

You need to set the “Site Header” option to “Clickable header image” in the theme settings > Header Settings section.

C13. How do I set my own favicon?

You can upload and use your own custom favicon. The option is in theme settings > Header Settings.

Make sure you take into account browsers’ limitations concerning filetypes and caching (some browsers don’t display a changed favicon instantly).

C14. Can I edit the style.css file to my linking?

You can but you shouldn’t –  all theme files are replaced on updates (added files are removed). You should place simple custom CSS in the theme’s Custom CSS input field found in theme settings » Miscellaneous section.

For heavy modifications, consider using a child theme.

C15. How do I set different layouts / sidebars on different pages/posts/categories?

The theme has a specific way of controlling sidebars:

  • the Layout option in the theme settings sets the general layout structure for the entire site (this applies to all sections, including categories, homepage, specific post, page, tag, archive, author, so on.); the layout option provides 6 layouts:
  1. one column, no sidebars – will display only the content area
  2. two columns, sidebar on the left – will display content plus the left sidebar
  3. two columns, sidebar on the right – will display content plus the right sidebar
  4. two columns, sidebars on the left – will display content plus both sidebars on the left
  5. three columns, sidebars on the right – will display content plus both sidebars on the right
  6. three columns, sided – will display content plus a sidebar on each side of the content

* the general layout option should be set to the layout most (all) of the categories/posts should use

  • each page can use a separate layout structure, by using a specific page template for that page; the available options are the same as the ones available for the general layout option; when creating/editing a page select the desired page template from the page templates list on the right to make that particular page look differently than the general layout.

Notes: the presentation page does not display sidebars; also, there is no way to set specific categories / posts / tags / author / archives to use a different layout than the general one.

C16. How do I add more than 5 slides on the presentation page?

You can define up to 5 custom slides, but you can also set the slider to grab the slides from:

  • latests X posts
  • X random posts
  • latest X sticky posts
  • latest X posts from category
  • random X posts from category
  • specific posts (by ID)

where X is a configurable count.

To make slider compatible posts it is required to add a post featured image (which will be used as the slide image). Make sure the featured images are of proper size (the same one as the slider is configured). The post title and post excerpt will be used for the slide caption if defined.

C17. How do I use both the presentation page and the blog page?

pp-blog-setup-1To use both the theme’s Presentation Page and the blog page (like the default WordPress homepage) start by enabling the Presentation Page in the theme’s settings (if it is not), and setting your WordPress’ Reading settings to Latest Posts.

pp-blog-setup-2

Then create a new empty page and choose “Blog Template (Posts Page)” as this page’s template. Save and this page will now display your blog posts list. You can also add this page to your menu.

pp-blog-setup-3

C19. How do I add my own styling/CSS? What is that ‘custom CSS’ you’re talking about?

We recommend to never modify the theme’s style.css file, as you will lose any changes you make to it at the next update (or you are forced to never update, losing out on all the bugfixes, improvements, features and new bugs added 🙂 )

You could of course use a dedicated custom CSS plugin or even a child theme, but for short / simple CSS customizations we have created a special input field right in theme’s settings page. You’ll find it by going to Appearance > Theme Settings, then expanding the Miscellaneous Section by clicking on it. The Custom CSS field is a bit further down. (View screenshot)

As an extra feature, you can also type in your own custom JavaScript code (like Google Analytics or other JS you need to load in your header) into the field right below, titled Custom JavaScript.

If you don’t know what CSS is, we recommend starting here.

C20. I want to add my own HTML to the presentation page / Why is my custom HTML stripped?

The theme uses WordPress’ built-in sanitation function to strip potentially harmful HTML data. Each field in the settings uses the wp_kses_data() function to sanitize user inputed content. (WordPress Codex has a good explanation concerning sanitation usage)

This is required for the theme to achieve approval by the WordPress theme reviewing team.

For a list of (default) accepted HTML tags and attributes, see the header of WordPress’ kses.php file.

This default behaviour can be overridden using plugins, theme or WordPress modding.

As far as modding the theme is concerned, you can edit the theme/admin/sanitize.php file and inside the [..]_options_validate() function you can remove the wp_kses_data() processing on every field you wish to remove the sanitation from (the field names are pretty much self explanatory).

Keep in mind these changes can affect your WordPress security.

Note: The presentation page columns and the 2 text areas below support shortcodes. The two titles above and below the slider do not.

Note 2: These instructions do not directly apply to Nirvana, which uses a differently structured sanitization code.

C22. My site is missing all/most of the colours / My site lost colours after modifying theme settings

This is most likely caused by a poorly written plugin that is loading it’s functionality on top of the theme’s own code.
First off, navigate and click on one of the theme’s colour fields – notice if two colour selectors pop up instead of one. If the answer is yes, then you will need to figure out the problematic plugin (by switching all plugins on/off) and disable it.
Secondly, check that all the colour fields have the leading ‘#’. If not, add it back where it’s missing and save settings. If the # sign is removed after the save, this may also be caused by a plugin. Switch all plugins off/on to check for the culprit and disable it.

C23. How can I center my menu?

You’ll find the left / right / center menu alignment option under Graphics Settings.

C24. How do I add another social icon?

See question E4 for theme specific information.

C26. Twitter/Google/Facebook/insert-social-service-here does not grab or grabs incorrect images from my site

Are you using one of our themes and Twitter/Google+/Facebook/insert-social-site-here grab the wrong featured image from your site (or don’t grab an image at all)?

Most social services use something called OpenGraph to grab content from your site. This is how they know to read the correct title, text and featured image from your posts. And when they don’t find this data they try to parse the source of your site and grab whatever they believe is relevant (such as the first image, even when it may not be relevant to the actual post).

We’ve considered adding code in your themes for serving OpenGraph data, but this is a grey area as far as WordPress rules are concerned. To receive approval into the WordPress directory, among other things a theme should NOT integrate plugin functionality.

Fortunately, this functionality is already included in existing plugins, one of which we found to work perfectly with our themes – WordPress SEO by Yoast – which we highly recommend (even though they pay us no money 😉 )

 

C27. The themes settings page doesn’t work / sections do not open / buttons do not work / “problem with your WordPress jQuery library” message

If the settings page is empty and all you see are the Reset and Save buttons (and the boxes on the right), see question C29 below.

If you see the settings section titles, but they fail to open on click, this means JavaScript is failing in your dashboard (at least on the theme settings page).

Start by making sure you are using the latest WordPress and theme versions.

If that is true, then this issue is usually caused by a poorly written written plugin that load their resources over the entire dashboard (instead of only where they are needed) and cause conflicts with scripts used by the theme.

One way to solving this is to use the browser’s development tools (most activate them by pressing F12). These tools can be used to look for JavaScript errors (that may point out the exact files that cause the issue, pinpointing the bad plugin).

If this method is complicated or the development tools show no errors (or point to files that cannot cause issues, like WordPress’ on script files), then the alternative is to disable all plugins and check if the settings page starts working / returns to working condition.

Then re-enable the used plugins one by one and re-check the theme’s settings page until the issue re-appears. That will indicate that the last enabled plugins is the issue.

The only solutions are to either contact the plugin author and nicely ask him/her to correct the behaviour and load plugin resources only where they are needed, stop using the plugin or disable it every time you need to use theme settings. There’s nothing we can do about this as a theme cannot affect plugins’ functionality.

C29. The theme settings page is all empty except the Reset and Save buttons

As we have announced in this post, WordPress 4.4 brought some changes to the settings page HTML structure that interfere with our themes’ settings page. Since this change came at the same time Customizer-based options became mandatory for theme updates, we had no solution for fixing this issue with a theme update while at the same time keeping the settings page intact.

So we’ve devised an alternative solution for older theme versions and implemented it in the settings plugin. To restore the settings page to a functional state, install the Cryout Serious Theme Settings plugin in your WordPress. Once activated, the theme’s settings page will return to working condition.

This solution for valid for all our settings-page based themes, the plugin needing to be installed only once no matter which of our themes you use (or switch to in the future)

D. Updates

D1. Are my hard-worked settings kept during an update?

Theme settings (together with the Custom CSS and Custom JS field contents) are kept during updates.
File modifications (changes to style.css, to theme files or newly added files) in the theme folder are lost on update (this is default WordPress behaviour).

Consider using the custom CSS / JS fields or resorting to child themes for your extra customizations.

Important note: Since you can never have enough backups – and just to be on the safe side – use the Export Settings button (in theme settings) to save a complete backup of all theme settings before updating.

D4. I just updated and all my customizations are gone. How do I get them back?

Unfortunately, you should have used the “Custom CSS” field, a custom CSS plugin, or a child theme to make your changes. Any changes done directly on the theme files (style.css, js files or php files) are lost after an update. This is default WordPress behaviour and cannot be changed.

Theme settings, including the contents of the “Custom CSS” field, are kept between updates.

The only way to get your customizations back is to grab the files out of a backup. If you do not have a backup, then you’re out of luck. Sorry!

E. Specific Functionality

E1. What browsers does Tempera work on?

Tempera is a CSS3 based theme. Because of this, only the current (last 3 years) versions of the browsers are supported: Firefox 4+, Chrome 7+, Opera 10+, Safari 5+ and Internet Explorer 10+.
Older versions, although they may display the theme almost correctly, are not officially supported.

Mobile browsers are all CSS3 capable and they will display the theme correctly.

E2. Is Tempera responsive?

Tempera is responsive on all browsers (when responsiveness is turn on in the settings).

E3. What version(s) of WordPress is Tempera compatible with?

WordPress at least version 3.5 is recommended for Tempera.

Older versions are not guaranteed to work correctly.

E4. How to add another social icon in Tempera?

Extra social icons can be added or existing social icons images can be changed using a child theme.

0. Download the sample extra socials child theme – [for v1.6.0 and newer] or [for v0.9 to v1.5.2].

1. Find an image for you new social that fits in with the existing icons you will be using. Use the provided NewSocials.psd to match the layout and shadow. Create a 26×26 pixels transparent PNG for it. Place that image as tempera-extrasocials/images/socials/YourIcon.png

2. Edit the provided functions.php file to define/rename your new social icon(s). Your new social icon(s) will then appear in Tempera’s settings page (Appearance > Tempera Settings) and once you enable it (them) also on the website.

3. Install the child theme via WordPress or manually upload the tempera-extrasocials folder to your wp-content/themes site’s folder. Using a child theme makes sure you will not lose your changes on theme updates. Use it as the basis for all your future customization or merge the contents of the functions.php file (and the images folder) with your existing child theme.

4. Activate the new child theme in Appearance > Themes. As you theoretically changed themes, you will need to re-assign the following things (if they were previously set): background image, header image, menu(s) association(s).

PS: You can add one, several or no social icons.

PS2: You can use the child theme to only replace the social icons images, by adding all your custom images in the tempera-extrasocials/images/socials/ folder (using exactly the same name as the originals).

E5. Is Tempera compatible with WooCommerce?

Since version 1.3.0, Tempera includes built-in support for WooCommerce and the compatibility child theme is no longer needed. It you’re still using an older version you should update (or can still use the compatibility child theme).

WooCommerce sections will use the configured layout (sidebar placement) by default. You can override the behaviour of individual pages (Checkout, Cart, Account) by defining a specific layout page template on that page.

E6. How do I edit the 6 front page columns to add my own content?

What you see there by default is just sample content to demonstrate how the Presentation Page columns look like. It cannot be edited.

However this sample content will automatically disappear as soon as you start adding your own stuff. Read our dedicated tutorial about how to add content to the theme’s columns.

E7. Is Tempera compatible with multilanguage plugins?

Tempera has always been compatible with qTranslate X. For the Presentation Page texts you can use its short tags feature.

Support for Polylang / WPML has been added since version 1.3.0. Presentation Page’s texts can be translated via the plugins’ Strings feature. With WPML, you can use the WPML Widgets plugin to easily translate the theme’s columns widgets.

If you’ve used Tempera with other multilanguage plugins and it works, let us know so we add them to the list. If they didn’t work, let us know so we test things out and look for a solution.

300 Comments

  1. Hi Zed,
    I really like Tempera… but there’s always something one wants to change.
    how can I change position (from right to left) and size of the textbox in the slider?

    (photo/video)-galleries are something I need, anything (plugin etc.) you would recommend using within Tempera?

    thanx in advance,
    Wolf

  2. Amazing! It is solved!

    Settings>Discussions> “Jetpack Comments” > Color scheme> From Dark to Light

    I lost many subscribers during at least the last 16 months because I did not did the above little trick! It took me little than 15 seconds!

    I really appreciate your efforts. I would definitely continue using this great theme and would definitely too recommend it.

    All respect!

  3. Thank you very much for your reply. To continue like this is a great disadvantage for my blog. Most commenters post comment without being able to subscribe to the comments, simply because they cannot read the texts telling them to subscribe to the comment *Notify me of follow-up comments via email.** Notify me of new posts via email.).

    Isn’t there a solution? A black or a darck background for the whole blog is very unbeautiful for my blog. I would appreciate any possible hint.

    Thank you for your time and again for this great theme.

  4. Hello,

    Firstly, thank you for this great theme. I am using it now for almost a year and would definitely continue using it despite the great disadvntage that I am having because of the texts below the comments boxes. I mean these texts:

    Notify me of follow-up comments via email.
    Notify me of new posts via email.

    These texts do not appear because they have a white color, just like the Blog’s background. Example page in my Blog: http://amanfrommoab.com/2014/08/30/easy-pass-telc-b2-c1-medical-exam-judge/

    I posted this question in your blog on 30.08.2015. You thankfully replied on 06.09.2014 with the following suggestion:

    “Jetpack has two colour schemes, one light and one dark. You currently using the dark one, try switching to the light one.”

    Unfortunately, I did not read your reply because I either did not get a notification of it or because I simply missed the notification. Anyhow. Last week, I read your reply (by changce as I was searching again for a solution to the problem and I landed in the page where I left that question and you answered me). I tried changing the colour scheme and the texts appeared. However, I should have a dark background in order for the texts to appear. A dark background does not work with my blog and it makes it very ugly. Therefore, I cannot but continue with the following great white color scheme that I have. The solution is simple. If the users could change the color these texts to black or another color that would appear on a white background. Or if we could change the background color only behind these texts.

    Could you kindly help me? I would buy you two cups of a coffee!

    Thank you very much.

    1. Those texts colour is part of Jetpack’s styling, which the theme has no control over.
      And since Jetpack’s form is loaded via an iframe, custom CSS has no effect on it.

    1. The theme uses the exact same font (family) and colours no matter the device it is viewed on. The only things that change are various sizes (including font size).

  5. Hello,

    I love the theme, but I have a small issue. On the presentation page, I have the “Show Posts on Presentation Page” set to Enabled. When I view my site, there is a pagination control under the 2 posts. The pagination control does no work. Regardless of what button you click, it still shows the same posts. Can you please give me some ideas where to troubleshoot?

  6. I just downloaded the theme and love it so far.
    Since I’m still a relative Newbie, please excuse the general question, but how do I change the bottom section: Fully responsive, Responsive, etc…
    I’d like to replace the text and graphics in those boxes, but not sure how to do that. Could someone point me in the right direction? Thank you so much!

  7. Hi Zed,
    I am using the Tempera theme right now but I want to add a right side bar. Is it possible ?
    And if is it possible how to disable it for the home page ?
    Thank you

    1. The presentation page is a special purpose section and does not by design display sidebar(s).
      For the rest of the site, sidebars are controlled via the Layout option.

  8. Hi there Zed,

    Thanks for such an awesome theme! 🙂 I have two questions relating to my blog which uses Tempera: http://www.eagerjourneys.com

    1. The slider keeps changing dimensions to ‘fit’ my featured images. Does that mean I have to go back to all of my featured images and resize them to a standard size? If so, what size should I resize them to?

    OR Is there a default way just to make the slider a certain dimension and allow the photos to slide in (no matter if they are landscape or portrait) and without changing all of their dimensions?

    2. Do you have a more detailed guide/breakdown to the color settings please? I’ve been fiddling around with them for hours and can’t get them right. I’m specifically having trouble with the “subscribe” widget on the top right of my header. I want the text on the background to be white and when I hover over the subscribe comment box I want it to be white too not dark grey as then you can’t see what you are typing.

    Thank you very much for your assistance. 🙂

    1. 1. If you’re using post-generated slides, the featured images need to be the exact size of the slider to avoid weird animation distorsions.

      2. The colours pretty much cover the areas they are named for, so we don’t have a more detailed guide on them.
      However theme colour options may not apply to all custom widgets, as plugins are able to include their own styling.

      1. Thanks so much for your very timely response Zed. Yes, I am using post-generated images, so I guess I will have to resize them all accordingly. Please advise on the dimensions (width and height) of the slider.

        I see, it must be a Jetpack header widget option then with regards to the colours that I can’t seem to get right — thanks again! 🙂