8.13 Dropfiles Reformat Plugin

System - Dropfiles Reformatter

User Guide & Documentation

Overview of Functionality

The System - Dropfiles Reformatter plugin automatically intercepts default Dropfiles HTML table outputs on the front end of your Joomla site and reformats them into responsive, modern card layouts.

Key features include:

  • Mobile-First Layout: Converts wide tables into stacked, accessible flex cards.
  • Preserved File Titles: Retains exact HTML title casing (e.g., proper acronyms and reference codes) without forced capitalization.
  • File Type Recognition: Automatically detects file extensions and assigns distinct visual badges and FontAwesome icons (PDF, ZIP, Word, Excel, PowerPoint, Images, etc.).
  • Automated Accessibility: Dynamically calculates high-contrast text and border colours based on your chosen background hues to meet WCAG contrast standards.
  • Custom Styling Controls: Full administrative control over theme colours and border radii for card rows and action buttons.

Dependencies

To run this plugin properly, ensure your environment meets the following requirements:

  • Joomla! Version: 4.x or 5.x
  • PHP Version: 8.0 or higher
  • Prerequisite Extensions: Dropfiles component by JoomUnited
  • Category Theme Setting: In the Dropfiles backend, file categories must be set to use either the Table or Simplex theme.
  • Icon Library: FontAwesome 6 (must be loaded by your site template or the Dropfiles component for file icons to render)

Limitations

  • Supported Themes Only: The reformatter only targets categories configured with the Table or Simplex themes. Categories set to tree, grid, or other custom Dropfiles themes will intentionally retain their default layout. This is a deliberate feature to allow selective reformatting across your site.
  • Frontend Scope Only: Reformatting applies strictly to the site frontend; the administrative backend Dropfiles management interface remains unchanged.
  • Dynamic Page Updates: The plugin automatically detects when new files or lists load on your page. However, if a custom script or page builder reloads content in an unusual way, a brief manual page refresh may occasionally be needed to reformat the cards.
  • File Title Cleanup: The plugin automatically removes clutter from titles—such as removing a leading "pdf " prefix. If a file uses a non-standard naming format, the plugin will simply display the title as originally written in Dropfiles to ensure nothing important is cut off.

Installation Process

  1. Log in to your Joomla Administrator panel.
  2. Navigate to System Install Extensions.
  3. Under the Upload Package File tab, drag and drop the plugin .zip package (containing dropfilesreformat.php, dropfilesreformat.xml, script.php, and the media directory).
  4. Once installed, go to System Plugins.
  5. Search for System - Dropfiles Reformatter.
  6. Click the plugin name, toggle the status to Enabled, and save your settings.

Uninstall Process

  1. Log in to your Joomla Administrator panel.
  2. Navigate to System Manage Extensions.
  3. Search for Dropfiles Reformatter.
  4. Select the checkbox next to System - Dropfiles Reformatter.
  5. Click Uninstall in the top toolbar.

Configuration of Plugin

  1. Go to Plugins (System Plugins).
  2. Open System - Dropfiles Reformatter.
  3. Adjust the styling parameters across the two configuration tabs (Card Styling and File Type Badge Colours).
  4. Click Save or Save & Close.

Available Options for Configuration

Card Styling Tab

Option Name Type Default Value Description
Row Background Colour Colour Picker #1e40af The base background colour for the main document card row.
Row Hover Colour Colour Picker #1d4ed8 Background colour applied when a user hovers over a card row.
Main Block Border Radius (px) Number 8 Corner rounding in pixels for the main document card container (0–50px).
Download Button Colour Colour Picker #f59e0b Background colour for the Download button.
Preview/Open Button Colour Colour Picker #374151 Background colour for the Preview/Open button.
Button Border Radius (px) Number 6 Corner rounding in pixels for action buttons (0–50px).

File Type Badge Colours Tab

Option Name Type Default Value Description
PDF Badge Colour Colour Picker #dc2626 Background colour for .pdf document badges.
ZIP / Archive Badge Colour Colour Picker #d97706 Background colour for .zip, .rar, and .7z archive badges.
Word (DOC/DOCX) Badge Colour Colour Picker #38bdf8 Background colour for Microsoft Word file badges.
Excel (XLS/XLSX/CSV) Badge Colour Colour Picker #16a34a Background colour for spreadsheet file badges.
PowerPoint Badge Colour Colour Picker #ea580c Background colour for .ppt and .pptx presentation badges.
Image Files Badge Colour Colour Picker #9333ea Background colour for .png, .jpg, .jpeg, .gif, and .svg badges.
Other / Generic Badge Colour Colour Picker #6b7280 Default background colour for unrecognized file extensions.