Creating a Custom New Tab/Homepage that is Browser Agnostic
If only there was a way to get my homepage to be consistent over every browser on every platform...
TL/DR; I created a "clone" of my Tabliss extension New Tab/Homepage setup so that I can use it on any browser on any device. I simply set my browser settings for these changes to point to: home.leblanc.sh. It is very simple, but not all solutions to problems need to be complex.
For a long time I had been using the Tabliss extension for Firefox when I was using that as my default browser. I switched back to Safari as my primary browser on macOS which is what I am using 98% of the time. I still use FF when on my Ubuntu box (when not using Min) but I wanted a consistent experience that I could create regardless if I were using Firefox on Ubuntu, Safari on macOS/iOS, or Edge on Windows. (The same theory goes for my bookmarks as well, which is why I recently moved all my bookmarks over to Raindrop.io)
I love the Tabliss extension. It makes customizing your new tab page so easy and clean, if only they supported more browsers! This is not the case however, so that means I wanted to create my own version.
The way I saw it I had 2 options:
- Develop a new browser extension that is cross-compatible with all the browsers I use. (unlikely)
- Write a simple HTML/CSS/JS Homepage and host is on a leblanc.sh subdomain that I can point my browsers to. (Ta-Da!)
I decided to go with option 2 (obviously). I was able to spin this up in ~2 hours. I started by going to my Tabliss page in Firefox and desiging it how I liked and used this as a design starting point to create my own page.
What made this extra easy was to use my existing Netlify setup. I created a new site project and linked it to my newly created GitHub repo for this project. I also use Netlify to manage my DNS records for the leblanc.sh domain so at this time I alse created a new subdomain for this project.
I added all of my web files from my local machine to that GH repo, pushed to main, and boom - home.leblanc.sh was live!
All that was left was to change the settings on all of my browsers to point to this new site for their Homepage/New Tab configurations.
Hopefully someone can find this helpful in the future. I linked to the repo for this homepage above. This project cost me a total of $0 to setup and make live. It has made my browser experience uniform across platforms.