Some years ago, @thekittygirl gave me a couple of bookmarklets: one that would switch a post from the Ecency version to the Peakd version, and one that did the reverse. I long ago discarded the to Ecency version and just kept the other, since I almost always read everything on PeakD.

I've always had it in mind to improve the bookmarklet, but I never took the time to do so until now. I refactored the code so it now switches any page among the three main Hive portals: Ecency, Peakd, and Hive.blog. It automatically detects which portal you're on and offers the other two as options.

So for example, if I'm on:
@dbooster/emperor-suko-and-the-northern-court-legacy
I can click the bookmarklet and choose to switch to:
@dbooster/emperor-suko-and-the-northern-court-legacy
or
@dbooster/emperor-suko-and-the-northern-court-legacy

See it in action here:

This works on both Firefox and Brave. I haven't tested it on other browsers. It probably works on Chrome, though Google keeps locking that browser down more and more in their attempt to destroy adblocking — so who knows.^[1]

I'm using a bit of CSS styling to make the popup that asks which site you want. It seems like some of the CSS is being overridden by the sites themselves, so the popup looks a little different on each. But it works! and that's the important part.

Bookmarklets have been around since the beginning of the web, so they’re 30+ years old. But they’re probably not as common as they used to be, so I should explain.

To create one:

1. Make a random bookmark of any page. Doesn't matter which — we just need the bookmark to exist.
2. Then open your bookmark manager and edit it.

You should see something like this:

Replace the Name with whatever you want the bookmarklet to be called. I named mine "Hive Portal Switcher".

Replace the URL with this:

javascript:(function(){let h=location.hostname.replace('www.',''),p=["peakd.com","ecency.com","hive.blog"].filter(x=>x!==h);if(document.getElementById('portalSwitcher'))return;let d=document.createElement('div');d.id='portalSwitcher';Object.assign(d.style,{position:'fixed',top:'20%',left:'50%',transform:'translateX(-50%)',background:'#fff',border:'2px solid #444',padding:'20px',zIndex:'9999',boxShadow:'0 0 10px rgba(0,0,0,0.5)',fontFamily:'sans-serif'});let t=document.createElement('h3');t.innerText='Switch Hive Portal';t.style.marginTop='0';d.appendChild(t);p.forEach(function(q){let b=document.createElement('button');b.innerText='Go to '+q;b.style.margin='5px';b.style.padding='5px 10px';b.onclick=function(){let a=location.pathname.split('/'),i=a.findIndex(x=>x.startsWith('@')),n=i>-1?a.slice(i).join('/'):'';location.assign('https://'+q+'/'+n)};d.appendChild(b)});let c=document.createElement('button');c.innerText='Cancel';c.style.margin='5px';c.onclick=function(){document.body.removeChild(d)};d.appendChild(document.createElement('br'));d.appendChild(c);document.body.appendChild(d)})();

Yes, it looks like a mess—that's because it's minified.^[2] Copy the whole thing and paste it into the URL field of your bookmark. Your final setup should look something like this:

Now hit save. I recommend dragging the bookmarklet to your bookmarks toolbar so it's easy to access. Now, whenever you click it, it’ll offer you the option to switch to one of the other two portals.

I do hope to extend this further in the future to include InLeo and other Hive portals (like CineTV) — but… later!

If you'd like to add that yourself or clean up the styling (which can get a little messy due to CSS overrides), here’s the non-minified version of the code:

javascript:(function(){
  let currentHost = location.hostname.replace('www.', '');
  let portals = ["peakd.com", "ecency.com", "hive.blog"].filter(p => p !== currentHost);
  if (document.getElementById('portalSwitcher')) return;

  let overlay = document.createElement('div');
  overlay.id = 'portalSwitcher';
  overlay.style.position = 'fixed';
  overlay.style.top = '20%';
  overlay.style.left = '50%';
  overlay.style.transform = 'translateX(-50%)';
  overlay.style.background = '#fff';
  overlay.style.border = '2px solid #444';
  overlay.style.padding = '20px';
  overlay.style.zIndex = '9999';
  overlay.style.boxShadow = '0 0 10px rgba(0,0,0,0.5)';
  overlay.style.fontFamily = 'sans-serif';

  let title = document.createElement('h3');
  title.innerText = 'Switch Hive Portal';
  title.style.marginTop = '0';
  overlay.appendChild(title);

  portals.forEach(function(p){
    let btn = document.createElement('button');
    btn.innerText = 'Go to ' + p;
    btn.style.margin = '5px';
    btn.style.padding = '5px 10px';
    btn.onclick = function(){
      let parts = location.pathname.split('/');
      let userIndex = parts.findIndex(part => part.startsWith('@'));
      let newPath = userIndex > -1 ? parts.slice(userIndex).join('/') : '';
      location.assign('https://' + p + '/' + newPath);
    };
    overlay.appendChild(btn);
  });

  let cancel = document.createElement('button');
  cancel.innerText = 'Cancel';
  cancel.style.margin = '5px';
  cancel.onclick = function(){
    document.body.removeChild(overlay);
  };
  overlay.appendChild(document.createElement('br'));
  overlay.appendChild(cancel);

  document.body.appendChild(overlay);
})();

If you do make any improvements, please share them—and tag me so I can check them out!

❦

---

1. Incidentally, it works in Safari too, but you probably aren't using that. ↩

2. That is to say, all spaces and linebreaks are removed. ↩