New Rank Math table of contents block


The 1.0.104 update of the Rank Math plugin, in its free version of 19 December, adds a new table of contents block and it was about time.

New Rank Math table of contents block

This functionality, very useful for the reader and beneficial for SEO purposes, until now had to be added with a dedicated plugin like Simple TOC or similar. Although it could be achieved without a plugin, it was cumbersome and did not work in all cases.

As in this house we are lovers of WPO and therefore only use plugins strictly necessary and only when there is no other choice because there is no alternative to recreate the same function with pure code, Rank Math integrates the tables of contents is good news. Today we uninstall a plugin that was only for tables of contents.

Rank Math is still a relatively lightweight plugin because it is modular and you can deactivate everything you don’t need. In addition, you can always rely on the Perfmatters Script Manager to further control what loads at each point.

The new block doesn’t have much mystery because its configuration possibilities are just the right ones and I like that because it indicates that it doesn’t “fatten” Rank Math. It can be added like any other block by creating a reusable one, which will use the general configuration, or by adding a simple one if you need it to have different parameters only for specific inputs.

New Rank Math table of contents block
General configuration

There are no concessions for a lot of aesthetic flourishes. If you want to format it differently, you’ll have to use CSS.

New Rank Math table of contents block

From the block settings in the editor you can set the title wrapper of the table, the size and colour of the links and the background. Under “dimensions” are the settings to fine-tune padding and margins.

New Rank Math table of contents block

Another thing the block allows you to do is to edit the anchor text that is automatically added to the header links in case you want to point it to another part of the text. This is done with the green button, with the red button you hide those headings that you don’t want to be shown.

New Rank Math table of contents block

There is no possibility to add tables automatically according to the type of headings of your posts, although in the support forum they assure that they will continue to improve it and do not rule out including this function later. This may be its weakest point, because if you have many tables already added with another plugin you will have to replace them by hand.

However, it’s not all bad news. The tables you have added using Yoast o AIOSEO you can import them when you set up Rank Math for the first time using the setup wizard. Rank Math will automatically import all those blocks. Or you can always do it after installation from the Rank Math / Status and tools / Database tools menu.

Problems with GeneratePress

As everything couldn’t be pretty, the first thing I encountered were problems using the block in GeneratePress. The “Dimensions” settings box was not displayed. This happens because in some templates it is disabled by default and requires to be enabled in the theme by declaring support

To get it back you need to add the following snippet to GeneratePress.

add_theme_support( 'custom-spacing' );

Adding padding showed the changes on the back end, but not on the front end and the margin settings box doesn’t appear either. I also couldn’t get it to work inside a GenerateBlocks container for formatting.

The solution to this is to resort to CSS to make the tables a bit more presentable and put the border and the little shadow they had. Here it is in case someone is in the same situation

.wp-block-rank-math-toc-block {
    --wp--preset--spacing--50: 15px;
    --wp--preset--preset--spacing--20: 5px;
    margin-bottom: 15px;
    border: 1px solid;
    border-radius: 20px;
    box-shadow: 5px 5px 10px 10px 0 rgba(0,0,0,0,0.1);

All of this is much better explained in this thread on the awesome GeneratePress support forum, which is also where I got that CSS to clone the primitive look of the tables.

This is what I’ll be using while I wait for Gutenberg to finish combing their native block and add it to WordPress core.

More info about tables of contents at Rank Math.

This article contains some affiliate links.

Suscríbete por email para recibir las viñetas y los artículos completos y sin publicidad
Artículos relacionados

Este blog se aloja en LucusHost

LucusHost, el mejor hosting

Grandes personan que patrocinan.


Recibe contenido extra y adelantos desde sólo un dolarcito al mes como ya hacen estos amables lectores:

César D. Rodas - Jorge Zamuz - David Jubete Rafa Morata - Sasha Pardo - Ángel Mentor - Jorge Ariño - Vlad SabouPedro - Álvaro RGV - Araq