Placing bookmarks in blog posts in WP5 Gutenberg

That depends, what do you mean by “bookmark”, exactly?

I’m using “bookmark” to mean a reference point that’s ordinarily invisible to the reader but which I can build a hyperlink to.

For example, if I had a blog post called “My Blog Post” on a web site called “www.mywebsite.com,” and I wanted readers to be able to come into it at a certain point from an e-mail I’d sent them, I would create a bookmark at that point, which I’d call “resume_here.” The e-mail would end with text that might look something like, “To read the rest of this post, click here.” The URL for that “click here” link would be “https://www.mywebsite.com/my-blog-post/#resume_here.”

In the blog post, I’d insert that invisible-to-the-reader target URL for the hyperlink in the e-mail. That target is the bookmark.

This is the way these things usually work, but when I tried it in WP5’s Gutenberg editor, it didn’t.

What did I miss? Please don’t tell me Gutenberg doesn’t allow this kind of bookmarking! The legacy editor did.

• This reply was modified 5 years, 9 months ago by Ross Lampert.
• This reply was modified 5 years, 9 months ago by Ross Lampert.

Yeah, it works exactly the same. Those are called “anchors”. Not bookmarks.

You insert them the same way you inserted them before. Switch into HTML mode for any block, and give something there a “name”. Then the #name will link to there on the page.

If you select a paragraph block, for example, and select “Edit as HTML”, then it will be <p>text here</p> or what have you. Change it to give it a name, like <p name="whatever">text here</p> and now you can link to #whatever to link to that anchor point.

Tried that, doesn’t seem to be working.

Using your example but with “more” instead of “whatever”, I tried changing <p>text here</p> to <p name=”more”>text here</p>. The code insisted on adding second start and end paragraph code: <p><p name=”more”>text here</p></p>. That didn’t mess up the paragraph structure but the anchor didn’t work when I tried to link to it from another location using the URL.

The outbound link is https://www.rossblampert.com/2019/01/30/give-it-up-part-3/#more and the anchor is supposed to be located at the beginning of the paragraph beginning with “I know,” (quotes included). The link instead takes the reader to the top of the post. What am I doing wrong?

As an aside, it sure would be nice if we could insert these anchors without having to get into the code. Improvement candidate?

Try using “id” instead of “name”. The name is something you’re supposed to use on A tags, not necessarily anything. But browsers support ID as well, and that should work everywhere.

That did it! The code didn’t like “name” at all: “invalid content” or some such error.

Now, about making that insertion a more user-friendly process…. ?? Hope I’ll see that in a future update. I know it’s a tool I’ll be using.

Thanks!