Chrome Web Extension and Firefox Browser Addon for Django Files to view recent uploads, shorten URLs, and upload any Image, Video or Audio files with right click.
Important
This Web Extension is designed to work with Django Files.
All Chromium Based Browsers can install the extension from the Chrome Web Store.
Mobile browser support available for Firefox and Kiwi.
- View Recent Uploads on Popup
- Preview Popup Images on Hover.
- Set Private, Password, and Expiration.
- Customize Popup Icons, Width and Number of Files.
- Right Click any Image, Video, or Audio to Upload.
- Upload Directly to Albums with Context Menu.
- Right Click any URL to Shorten.
- Automatically Authenticate with Django Files.
- Automatic Dark/Light Mode based on Browser Settings.
Tip
Don't see your feature here? Request one on the Feature Request Discussion.
You can pin the Addon by clicking the Puzzle Piece
, find the Django Files icon
, then;
Firefox, click the Settings Wheel
and Pin to Toolbar
.
Chrome, click the Pin
icon.
More Information on the Website: https://django-files.github.io/extension/
To automatically configure the web extension to work with your Django Files instance do the following:
- Log in to your Django Files Instance
- Click the Popup Icon (from above)
- Click
Add Auth from Current Site
The addon should now be configured to work with your Django Files instance.
You can now click the Django Files icon to view your recent uploads or open Options.
Right-click on any Image, Video, Audio, or URL upload to Django Files or Shorten URL.
Alternatively, you can open the Options page and add your URL and Token.
For help using the web extension, utilize any these resources:
- Documentation: https://django-files.github.io/extension/
- Q&A Discussion: https://github.com/django-files/web-extension/discussions/categories/q-a
- Request a Feature: https://github.com/django-files/web-extension/discussions/categories/feature-requests
If you are experiencing an issue/bug or getting unexpected results, use:
- Report an Issue: https://github.com/django-files/web-extension/issues
- Chat with us on Discord: https://discord.gg/wXy6m2X8wY
- Provide Anonymous Feedback: https://cssnr.github.io/feedback
Logs can be found inspecting the page (Ctrl+Shift+I), clicking on the Console, and; Firefox: toggling Debug logs, Chrome: toggling Verbose from levels dropdown.
Note: When providing anonymous feedback there is no way to follow up and get more information unless you provide a contact method.
Quick Start
First, clone (or download) this repository and change into the directory:
git clone https://github.com/django-files/web-extension.git
cd web-extension
Second, install the dependencies:
npm install
Finally, to run Chrome or Firefox with web-ext, run one of the following:
npm run chrome
npm run firefox
Additionally, to Load Unpacked/Temporary Add-on make a manifest.json
and run from the src folder, run one of the following:
npm run manifest:chrome
npm run manifest:firefox
Chrome: https://developer.chrome.com/docs/extensions/get-started/tutorial/hello-world#load-unpacked
Firefox: https://extensionworkshop.com/documentation/develop/temporary-installation-in-firefox/
For more information on web-ext, read this documentation.
To pass additional arguments to an npm run
command, use --
.
Example: npm run chrome -- --chromium-binary=...
Install the requirements and copy libraries into the src/dist
directory by running npm install
.
See gulpfile.js for more information on postinstall
.
npm install
To create a .zip
archive of the src directory for the desired browser run one of the following:
npm run build
npm run build:chrome
npm run build:firefox
For more information on building, see the scripts section in the package.json file.
- Build or Download a Release.
- Unzip the archive, place the folder where it must remain and note its location for later.
- Open Chrome, click the
3 dots
in the top right, clickExtensions
, clickManage Extensions
. - In the top right, click
Developer Mode
then on the top left clickLoad unpacked
. - Navigate to the folder you extracted in step #3 then click
Select Folder
.
- Build or Download a Release.
- Unzip the archive, place the folder where it must remain and note its location for later.
- Go to
about:debugging#/runtime/this-firefox
and clickLoad Temporary Add-on...
- Navigate to the folder you extracted earlier, select
manifest.json
then clickSelect File
. - Optional: open
about:config
search forextensions.webextensions.keepStorageOnUninstall
and set totrue
.
If you need to test a restart, you must pack the addon. This only works in ESR, Development, or Nightly. You may also use an Unbranded Build: https://wiki.mozilla.org/Add-ons/Extension_Signing#Unbranded_Builds
- Run
npm run build:firefox
then useweb-ext-artifacts/{name}-firefox-{version}.zip
. - Open
about:config
search forxpinstall.signatures.required
and set tofalse
. - Open
about:addons
and drag the zip file to the page or choose Install from File from the Settings wheel.