Fluxshot Chrome Extension

Introduction #

Redmineflux Fluxshot is a powerful Chrome extension that seamlessly integrates with Redmine, revolutionizing the way you capture screenshots and create issues directly from your browser. With Fluxshot, you can effortlessly provide feedback, report bugs, and update existing issues without ever leaving your current web page.

In addition to its core screenshot and issue-creation capabilities, Fluxshot now includes a suite of productivity and personalization features — including a rich text editor, timer-based capture, one-click clipboard copy, dark mode, color themes, and a resizable sidebar — all designed to make your workflow faster and more comfortable.

Version Compatibility #

Redmine Versions #

Series	Supported
4.0.x, 4.1.x, 4.2.x	✅
5.0.x, 5.1.x	✅
6.0.x, 6.1.x	✅

Chrome Extension #

• Google Chrome 88 or later (Manifest V3)
• Chromium-based browsers (Edge, Brave) are also compatible

Installation #

Install the Chrome Extension #

1. Open Google Chrome on your computer.
2. Go to the Chrome Web Store.
3. Search for “Fluxshot” in the search bar.
4. Click “Add to Chrome” next to the Fluxshot extension.
5. A confirmation dialog will appear — click “Add Extension” to proceed.
6. Fluxshot will be downloaded and installed. Its icon will appear in the Chrome toolbar.

Tip: If the icon is not visible, click the puzzle piece (🧩) icon in the toolbar and pin Fluxshot to keep it visible at all times.

Install the Redmine Plugin #

The Chrome extension requires the redmineflux_fluxshot Redmine plugin to be installed on your Redmine server. The plugin exposes the API endpoints that the extension uses to create and update issues.

Step 1 — Download the plugin

Download redmineflux_fluxshot from redmineflux.com. The plugin comes as a ZIP file.

Step 2 — Extract to the plugins directory

# Extract the ZIP into Redmine's plugins folder
# Do not rename the plugin folder
cp -r redmineflux_fluxshot /path/to/redmine/plugins/

Step 3 — Install dependencies

cd /path/to/redmine
bundle install

Step 4 — Run database migrations

# Production
RAILS_ENV=production bundle exec rails redmine:plugins:migrate

# Development

RAILS_ENV=development bundle exec rails redmine:plugins:migrate

Step 5 — Restart Redmine

# Passenger
touch tmp/restart.txt

# Puma / systemd

systemctl restart redmine

# Rails development server

rails s

rails s

Step 6 — Enable the Redmine REST API

Go to Redmine → Administration → Settings → API and make sure “Enable REST web service” is checked.

Step 7 — Verify the installation

Open a browser and visit:

https://your-redmine.com/plugin_info.json

You should see:

{ "installed": true, "version": "1.1.0" }

If you see this response, the plugin is installed and the extension can connect to it.

Configuration & First Login #

