Gutenberg Editor Add HTML Anchor Link Very simple. Anchor link (also called page jump, anchor link) is to jump to a position above or below a longer page, or a position on another page when clicking a link. To achieve this function, an HTML anchor is placed in the page as the title attribute, and a link to the anchor is created.
Lao Wei shared it in the classic editor WordPress Add Anchor Positioning , which is troublesome to operate. The Gutenberg editor is much easier to operate than the classic editor. The following Weiss notes share in detail how to add HTML anchor links to the Gutenberg editor.
1. Place HTML Anchor
We add anchor points to the existing title of an article to jump from one article to another.
If you don't have a title, add one. Select title as the block type.
Enter the title text, or leave it blank if you do not want to display the text.
Select the text with the mouse and click Block>Advanced>HTML Anchor on the right.
Enter a word that will become an anchor link in the "HTML Anchor Point" field. After entering avada jiebang, it will automatically become avada jiebang.
Click the "Save"/"Update" button above.
2. HTML Anchor Syntax
- HTML anchors must be unique in an article.
- HTML anchors are case sensitive.
- HTML anchors can include the following symbols: hyphen (-), underscore (_), colon (:), period (.), but not spaces.
- HTML anchors must start with a letter.
3. Link to HTML anchor
This includes anchor links on the same page and anchor links on different pages.
3.1. Use text, images, and buttons as content that you want visitors to click to jump to another location on the same page.
Select the text, image, or button with the mouse, and then select the link option from the Block toolbar.
Enter the HTML anchor just created, starting with the # sign. For example, if an anchor named avada jiebang is created above, it will link to # avada jiebang.
Note: Jump links do not work when previewing websites. You can only view the effect after publishing the page.
3.2 If it is an anchor link of another article, enter the link option added https://www.vpsss.net/24841.html#avada -Jiebang.
For example, click Avada purchase code unbinding You can link to the corresponding anchor page location.
