Is it possible to make a pinned post linkable instead of a static page?

On your blogs page there is a Customize option under your blog. When you click it, scroll down towards the bottom and you will see a “Custom JavaScript” area for JavaScript that can run on your blog (it only works for custom domains or blog.writeas.com domain). This is where you’ll put the code.

Would be glad to clarify further if needed!

1 Like

That worked beautifully. I made some adjustments to it for my needs:

var a = document.querySelector('a[href="MY_MENU_ITEM_URL"]');
if (a) {
  a.setAttribute('href', 'MY_NEW_URL');
  a.setAttribute('target', '_blank');    /*ADDED THIS FOR NEW TAB*/
}

cc: @cjeller1592

Thanks all!

2 Likes

@cjeller1592 et al: I’m in over me head, trying to have two pinned posts that live jump to the link within. The first is to the ebook creation, which I copied and pasted from you, cj. The second is that copied and my failed attempt to edit it, and it links to our discourse forum. What am I missing? Well, specifically regarding this question anyway. Grin.

const pinned = document.querySelector(‘a[href*=“https://catholichalos.org/ebook”]’);
pinned.href = ‘https://catholichalos.org/.epub’;

const pinned1 = document.querySelector(‘a[href*=“https://discourse.catholichalos.org”]’);
pinned.href = ‘https://discourse.catholichalos.org’;

Hi @DeaconPatrick! The problem is that the code is looking for a link that isn’t on your blog. What you need to do is replace the first reference of https://discourse.catholichalos.org with https://catholichalos.org/forum. That way the JavaScript will find that link on your blog and replace it. Here’s what should work for the link to your Discourse forum:

const pinned1 = document.querySelector('a[href*="https://catholichalos.org/forum"]');
pinned.href = 'https://discourse.catholichalos.org';

That should do the trick. Let me know if it works!

Thank you, @cjeller1592. Each line gives a different error. The first line:

The second line:

The link I want the pinned post to go to is: https://discourse.catholichalos.org/

Try the above code snippet again. There was a typo with single & double quotes that I just edited!

Second line gives an error: "Unclosed string. Missing semicolon.

Ah gotcha — third time’s the charm I think. Give the same code a go and let me know if there’s any error!

Hmmm. I’m botching something somewhere. No more error messages, but the pinned “Forum” at https://catholichalos.org/ still lands on a post with the link rather than being an active link itself. Ideas on what I’m missing?

@cjeller1592, I’ve still not sorted it. Any ideas what I’m missing?

There is something wrong with the characters in your custom javascript. Specifically, the double quotes on the URL the script is trying to find. Note the first one uses "", while the next one which doesn’t work, uses “”. I think if you change that to use the same double quotes as the first one, it will start working.

1 Like

I agree with @dino that this may be the root of the problem. Try to copy in the code below @DeaconPatrick and let us know whether that works or not. We’ll get this figured out!

const pinned1 = document.querySelector('a[href*="https://catholichalos.org/forum"]');
pinned.href = 'https://discourse.catholichalos.org';

Thank you, @dino and @cjeller1592. Smart quotes replaced with “dumb” quotes, and it still does not work. In fact, I’m even more confused now, because the pinned ebook link now goes to the forum. I’m not sure when that happened, but it had been working until the last change or two.

I’m thinking I’ll delete both, and start fresh, only creating the forum pinned post as a direct link. If you were writing that code fresh, what would it be?

I want to link to: https://discourse.catholichalos.org/
from: a pinned post “Forum”

The genesis of the second line is: I copied the first line, which works and CJ gave me, and then added the “1” to “pinned” (possible error there?) and changed the links to the desired landing link.

I deleted the first line of code and the ebook post. Now the second line of code works. Which raises the question: can there be two live linked pinned posts? If so, how?

This is the script that I use on my site. You can try adding that for your ebook link. The first set of scripts is for viewing the site when you are not logged in. The second set is for viewing it when logged in to write.as, so you have to replace ‘YourAlias’ with the alias for your blog.

var a = document.querySelector('a[href="https://catholichalos.org/books"]');
if (a) {
  a.setAttribute('href', 'https://catholichalos.org/.epub');
}

var b = document.querySelector('a[href="/YourAlias/books"]');
if (b) {
  b.setAttribute('href', 'https://catholichalos.org/.epub');
}

This is a good point – the link / “href” part will vary if you have a custom domain set up. If that’s the case, you can also use a different CSS selector ($=) to simplify the code:

var a = document.querySelector('a[href$="/books"]');
if (a) {
  a.setAttribute('href', 'https://catholichalos.org/.epub');
}

This tells the script to look for a link that ends with /books.

2 Likes

brilliant. this finally fixed the problem for me. thanks @matt!

1 Like

Hello, I have problem with polish letters:

const pinned3 = document.querySelector(‘a[href*=“https://teodordobrzycki.writeas.com/artykuły”]’);
pinned3.href = ‘https://write.as/teodordobrzycki/tag:artykuły’;

this leads me to https://write.as/teodordobrzycki/tag:artykuly, which of course displays wrong. This is strange, as the rest of entire write.as page works with polish letters perfectly, I can add them to tags, titles, etc.

Is there a workaround?

Thank you in advance.

solved. changed “ł” to “%C5%82”.

1 Like

This worked for me and my /newsletter page very easily, got it up and running in about a minute. Non-techie Jas is pleased :slight_smile:

I had a follow-up question… the ‘newsletter’ button re-directs when it’s clicked on on my blog.

Is it possible for me to create a URL forward, so that when indiewriter.net/newsletter is typed in, it automatically sends folks to the desired page (this one)? At the moment, typing indiewriter.net/newsletter into the browser leads to a blank ‘newsletter’ blog post, rather than the desired link itself.