外掛標籤
開發者團隊
② 後台搜尋「Mango Masonry Gallery for Elementor」→ 直接安裝（推薦）
原文外掛簡介
Mango Masonry Gallery adds a clean, responsive masonry gallery to your site. Images keep their natural aspect ratio and flow into columns, and clicking an image opens it in a full-screen lightbox.
Features:
Elementor widget with a live masonry preview in the editor
Responsive columns (1–6) for desktop, tablet and mobile
Adjustable gap, corner radius and image size
Full-screen lightbox with previous/next buttons, keyboard navigation (←, →, Esc) and an image counter
Custom hover overlay, lightbox accent and lightbox background colors
Accessible: keyboard-focusable images, ARIA labels, focus is returned after closing the lightbox
No jQuery and no external libraries; CSS and JS load only on pages that show a gallery
Works without Elementor through the [mango_masonry_gallery] shortcode
Shortcode
[mango_masonry_gallery ids="12,34,56" columns="3"]
Available attributes:
ids – comma-separated attachment IDs (required)
columns – desktop columns, 1–6 (default 3)
columns_tablet – tablet columns (default: 2, or fewer if columns is lower)
columns_mobile – mobile columns (default 1)
gap – space between images, e.g. 20px (default 7px)
radius – image corner radius, e.g. 4px (default 2px)
size – registered image size used in the grid (default large)
overlay – hover overlay color (default rgba(20,20,20,0.45))
accent – lightbox controls color (default #d4b5a5)
lightbox_bg – lightbox background color (default rgba(10,7,5,0.96))
