Instagram Story Download Button

WHAT IT DOES

This script adds a download button to Instagram Stories, letting you save images and videos from stories directly. When you view a story on Instagram, the script detects the media (image or video) and adds a "Download" button overlay on the story viewer. Click the button to open the media in a new tab or download it directly—you can choose your preferred mode in the settings panel. The button appears on both image and video stories and updates automatically as you navigate between stories. The script works on both the desktop web version and the mobile web version of Instagram.

WHERE IT RUNS

The script runs on all Instagram pages (*.instagram.com). It works on the story viewer when you click on a story. It supports both desktop and mobile views.

HOW TO USE

After installation, the settings panel appears on the left side of the screen with the gear emoji (⚙️). Open the panel to configure the script:

- The "Show download button" toggle enables or disables the button.

- Choose the download mode from the dropdown: "Open in new tab" or "Direct download."

- Click "Refresh story" to manually refresh the button if it doesn't appear.

When viewing a story, a "Download" button appears at the bottom-right corner of the story. Click it to open or download the story media.

TECHNICAL SECTION — REAL MECHANISM

The script detects Instagram story viewer elements using selectors like .EfHg9, .l8mY4, ._ac7xd, and div[role="dialog"]. It extracts the media URL by checking for video elements (video src or source src) and image elements (img src) within the story viewer. For stories that use background images, it parses the background-image CSS property. The download button is created as a button element with a dark glassmorphism style and inserted into the story viewer near the story controls. The button is positioned using CSS with position:absolute and bottom/right offsets. When clicked, the script uses the media URL and the selected download mode: "open" opens the URL in a new tab using GM_openInTab, while "download" also opens the URL in a new tab (the browser's download behavior is triggered by the media URL). The script uses a WeakSet to track processed story viewers and avoid duplicate buttons. A MutationObserver watches for DOM changes and re-scans for new stories as the user navigates.

THE PANEL

The settings panel is built with BotGentz's BGPanel component. It is draggable via its header, allowing you to reposition it anywhere on the screen. The panel snaps to the left edge by default but can be moved freely. Click the gear emoji to collapse the panel into a small bubble, and click the bubble to expand it again. The panel remembers its position per page session. Press the Escape key to quickly close or minimize the panel. The panel includes a status flash bar that provides visual feedback when settings are changed or actions are performed. All settings save automatically via GM_setValue.

PLEASE NOTE

This script requires the free BotGentz browser extension to run. It does not function as a standalone Chrome extension and does not use chrome.* APIs. Instagram frequently updates its interface, which may affect the selectors used to find the story viewer and media elements. If the download button stops appearing, please check for script updates. The script extracts media URLs from the page—these URLs may be temporary and could expire. The "Direct download" mode opens the URL in a new tab; the browser's built-in download handling will determine if it downloads or displays the media. The script stores only your preferences via GM_setValue. No data is sent externally—all data is stored locally in your browser. The script never reads or writes password fields, hidden inputs, or file inputs. All DOM operations use safe methods (style properties, textContent, appendChild) and never use innerHTML.