Mô tả
This plugin allows designers and developers to overlay a Figma-style layout grid on the frontend of their WordPress site to visually test alignment and spacing. It’s useful for responsive design testing and pixel-perfect comparisons to your original designs.
- Enable or disable the grid overlay at any time
- Configure separate values for Mobile, Tablet, Desktop, and Extended screens
- Set number of columns, gutter width, and outer margin
- Lightweight and clean — outputs only what’s needed
Ảnh màn hình
Settings screen with per-screen options
Cài đặt
- Upload the plugin folder to
/wp-content/plugins/grid-overlay/ - Activate the plugin through the “Plugins” menu
- Go to Settings Grid Overlay and configure your options
Hỏi đáp
-
Will the grid show for visitors?
-
Yes — the overlay appears on the frontend when enabled. You can disable it anytime from the settings page.
-
Can I restrict the overlay to admin users only?
-
This version shows the grid for everyone if enabled. A future update might include visibility filters.
Đánh giá
Không có đánh giá nào cho plugin này.
Người đóng góp & Lập trình viên
“Grid Overlay – Figma Style Layout Grid for WordPress” là mã nguồn mở. Những người sau đã đóng góp vào plugin này.
Những người đóng góp
Dịch “Grid Overlay – Figma Style Layout Grid for WordPress” sang ngôn ngữ của bạn.
Muốn tham gia phát triển?
Duyệt code, check out SVN repository, hoặc theo dõi nhật ký phát triển qua RSS.
Nhật ký thay đổi
1.1.0
- Major improvement: Refactored the frontend grid overlay to use real DOM-based columns instead of a repeating background gradient.
- The new DOM-based method improves alignment accuracy by adjusting for scrollbar width differences (using corrected 100vw calculations).
- This change resolves longstanding inconsistencies when aligning layouts against the grid across different browsers and screen sizes.
1.0.0
- Initial release