DragFolio – Drag & Drop Portfolio Showcase Wordpress Plugin - Rating, Reviews, Demo & Download
Plugin Description
DragFolio is a lightweight, zero-bloat portfolio plugin for WordPress. Add your projects and present them in a stunning responsive grid — then reorder them in real time by dragging, right on your live site.
No page builders. No bloated dependencies. Just drop the shortcode in and go.
Key Features
- Custom Project Post Type — dedicated portfolio projects separate from your blog posts
- 4 fields per project — Featured Image, Title, Description, and a fully custom Button (label + URL)
- Live drag-to-reorder on the frontend — logged-in editors can drag cards to rearrange without ever opening the dashboard
- Drag-to-reorder in the admin panel — visual card grid with grab handles and auto-save via AJAX
- Responsive grid — 1 to 4 columns, stacks gracefully on mobile
- Shortcode powered — works in any page, post, or widget area
- Lightweight — no external libraries beyond jQuery UI Sortable (already bundled in WordPress)
Shortcode Usage
Place this shortcode on any page or post:
[dragfolio]
Shortcode Options
columns– Number of columns (1–4). Default:3draggable– Allow logged-in editors to drag-reorder on the frontend. Default:true
Examples:
[dragfolio columns="2"]
[dragfolio columns="4" draggable="false"]
Frontend Reordering
When a user with the edit_posts capability is logged in, a subtle drag hint appears above the grid and each card shows a grab handle on hover. Drag any card to a new position — the order saves automatically via AJAX with no page reload required.
Customization
All colors are CSS custom properties on :root in the frontend stylesheet. Override them in your theme’s CSS:
:root {
--dragfolio-accent: #ff6b6b;
--dragfolio-accent-dark: #e84040;
--dragfolio-card-bg: #ffffff;
--dragfolio-text-h: #111111;
--dragfolio-text-body: #555555;
}
Screenshots
Admin Panel — Visual card grid with drag-to-reorder handles and one-click shortcode copy
Add / Edit Project — Title, Featured Image, Description, Button Label and Button URL fields
Frontend Grid (3 columns) — Dark editorial card design with lime CTA buttons
