[Blogger Tips] How to Add Blogger Anchor Bookmark and Hyperlink to Same Page Successfully (Solved)

I have been a blogger writer since 2008.  I write this article because I have been searching for intra-page anchor method for a long time.
If you want to GO DIRECTLY to solution, click HERE.

Blogger Will Mess Up Anchor Link With "Compose Tab"

The problem of blogger interface is:

When you add a anchor using textbook method:
  • Anchor:  <a name="ThisIsAnchor">This Is Anchor Target</a> ,  &
  • Link to Anchor:  <a href="#ThisIsAnchor">This Is Link to It</a>
(see HERE for detail HTML method)

In normal situation (other than blogger), it will jump to the anchor place without reloading page.

But in blogger, if you switch to "Compose Tab" after having added such anchor(s), ALL the Link to Anchor  will be messed up, with your blogger ID added before the anchor, like this:
<a href="https://www.blogger.com/blogger.g?blogID=48019486#ThisIsAnchor">
(see HERE for detail problem description in stackoverflow)

Previous Solution to Blogger Messed Internal Anchor Links

Previously, I have found a solution already but the page need to reload.

The (not-so-good) solution is to add the full-url before the anchor:
<a href="YOUR-FULL-BLOG-URL#ThisIsAnchor">This Is Link to It</a>

like this:
<a href="https://ronaldchik.blogspot.com/2019/02/useful-links.html#learn">This Is Link to It</a>

But it needs to reload the whole page!!!


Real Solution to Blogger Internal Messed Anchor Links

I just found a complete solution online HERE, by adding one more code, after the Link to Anchor, :
rel="no-refresh" 
example:
<a href="https://ronaldchik.blogspot.com/2019/02/useful-links.html#learn" rel="no-refresh">This Is Link to It</a>
then it would go to anchor without reloading the page.

Hope the above could help you.




若覺得這篇文章好,"分享" 給朋友吧!或留個 "Thank You" 呀!
想問經濟、數學?可 按此 到我的面書發問。
想第一時間收到最新文章,可訂閱博客更新&amp;nbspRSS 。

沒有留言:

張貼留言

若想 *收到回覆* 通知,請以 Google 帳號登入,並勾選「通知我」(你依然可選擇 *匿名(唔開名)*) 。

另,Google 偶會審核留言而不能即時顯示,請耐心等候,不用重覆發表。謝謝!