Twenty Nineteen: the power of blocks

Hypotheses offers its users access to the graphic themes developed by WordPress teams in priority, to insure greater durability, consistency and long-term flexibility for the platform. Find all the graphic themes available in the “Appearance” category of the House of blogs.

After a break in 2018 to focus on developing and releasing the new text editor, WordPress teams unveiled their annual graphic theme for 2019: Twenty Nineteen.

Once the theme is activated from the Appearance > Themes menu in the administration interface of your blog, you will find its configuration options in the Appearance > Customize menu.

More than just compatible with the new text editor, which works by arranging blocks with one another, this graphic theme is truly built to work in conjunction with the block editor, with a particular style for each type of block: what will be built in the block editor will look almost exactly like what will be visible on the public interface.

If it is activated on a blog that does not yet have any content formatted with the block editor, Twenty Nineteen can confuse by its minimalism. Indeed, its customization interface only offers a few options. However, by experimenting with the possibilities offered by the blocks in the block editor, it is possible to achieve very interesting layouts with this graphic theme which perfectly exploits the block layout of articles and pages to offer an aerated and optimized display for accessibility, especially with sans-serif fonts of significant size for titles. This graphic theme only offers a default font, which should therefore be suitable for most users.

Image management

In the header customization options (Customize > Site Identity), it is possible to define a logo that will appear as a circle next to the title and subtitle of the blog (recommended size: 512x512px).

Logo placement on a blog using Twenty Nineteen

There is no possibility to add a header image that would stay on all the pages of the blog.  

The only way to get a header image on the homepage of the blog is to create a page, add as a “featured image” the image to add at the top of your blog’s homepage, then in Appearance > Customize > Homepage settings, check “A static page” and choose the created page. The static homepage is not recommended on Hypotheses, as it reflects less the activity of a blog, given that the reader cannot directly see the latest articles.

Static homepage with header image

However, an image featured on a static homepage will not remain at the top of the other pages and articles of the blog. Indeed, on each web page of an article or page, it is the featured image that will appear in this location. The recommended size for the featured images is 2000px wide by 1200px high. Think about optimization: prefer.jpg and a resolution of 96 DPI for a lighter image.

Colors

Navigation items, such as links and menu items, are colored blue by default (see screenshots above). The color can be changed in Customize > Colors. On an article page, the title of the article is placed on the featured image. The color defined in the graphic theme customization interface is applied by default as a filter on the featured images.

It is possible to remove the color filter on the featured image of the articles that appear in the article feeds like the homepage, by unchecking the “Apply a filter to highlighted images” checkbox in Customize > Colors. On the article page, the featured images are then applied a dark filter, to maintain the readability of the title.

Widget area

Twenty Nineteen has only one area where it is possible to insert widgets, just above the footer (no side columns possible). Widgets are placed one above the other on screens smaller than 1168px, if not in two columns.

Location of the widget area at the bottom of the page
Location of the widget area at the bottom of the page

Menus

Twenty Nineteen offers three possible locations for menus:

  •  A “main” navigation menu, horizontal, which is placed under the title and subtitle of the blog at the logo’s level;
  •  A footer menu, which is placed… in the footer of the blog. This menu cannot manage sub-menu items;
  •  A menu specific to social network icon links, which is located just below the “main” navigation menu.
Menu locations with Twenty Nineteen
Menu locations with Twenty Nineteen

To create the social networks menu, you need to create a menu composed of personalized links that are the URLs of the desired accounts on social networks. The graphic theme recognizes the social network by its URL and displays the corresponding clickable icon.

To learn more about this theme and its features, see Twenty Nineteen’s presentation in the Codex WordPress

You now have all the information you need to get started with Twenty Nineteen. If you have any questions about this topic and can’t find the answer in this post, don’t hesitate to contact the bloggers’ community (hypocommunity[at]groups.openedition.org), who will certainly be able to help you with the handling and use of your blog. If you are not subscribed to the list, send us a request to hypotheses[at]openedition.org.

Featured Image: Photo by Lance Anderson under Unsplash license

Cite this article as: "Twenty Nineteen: the power of blocks" from Marion Wesely. Published on The house of blogs, 25/01/2019. Link: https://houseofblogs.hypotheses.org/1114.

Marion Wesely

Chargée de l'accompagnement des communautés et de la valorisation des contenus d'Hypothèses / Community manager & communication officer for the Hypotheses platform (OpenEdition)

You may also like...

1 Response

  1. 14/05/2020

    […] wie das Theme Twenty Nineteen ist Twenty Twenty ganz darauf ausgerichtet, das volle Potential des Block-Editors auszuschöpfen. […]