Stephen Whitmore
Posted on October 10, 2020
Are you a new developer eager to find useful ways to utilize your newly discovered superpowers? One idea is to set your browser's home page to a custom one.
For example, I use Firefox mostly to listen to white noise or music while working. I created the following page and set it as my Firefox home page -
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>home</title>
<style>
* {
margin: 0;
}
div {
display: flex;
height: 100vh;
}
a {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
text-decoration: none;
font-size: 20px;
color: #fff;
box-sizing: border-box;
transition: font-size 0.5s ease;
}
a:hover {
font-size: 2em;
}
a:first-child {
background-color: #333;
}
a:nth-child(2) {
background-color: #006fff;
}
</style>
</head>
<body>
<div>
<a href="http://asoftmurmur.com">asoftmurmur</a>
<a href="https://pandora.com">pandora</a>
</div>
</body>
</html>
Save the html file somewhere and navigate to it in your file explorer. Right click on the file and open with any browser.
The URL in the address bar will be the path to your html file prefixed by file://. In my case it's file:///home/swhitmore/.mozilla/ffhome.html.
Set your browser's home page to this new URL and voilà you have a new custom home page!
Not sure how to set the browser's home page? Mozilla has documentation for Firefox and Google has some for Chrome was well.
Posted on October 10, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
