Skip to content

YouTube Add-On - YouTube Save Marker

Comprehensive Education Hub: Our versatile learning platform caters to a wide range of subjects, offering resources for computer science and programming, school education, skill development, commerce, software tools, competitive exams, and other areas. Empowering learners in diverse domains.

YouTube Bookmarking Tool via Chrome Extension
YouTube Bookmarking Tool via Chrome Extension

YouTube Add-On - YouTube Save Marker

The YouTube Bookmarker Chrome Extension is a project designed to create bookmarks corresponding to different timestamps in YouTube videos. This extension stores timestamped YouTube video links by saving them as structured data entries in Chrome's local storage.

Key Features

  • Each bookmark consists of the YouTube video’s unique ID, the exact timestamp, and any user-entered annotation or description.
  • These bookmarks are saved as JSON objects inside Chrome’s local storage, allowing easy retrieval and manipulation.
  • The extension provides a user interface to add, edit, and delete these timestamped bookmarks.
  • It also supports exporting all saved bookmarks as a JSON file for backup or cross-device transfer.
  • The storage format typically maps video IDs to an array of timestamped annotation objects, enabling efficient organization of multiple bookmarks per video.

How it Works

The extension uses the tag in to take bookmark and timestamp as input from the user. When the user clicks on the bookmark field, the file injects the script into the window of the browser. This script extracts the timestamp in word format, converts it into format and in seconds, and takes the current video link and converts it into a generic format.

The in holds hyperlinked bookmarks and their timestamp, while the tag displays the bookmarked points for the current video. The file adds interactivity to and communicates with using an event-driven paradigm.

Extension Architecture

The extension's architecture includes a manifest.json file, file, and file. The manifest.json file contains information about the Extension’s name, version, description, permissions, options_page, background, and browser_action. The permissions field allows access to the active tab, storage, specific YouTube domains, 'tabs' API, and declarativeContent.

Development and Testing

To test the extension, create a manifest.json file and project structure, go to , toggle Developer Mode to ON, click on 'Load Unpacked' to load the Extension folder, and the Extension should appear on the right side of the chrome address bar.

Future Plans

The extension is currently in development and future plans include connecting it to , using a local database or Firebase for decoupled data storage, improving UI/UX, designing custom extension icons, and using 'sync storage' for bookmarks to be available on other devices.

Code and Resources

The code for the project can be found on GitHub. For more information on building similar Chrome extensions, refer to the article [1] that walks through the process of storing timestamps linked to YouTube videos in Chrome local storage. The official YouTube Bookmarker extension similarly stores its data locally and uses the YouTube video ID and timestamps as keys for these bookmarks [2].

[1] Building a Chrome Extension to Store Timestamped YouTube Video Links

[2] YouTube Bookmarker Extension

The YouTube Bookmarker Chrome Extension project might incorporate a trie data structure in its future plans for improved organization of multiple bookmarks per video, as this technology allows for efficient storage and retrieval of large amounts of data. With a trie, each character in a video ID, timestamp, or annotation could be a path that leads to the bookmark, enabling faster lookup times.

Furthermore, incorporating technology like Firebase could also be a part of the extension's future development, as it offers real-time data storage and sync capabilities, ensuring that bookmarks are available on other devices in a decoupled manner.

Read also:

    Latest