Hi folks,
I tend to have a lot of different Infinity folders open in different browser tabs and built this script to help me differentiate between them - it allows the tab title and favicon to be changed per folder.
Here’s a screenshot - here I have several different Infinity windows on folders in the same board - each has a distinct title and favicon:
If you’d like to do something similar to set this up you need a few things:
- The tampermonkey extension for Chrome or Brave.
- This runs the script against specified webpages to set the title & icon. I think the script should be compatible with the greasemonkey extension in Firefox but I haven’t tested that.
- The folder IDs for the folders you want to change the title & icon for
- You can find the ID by looking at the infinity URL for the folder you’re interested in
- The URL will look something like … https://app.startinfinity.com/b/JVqFsT4yFqF/Pf36cXHePgP?view=…
- … the folder ID is the second value after “/b/” i.e. in the example above the ID is “Pf36cXHePgP”
- You can find the ID by looking at the infinity URL for the folder you’re interested in
- Favicons - if you want different icons for each folder you’ll need to generate favicons using a tool such as this one and then upload the .ico files somewhere publicly e.g. on Dropbox
- The script - you’ll need to modify this to use the appropriate folder IDs and favicon URLs. Save the code at the bottom of this post as RenameInfinityBrowserTabTitles.js and load into GreaseMonkey
Please shout if you have any questions …
Gordon
// ==UserScript==
// @name Rename Infinity browser tab titles
// @namespace GB
// @include https://app.startinfinity.com/b/*/*
// @version 1
// @grant GM_log
// @description Change tab titles on Infinity
// ==/UserScript==
// get name of folder based on third part of path
var path = window.location.pathname.split("/")
var folder = path[3];
var title = "";
switch(folder) {
case "Pf36cXHePgP":
title = "A folder";
break;
case "S9a15We8jGJ":
title = "A different folder";
break;
case "sbFx4tUh8MG":
title = "A third one";
break;
}
function changeFavicon(src) {
var link = document.createElement('link'),
oldLink = document.getElementById('dynamic-favicon');
link.id = 'dynamic-favicon';
link.rel = 'shortcut icon';
link.href = src;
if (oldLink) {
document.head.removeChild(oldLink);
}
document.head.appendChild(link);
}
// code from Facebook script - ensures that title remains changed
var target = document.querySelector('title');
var config = { attributes: true, childList: true, characterData: true }
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
observer.disconnect();
if (title) {
switch(title) {
case "A folder":
changeFavicon('URL to icon.ico');
break;
case "A different folder":
changeFavicon('URL to icon.ico');
break;
case "A third one":
changeFavicon('URL to icon.ico');
break;
}
document.title = title + " > Infinity";
} else {
console.log("Unknown folder - check TamperMonkey script");
}
observer.observe(target, config);
});
});
observer.observe(target, config);