In this article we will explain the importance of having a summary or index in all your articles and posts on your website. We will also explain how you can create your summary in WordPress itself or in HTML. Let's start with a summary:
That's exactly how I summarize my articles on WordPress. Manually and without plugins, I can use any words and IDs I want. All of this in the articles I want, without weighing WordPress with hundreds of plugins.
What is an index or summary?
In the article or post, these are internal anchor links that redirect the reader directly to a subtitle (usually H2) of your post. This can mean that he doesn't spend a lot of time reading 2,000-word articles or that he has several different subjects in a single post.
In terms of the word in general, an index is a list of words that can be organized in alphabetical, systematic, chronological, numerical or alphanumeric order.
An index is the same as an indicator, sign, or symptom, a reference factor that serves to compare or explain a certain situation or conditions, also indicating their respective pages in a book or a list of things.
The table of contents is a list that appears at the beginning of the article, [monograph, book etc.] with all the chapters of the work. Table of contents is the enumeration of the main divisions, sections of other documents, in the order in which the subject follows, thus being a quick, simple, synthetic, and concise summary.
Translating, both are the same, but I personally prefer to call it summary. Some people probably searched for indexes on WordPress, others searched for summary and some even for anchor links.
The main reason why I use both expressions in this article, is exactly to improve the position and ranking in Google and to reach more people. In fact, this is an objective of using summaries and indexes in articles.
The importance of anchor links and an index
Anchor links are any link that takes you to a section of your page or even to another page on the site. They are of great importance and should not be ignored in any way, if you want to stand out from the competition.
Summaries and indexes are very important in an article or post. This is because the anchor links make it easier for you to rank your article and even allow it to appear more often in alternative keywords.
That way, always add a summary to your article in order to improve SEO. I do this manually, many use plugins, but I believe that manually allows me to better customize the IDs of the anchor links.
How should an index with anchor links be?
The indexes need to be listed in a block that stands out, with a different background color and with a bold title (I use the Preformatted block). The summary list can be ordered with a dash [-] followed by the theme that will have the anchor link.
You may or may not make the list of subjects in the table of contents with the same words as the subtitle. I sometimes prefer to vary the index and subtitle H2 a little. I try to vary with different words so that the text is more likely to be found on Google.
Anchors are links that start with [#] which indicates that the path is within the page itself. Some have the habit of placing random anchor links with numbers or words having nothing to do with the subject of the subtitle.
We must remember that even if it is an anchor [#example], it is important that it contains keywords to better position yourself on google and other search engines. So never use numbers or random things on your anchors.
Have you ever noticed that in icons a link is represented by a chain? Is the anchor literally represented by an anchor? Simply translated, anchor is the end of the chain or the final destination of the link that is established somewhere.
What are the problems with indexing your article?
Although it is very advantageous for your website's SEO and ranking, an index can make the reader jump directly to the desired part, spending less time on your site and seeing less ads. It may or may not affect your bounce rate and CPC.
Indexes in articles and posts with few words can also seem strange. I usually use indexes with anchor links in articles with more than 800 words and more than 3 H2 subtitles.
If you do this manually, the automatically generated IDs do not pass the same authority as a manually made ID. Doing it manually allows you to add custom anchors and lessens the chance that google considers it a bad thing.
How to make an index in HTML
Before the new version of WordPress with Gutenberg editor, we needed to manually use the HTML code to make the summary with anchor links. Nowadays this has become easier thanks to the new Gutenberg editor.
Even so I will explain in detail how anchor links in HTML work. In addition to the summary, you need to manually add the [ID] where the anchor links will take you. This ID is usually placed in headers (H2, H3 and H4).
First in the table of contents or index, the HTML code is as follows:
<strong>Article Summary</strong> <a href="/en/”/#nome_da_ancora”">- Anchor title</a> <a href="/en/”/#nome_da_ancora2”">- Anchor title 2</a> <a href="/en/”/#nome_da_ancora3”">- Anchor title 2</a>
The result in the HTML preview will look something like this:
This is a summary made in HTML. Notice that you use the same link tag , but instead of the link, you add a href=#blabla where the hashtag [#] indicates that the link is on the same page and is an ID.
Having placed the hashtag, you must add the path to your H2 subtitle or another location that you want the summary to take you. Usually the result in HTML looks like this:
<h2 id="nome_da_ancora">
How to do WordPress Summaries without Plugin
you don't need a hashtag. In the WordPress editor you can add the ID without using quotes between the keyword. It corrects this problem automatically, I believe that most HTML readers and editors can understand using quotation marks.
Now that you know how the summary works, I suggest doing something better in the new Gutenberg editor. After writing all the articles with all the H2 headings, you can simply click the information button and copy the entire summary that appears below the Document overview.
This summary will even have the hashtags and internal IDs of the Gutenberg editor. You can simply copy and paste everything into a pre-formatted WordPress box that has a gray background, delete the H2 that you see with the collage, and finish by adding a dash [-].
Then just edit the summary links and place your personalized hashtags, until it looks like the example we left above. After doing this, just walk through the article through the H2 headers, select them and then go to the block options.
In the block options for H2 and other headings, you can find the option HTML Anchor in the Advanced tab. Just enter the ID you added to the table of contents in this field, without using the hashtag [#]. WordPress will automatically add it without the need to edit HTML.
Table of Content - WordPress Summary Plugin
Throughout the article I talked about making summaries manually and my great refusal to use plugins to keep the hyperlink cleaner. Unfortunately I ended up changing my mind and to avoid work and lost time I ended up joining a plugin.
I currently use the LuckyWP Table of Contents plugin and configure it in a way that makes the anchor link lowercase, without accents, and matching the H2 and H3 titles. I don't have much to say about the plugin; if you were looking for one, I consider this the best.
Anchors in giant summaries using Text Editor
There are text editors that have variable substitution tools that can allow you to automatically add hashtags and IDs to WordPress article summaries or other texts that are in HTML.
Since I have MacOS, I use the CODA 2 text editor. It was the only one I found and allows you to easily add IDs to headers without having to keep going back and forth from the beginning and end of the article. I believe Dreamweaver also has great options for finding and replacing text.
With a text editor program that supports variables in finding and replacing, add the following to find and replace. The variables will be between [].
& lt; a href = ”# [1] ”& Gt; - [2]</a>[3]<h2>
The first variable will locate and memorize the ID of the summary. The second variable will equal the rest of the line within the summary, the third variable will carry the rest of the article until the header that has not yet been assigned an ID. Replace with:
& lt; a lol href = ”# [1] ”& Gt; - [2]</a>[3]<h2 id="[1]">
Sometimes your locator may conflict with some space or symbol, but usually it will only replace it once. You have to click on the replace several times for it to do this with all the headers of the article.
It is important to do this with only header articles of a type like & lt; H2 & gt ;, you also cannot have added any tags between the H2 headers of the article code. If something is wrong, the editor will assign the wrong variables each time you replace it.
The substitution will take the information from the first summary. The lol in the text serves to prevent the substitution from repeating the process on the same line of the list (don't forget to delete it afterwards). In the repetition of the process, it will skip the with ID and go straight to the correct header.
It may seem a little confusing, I think all of this could be better explained on video. Anyway, use your head a little, speed up your work and index your articles to stand out from the competition and improve your SEO.
I also made a long video lesson talking about how I write my articles. You can watch it below: