Switching to Twenty Fourteen

As Delphine Cavallo explained in the last post on the House of blogs, it’s time to update the appearance of the blogs on Hypotheses. We are now offering you four themes developed by WordPress, and this will make our blogs more stable, aesthetically coherent and flexible in the long term.

These four new themes are in responsive design, which means that the way they are displayed changes depending on the size and type of screen, which is a real advantage, especially when it comes to reading on smartphones and tablets.

The new themes are:

Some bloggers have already chosen to use Twenty Fourteen. Here are two examples:

Among the four new themes, Twenty Fourteen, with its slider and grid-style post display, most closely resembles the magazine format. It allows you to feature your most relevant posts on the homepage. It is also the most visually rich theme offered by the platform. This is an advantage if you have time to choose illustrations, though it can be time-consuming, especially if you are a lone blogger, in which case the graphic potential of the theme can be quickly lost.

twenty-fourteen-grille

If you would prefer to use the time you have for your blog on other things than its visual appearance, we advise you to opt for one of the more sober themes, either Twenty Eleven or Twenty Twelve.

You can also read Karim Hammou’s post (in French) to get an idea of how to use and configure Twenty Fourteen.

General points

The first thing to configure is your banner. If you have just changed theme, you may be disappointed: the banner you used on your old theme will not have been automatically conserved.

You therefore have to go to the Appearance > Header menu and choose a new banner by clicking on “Choose a file” (cf. red box, image 1), or retrieve an image already used on the blog (for example, the old banner) by clicking on “Choose image” (cf. green box, image 1). As always when publishing an image on your blog, check you have the necessary rights to reproduce the image before publishing it in your banner, and provide credits for the image on you blog’s “Credits” page.

ajouter-bandeau
Image 1

Menus

By default, this theme has a single menu composed of your blog’s different pages and subpages. It is located at the top of the page, just underneath the banner. The menu is right-justified.

menu

Creating a menu

It is possible to customize the menu. To do this, go to Appearance > Menus.

Start by giving your menu a name in the “Menu Name” field, then click “Create Menu”. You can then select the pages, categories and also the links you wish to add to the menu from the left column. You can change the order of the menu and/or create sub-menus by dragging and dropping the different items. Don’t forget to click “Save Menu” after each change.

Once you have created the menu, go to the “Manage Locations” tab. You can assign where your menu is displayed to one of two zones: the “Top primary menu” or the “Secondary menu in left sidebar”.

The “Top primary menu” is located just underneath your blog’s banner (red box, image 2), while the “Secondary menu in left sidebar” (left box, image 2) is located on the left-hand side of your blog.

2menus
Image 2

Featuring posts on the homepage

This is obviously the main advantage of the Twenty Fourteen theme: visually featuring several posts on your blog’s homepage. But, as mentioned above, this option is time-consuming and, if used too hastily, can make your blog less visually attractive. After this word of warning, let’s now turn to setting up the theme.

diaporama

The principle is simple: if a post is indexed with a certain keyword (by default, the keyword “featured”), it will be displayed on the homepage.

The grid is the default display for posts. To choose between a grid and slider display, go to the menu Appearance > Customize. This allows you configure the theme more precisely. A configuration menu can be seen on the left. On the right you can visualize configuration changes in real time. If you click on the “Featured Content” menu, you will be able to choose between “Grid” or “Slider”. The “Tag name” field allows you to specify the keyword that will be used to showcase a post (the default keyword is “featured”).

Once you have chosen these settings, the latest posts indexed with the chosen keyword will be automatically displayed in the featured content area of your blog (“Grid” or “Slider”). Please note that these posts will no longer appear in the general thread of posts published on your blog. To include them in the thread and delete them from the featured posts in the slider or grid, simple delete the keyword “featured” (or the keyword you have chosen) from the keywords of each post in question.

All that now remains is to illustrate the posts to give some life to the homepage. To do this, go to the edit page of each featured post, and give it a featured image by clicking on “Set featured image” (see red box, image 3).

image-une
Image 3

To optimize visual quality, pay attention to the size of the image you use.

entete-billet

If you choose the “Grid” option, this image should ideally be 672 x 372 pixels. If you choose the “Slider” option, it should be 1038 x 192 pixels to be displayed correctly. Karim Hammou has provided a visual summary of the different featured image sizes supported by Twenty Fourteen:

Les trois tailles auxquelles sont utilisées les « Images à la une » dans Twenty Fourteen - (Karim Hammou, Creative Commons by-nc-nd)
The three sizes used for featured images on Twenty Fourteen – Karim Hammou, Creative Commons by-nc-nd

Widgets

Twenty Fourteen provides three widget areas:

  • a primary sidebar (on the left) (red box on the screenshots below);
  • a right sidebar, curiously named “Content Sidebar” in the backspace (green box on the screenshots below);
  • a “Footer Widget Area” (blue box on the screenshots below).

widgets-lateraux-publicwidgets-pdp-public

When you change theme, the widgets you used before will be deactivated. But don’t worry, you won’t have to reconfigure all those widgets: they will appear in the “Inactive Widgets” area. You simply need to drag and drop them in the sidebars and footer area to reactivate them.

There you go – you now have all the information you need to switch to Twenty Fourteen. If you have any questions, just leave a comment here or on the hypocommunity list.

We hope you enjoy getting to know Twenty Fourteen!

 

Featured image: Fourteen by Mark Gaw (licence: Creative Commons by-nc)

This post is a translation of this one, by Helen Tomlinson.

See you soon on Hypotheses!


Leave a Reply

Your email address will not be published. Required fields are marked *