1. Open any web page in Chrome.
2. Click the Fluxshot icon in the Chrome toolbar. A screenshot of the current tab is captured immediately and the editor opens in a new tab.
3. On first use, a login modal appears:
   • Enter your Redmine Base URL (e.g. https://your-redmine.com)
   • Enter your Redmine Username and Password
   • Click Login
4. Fluxshot authenticates against your Redmine server and stores your API key securely in local browser storage. You will not need to log in again unless you explicitly log out.
5. Once logged in, the editor shows your screenshot on the left and the sidebar with three tabs (Add Issue, Update Issue, Templates) on the right.

To log out: click the logout icon (→) in the top-right corner of the sidebar.

Interface Overview #

Header buttons (top-right of sidebar):

Icon	Action
⏱ Timer	Capture with a 3 / 5 / 10 second delay
⎘ Copy	Copy the screenshot to the clipboard
⚙ Settings	Open settings panel (Dark Mode, Color Theme)
→ Logout	Log out of Fluxshot

How To #

Capture a Screenshot and Add a New Issue #

1. Open the web page you want to capture.
2. Click the Fluxshot icon in the Chrome toolbar.
3. The current tab is captured and the editor opens.
4. (Optional) Annotate the screenshot using the Painterro toolbar on the left.
5. In the right sidebar, make sure the Add Issue tab is selected.
6. Fill in the required fields:
   • Project — select from your accessible Redmine projects
   • Tracker — e.g. Bug, Feature, Task
   • Subject — a short title for the issue (required)
   • Description — use the rich text editor for formatted content
   • Assignee — (optional) assign to a project member
   • Issue — (optional) choose a parent issue to create a sub-issue
   • Templates — (optional) choose a saved template to pre-fill Subject and Description
7. Click one of the action buttons:
   • Save — creates the issue, shows a success toast, and closes the editor tab
   • Save & Open — creates the issue and navigates to its Redmine page

Update an Existing Issue #

1. Open the web page you want to capture.
2. Click the Fluxshot icon to open the editor.
3. (Optional) Annotate the screenshot.
4. In the sidebar, click the Update Issue tab.
5. Fill in the fields:
   • Project — select a project
   • Tracker — filter issues by tracker type
   • Issues — select the issue to update from the searchable dropdown (shows issue ID and subject)
   • Subject — pre-filled from the selected issue, editable
   • Description — pre-filled from the selected issue, editable
6. Click one of the action buttons:
   • Update — attaches the screenshot to the issue, saves changes, shows a success toast, and closes the editor tab
   • Update & Open — updates the issue and navigates to its Redmine page

Use Templates #

Templates let you save reusable Subject and Description combinations so you can fill in common issue types with one click.

Create a Template

1. Open the editor (click the Fluxshot icon on any page).
2. Click the Templates tab in the sidebar.
3. Fill in:
   • Template Name — a display name (e.g. “Bug Report”, “Feature Request”)
   • Subject — the default subject text for this template
   • Description — the default description (supports rich text formatting)
4. Click Create. The new template card appears below the form.

Use a Template in Add Issue

1. Go to the Add Issue tab.
2. In the Templates dropdown, select the saved template.
3. The Subject and Description fields are automatically pre-filled.

Edit a Template

1. Go to the Templates tab.
2. Find the template card and click the pencil (✏) icon.
3. The form pre-fills with the existing values. Make your changes.
4. Click Update.

Delete a Template

1. Go to the Templates tab.
2. Click the trash (🗑) icon on the template card.
3. A confirmation modal appears showing the template name. Click Delete to confirm, or Cancel to go back.

Templates are private — each user sees and manages only their own templates.

Annotate and Edit Screenshots #

After the editor opens, use the Painterro toolbar on the left side to annotate the screenshot before submitting:

Tool	What it does
Text	Add text annotations — choose font, size, and colour
Rectangle / Ellipse	Draw shapes to highlight areas
Arrow	Draw directional arrows to point at elements
Pencil / Brush	Free-hand drawing
Highlighter	Semi-transparent highlight over areas
Crop	Crop the screenshot to a specific region
Blur	Blur sensitive information
Colour Picker	Choose stroke and fill colours
Eraser	Erase drawn elements

Once you are happy with the annotations, proceed to fill in the issue form in the sidebar — the annotated version of the screenshot is automatically used as the attachment.

Use the Rich Description Editor #

The Description field in all three tabs (Add Issue, Update Issue, Templates) includes a WYSIWYG formatting toolbar:

Button	Keyboard feel	Effect
H1	Heading 1	Large section heading
H2	Heading 2	Sub-section heading
B	Bold	Bold text
I	Italic	Italic text
U	Underline	Underlined text
•	Bullet list	Unordered list
1.	Numbered list	Ordered list
🔗	Link	Insert a hyperlink (prompts for URL)

Descriptions are saved as Redmine-compatible Markdown format and render correctly inside Redmine issues.

Copy Screenshot to Clipboard #

1. After the editor opens (and optionally after annotating), click the copy icon (⎘) in the header.
2. The current screenshot (including any annotations) is copied to your system clipboard.
3. A toast notification confirms: “Screenshot copied to clipboard”.
4. Paste it anywhere — Slack, email, Figma, Notion, Word, etc.

The Painterro editor stays open after copying — you can continue annotating or proceed to create an issue.

Capture with a Timer Delay #

Use the timer when you need to capture a state that disappears when you switch tabs — for example, a dropdown menu, a tooltip, or a hover effect.

1. Click the timer icon (⏱) in the header.
2. Choose a delay: 3 sec, 5 sec, or 10 sec.
3. The extension automatically switches back to the original tab.
4. A full-screen countdown overlay appears on top of the page.
5. After the countdown reaches zero, the screenshot is taken automatically.
6. The editor tab re-activates with the fresh screenshot loaded into the editor.

To abort the countdown, click the Cancel button in the overlay.

Switch Dark Mode #

1. Click the settings icon (⚙) in the sidebar header.
2. Toggle Dark Mode on or off.
3. The entire sidebar — forms, dropdowns, buttons, modals, and toast notifications — switches to a dark theme instantly.
4. Your preference is saved and restored the next time you open the extension.

Change Color Theme #

1. Click the settings icon (⚙) in the sidebar header.
2. Under Accent Color, click one of the five colour swatches:

Swatch	Theme
🔵	Blue (default)
🟣	Purple
🟢	Green
🟠	Orange
🔴	Rose

1. The chosen colour is applied instantly to buttons, active tab indicators, focus rings, links, and form borders throughout the sidebar.
2. Your preference is saved and restored the next time you open the extension.

Resize the Sidebar #

The sidebar width can be adjusted by dragging its left edge:

1. Hover over the left edge of the sidebar — the cursor changes to a resize cursor (↔).
2. Click and drag left to make the sidebar wider or right to make it narrower.
3. The Painterro annotation editor automatically resizes to fill the remaining space.
4. Release the mouse to confirm. The new width is saved and restored next session.

Minimum width: 260 px  |  Maximum width: 520 px

Troubleshooting #

Extension icon not visible #

Click the puzzle piece (🧩) icon in the Chrome toolbar, find Fluxshot, and click the pin icon to keep it visible.

Login fails — “Plugin not found” #

The Redmine plugin is not installed or not accessible. Visit https://your-redmine.com/plugin_info.json in your browser. If it returns a 404, install the plugin and restart Redmine.

Login fails — “Invalid credentials” #

Check that your Redmine username and password are correct. Ensure the Redmine REST API is enabled under Administration → Settings → API.

Editor opens but the screenshot is blank / white #

Reload the extension: go to chrome://extensions, find Fluxshot, and click the ↺ reload button. If the issue persists, remove and re-add the extension to clear the cache.

Timer capture shows a white screenshot #

Ensure the source tab is still open and not navigating when the countdown finishes. The extension must be able to capture the source tab at the moment the timer fires.

Copy to clipboard shows an error toast #

The browser requires the Clipboard permission to be granted. Go to Chrome’s site settings and ensure clipboard access is allowed for extension pages, or try the action while the editor tab is in focus.

Issues not loading in Update Issue tab #

Ensure the selected project and tracker have open issues assigned to your user. Non-admin users see only issues assigned to them.

Extension extension is enabled but not working #

1. Go to chrome://extensions and confirm Fluxshot is Enabled.
2. Clear the browser cache: Chrome Settings → Privacy and Security → Clear Browsing Data.
3. Disable other extensions one by one to check for conflicts.
4. Restart Chrome.

Update or reinstall #

• To update: open the Chrome Web Store, search for Fluxshot, and click Update if available.
• To reinstall: right-click the Fluxshot icon → Remove from Chrome, then reinstall from the Chrome Web Store.

Frequently Asked Questions (FAQs) #

Q: What is Fluxshot?

A: Fluxshot is a Chrome extension that integrates with Redmine to let you capture browser screenshots, annotate them, and create or update Redmine issues — all without leaving the current webpage.

Q: Do I need to install anything on the Redmine server?

A: Yes. The redmineflux_fluxshot Redmine plugin must be installed on your Redmine server. It provides the API endpoints the extension uses to create issues and manage templates.

Q: Can I edit the screenshot before submitting?

A: Yes. The Painterro annotation editor gives you a full set of tools — text, shapes, arrows, pencil, highlighter, blur, and crop — to mark up the screenshot before it is attached to the issue.

Q: Can I copy the screenshot without creating an issue?

A: Yes. Click the copy icon (⎘) in the header to copy the current annotated screenshot to your clipboard. You can then paste it anywhere without submitting anything to Redmine.

Q: What is the Timer Capture feature used for?

A: Use it when the element you want to capture (e.g. a dropdown, tooltip, or hover menu) disappears when you switch browser tabs. The timer lets you set up the screenshot and then trigger it automatically after 3, 5, or 10 seconds — without switching tabs manually.

Q: Can I create and reuse issue templates?

A: Yes. Go to the Templates tab to create templates with a preset Subject and Description. When adding a new issue, select the template from the dropdown to pre-fill those fields.

Q: Are my templates visible to other users?

A: No. Templates are private — each Redmine user sees and manages only their own templates.

Q: Can I use Dark Mode?

A: Yes. Click the ⚙ settings icon and toggle Dark Mode. Your preference is saved for future sessions.

Q: Can I change the sidebar color?

A: Yes. Click the ⚙ settings icon and choose from five accent colours: Blue, Purple, Green, Orange, and Rose. Your selection is saved across sessions.

Q: Can I resize the sidebar?

A: Yes. Drag the left edge of the sidebar to make it wider or narrower. The annotation editor resizes automatically to fill the available space.

Q: Where is my Redmine API key stored?

A: The API key is stored in chrome.storage.local — it stays on your device, inside the browser, and is never sent to any third-party server.

Q: How do I log out?

A: Click the logout icon (→) in the top-right corner of the sidebar. This clears all stored credentials and returns you to the login screen.

Uninstallation #

Remove the Chrome Extension #

1. Open Chrome and click the puzzle piece icon (🧩) in the toolbar.
2. Find Fluxshot in the list of extensions.
3. Click the three-dot menu (⋮) next to Fluxshot.
4. Select “Remove from Chrome”.
5. Confirm by clicking “Remove” in the dialog that appears.

Alternatively, right-click the Fluxshot icon in the toolbar and choose “Remove from Chrome”.

Remove the Redmine Plugin #

Step 1 — Revert database migrations

cd /path/to/redmine
bundle exec rake redmine:plugins:migrate NAME=redmineflux_fluxshot VERSION=0 RAILS_ENV=production

⚠ Make a database backup before running this command. Reverting will drop the fluxshot_templates table and all saved templates.

Step 2 — Delete the plugin folder

rm -rf /path/to/redmine/plugins/redmineflux_fluxshot

Step 3 — Restart Redmine

touch tmp/restart.txt
# or
systemctl restart redmine

Conclusion #

Redmineflux Fluxshot is a versatile Chrome extension that simplifies the entire process of capturing, annotating, and reporting issues directly from the browser into Redmine.

Core capabilities:

• One-click screenshot capture and annotation using the full-featured Painterro editor
• Create new Redmine issues or update existing ones with the annotated screenshot attached
• Reusable templates to speed up common issue types

New productivity features:

• Rich text editor for formatted Markdown descriptions with headings, lists, bold, italic, underline, and links
• Toast notifications showing the created or updated issue number after every save
• Timer capture (3 / 5 / 10 seconds) for capturing hover states and dynamic UI elements
• Copy to clipboard for sharing screenshots instantly without creating an issue
• Dark mode for comfortable use in low-light environments
• Color theme picker (Blue, Purple, Green, Orange, Rose) for UI personalization
• Resizable sidebar to balance annotation space and form space to your preference

Fluxshot keeps your entire bug reporting and feedback workflow inside the browser — no switching between tools, no manual uploads, and no context loss.