تفصیل
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
اسکرین شاٹس
Settings screen with per-screen options
انسٹالیشن
- 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
عمومی سوالات
-
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.
جائزے
There are no reviews for this plugin.
شراکت دار اور ڈیویلپرز
“Grid Overlay – Figma Style Layout Grid for WordPress” اوپن سورس سافٹ ویئر ہے۔ مندرجہ ذیل لوگوں نے اس پلگ ان میں حصہ لیا:
شراکت دار
“Grid Overlay – Figma Style Layout Grid for WordPress” کا اپنی زبان میں ترجمہ کریں۔
ڈویلپمینٹ میں دلچسپی ہے؟
کوڈ براؤز کریں، ایس این وی ریپوزیٹری کو چیک کریں یا ڈویلپمینٹ لاگ کو سبسکرائب کریں بذریعہ آر ایس ایس۔
چینج لاگ
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