Make Raindrop Your New Tab Page (for Chrome)

In this guide, we will see how to view your Raindrop bookmarks on your new tab page whenever you open a new tab. Here’s the fun part: we have to create a Chrome extension to do that. But don’t worry, it’s easy! If you are using Brave, read this post because Brave provides an option to set a custom new tab URL. Chrome does not, so we have to create a Chrome extension, such as NewTab Chrome Extension, for the job. Step 1: Head over to chrome extension store and install Raindrop extension Step 2: Sign in to your Raindrop account. Step 3: Pin Raindrop extension. Step 4: Right click on Raindrop icon > click on 'Open app'. A window opens showing raindrop app. We will make this show up every time you open new tab. Step 5: Head over to the left side of panel and click on the folder you always want to open in your new tab. In my case, I have several folders - "fav", "reading list", "my builds" etc. I want "fav" folder to show up on my new tab page so I selected "fav". You can choose any folder you want. Then click on "save". Step 6: After clicking on save, you see a new bookmark as pointed one in below image. Right click on it and then click on "Copy link to clipboard" Now comes the fun stuff. Creating your very own chrome extension. Chrome does not provide an option for users to set a custom new tab page. It only shows its default new tab page. There are Chrome extensions available on the Chrome Web Store, such as the very popular NewTab Chrome extension, which provides this missing feature. It simply asks for the URL you want to show up on your new tab instead of the default Chrome new tab page. However, if you install the NewTab Chrome extension and paste the Raindrop.io URL you just copied, for some reason, it does not work. The Raindrop.io bookmark does not show up on the new tab. I wish this could work, but unfortunately, it doesn’t. So, we take the task upon ourselves and created a Chrome extension that does exactly what the NewTab Chrome extension does— simply sets the provided URL to show up on the new tab. Now, don’t worry, it’s too easy! Just follow the steps below. Step 7: Create a new folder and name it whatever you want. I named it "CustomNewTab". Step 8: Open TextEdit (for mac users) or Notepad (for windows user). Step 9: Paste below code. Chrome browser will read this code and understand that this is a chrome extension. { "name": "CustomNewTab", "description": "Hello World", "manifest_version": 3, "version": "1.0", "chrome_url_overrides": { "newtab": "PUT THE RAINDROP LINK YOU COPIED BETWEEN HERE BETWEEN DOUBLE QUOTES" } } name: This would be the name you want to give to your chrome extension. I choose CustomNewTab. You can choose any name you want to give to this extension. description: Give a short description about your chrome extension. Since we are using it for personal use, we can put whatever we want in description manifest_version: specifies the version of the Chrome Extensions API that the extension follows. Even I don't know what that means but current version is 3 so we gonna put 3. version: This is your chrome extension version. Since this is our brand new extension, we gonna put 1.0 but you can put whatever number you want. chrome_url_overrides: This is important as this will tell Chrome Browser to open the given link on new tab page, instead of Chrome Browser opening it's default new tab page. Under "newtab", put the raindrop link you just copied. This file would look something like below Step 10: Save the file in the folder you created and it's very important to name this file manifest.json Step 11: After saving file, open TextEdit or Notepad again and create new file. In this file, we don't have to write anything. Simply save the file as index.html in the same folder. You have to name this file index.html, can't use any other name. Once done, the folder would contain 2 files as seen below Voilà, we created our very own chrome extension

Mar 12, 2025 - 06:10
 0
Make Raindrop Your New Tab Page (for Chrome)

In this guide, we will see how to view your Raindrop bookmarks on your new tab page whenever you open a new tab.

Image description

Here’s the fun part: we have to create a Chrome extension to do that. But don’t worry, it’s easy!

If you are using Brave, read this post because Brave provides an option to set a custom new tab URL. Chrome does not, so we have to create a Chrome extension, such as NewTab Chrome Extension, for the job.

Step 1: Head over to chrome extension store and install Raindrop extension
Step 2: Sign in to your Raindrop account.
Step 3: Pin Raindrop extension.

Image description

Step 4: Right click on Raindrop icon > click on 'Open app'.

Image description

A window opens showing raindrop app. We will make this show up every time you open new tab.

Image description

Step 5: Head over to the left side of panel and click on the folder you always want to open in your new tab. In my case, I have several folders - "fav", "reading list", "my builds" etc. I want "fav" folder to show up on my new tab page so I selected "fav". You can choose any folder you want. Then click on "save".

Image description

Step 6: After clicking on save, you see a new bookmark as pointed one in below image. Right click on it and then click on "Copy link to clipboard"

Image description

Now comes the fun stuff. Creating your very own chrome extension.

Chrome does not provide an option for users to set a custom new tab page. It only shows its default new tab page. There are Chrome extensions available on the Chrome Web Store, such as the very popular NewTab Chrome extension, which provides this missing feature. It simply asks for the URL you want to show up on your new tab instead of the default Chrome new tab page.

However, if you install the NewTab Chrome extension and paste the Raindrop.io URL you just copied, for some reason, it does not work. The Raindrop.io bookmark does not show up on the new tab. I wish this could work, but unfortunately, it doesn’t. So, we take the task upon ourselves and created a Chrome extension that does exactly what the NewTab Chrome extension does— simply sets the provided URL to show up on the new tab.

Now, don’t worry, it’s too easy! Just follow the steps below.

Step 7: Create a new folder and name it whatever you want. I named it "CustomNewTab".

Step 8: Open TextEdit (for mac users) or Notepad (for windows user).

Step 9: Paste below code. Chrome browser will read this code and understand that this is a chrome extension.

{
    "name": "CustomNewTab",
    "description": "Hello World",
    "manifest_version": 3,
    "version": "1.0",
    "chrome_url_overrides": {
        "newtab": "PUT THE RAINDROP LINK YOU COPIED BETWEEN HERE BETWEEN DOUBLE QUOTES"
    }
}
  • name: This would be the name you want to give to your chrome extension. I choose CustomNewTab. You can choose any name you want to give to this extension.
  • description: Give a short description about your chrome extension. Since we are using it for personal use, we can put whatever we want in description
  • manifest_version: specifies the version of the Chrome Extensions API that the extension follows. Even I don't know what that means but current version is 3 so we gonna put 3.
  • version: This is your chrome extension version. Since this is our brand new extension, we gonna put 1.0 but you can put whatever number you want.
  • chrome_url_overrides: This is important as this will tell Chrome Browser to open the given link on new tab page, instead of Chrome Browser opening it's default new tab page. Under "newtab", put the raindrop link you just copied.

This file would look something like below

Image description

Step 10: Save the file in the folder you created and it's very important to name this file manifest.json

Step 11: After saving file, open TextEdit or Notepad again and create new file. In this file, we don't have to write anything. Simply save the file as index.html in the same folder. You have to name this file index.html, can't use any other name.

Once done, the folder would contain 2 files as seen below

Image description

Voilà, we created our very own chrome extension