Active link to other webpage in Pinned Post on landing page?

I would be glad to explain it a little further.

And actually, there is simpler code to accomplish this (courtesy of @Cat). In your Customize settings of your blog, go down to Custom JavaScript for your blog you can put in this in:

const pinned = document.querySelector('a[href*="https://pinnedpost.com"]');
pinned.href = 'https://landingpost.com';

Let’s break it down. The first step is writing code to find the pinned post whose link we want to change. That is the first part:

const pinned = document.querySelector('a[href*="https://pinnedpost.com"]');

The code says “Called ‘pinned’ whatever element has this pinnedpost.com link.” So in your case, you will replace the above with the link to the post on your blog you want to go to another webpage. For example:

const pinned = document.querySelector('a[href*="https://write.as/cjeller/social"]');

The next line of code is where the magic happens. Now that our code identifies the element with the pinned post link, the second step is replacing that pinned post link to the link for our landing post. That is the second part:

pinned.href = 'https://landingpost.com';

All that code says is, “Hey, remember that ‘pinned’ element you found above? Change the url to landingpost.com instead.” So as with the example case above, I will put in the social page I want it to land on instead:

pinned.href = 'https://social.com/cjeller';

The pinned post can only be pages internal to the blog. The landing pages, however, can be anything internal to the blog and outside of it as well.

Hope that helps and let me know if you have any further questions!

4 Likes