# A transparent "layer" of grid viewing, to help design

**URL:** <https://forum.pinegrow.com/t/a-transparent-layer-of-grid-viewing-to-help-design/622>\
**Category:** Feature Request\
**Created:** [January 18, 2017, 9:26am UTC](https://forum.pinegrow.com/t/a-transparent-layer-of-grid-viewing-to-help-design/622 "2017-01-18T09:26:47Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![Rob](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/rob/32/9_2.png) [@Rob](https://forum.pinegrow.com/u/Rob)\
**Post date:** [January 23, 2017, 5:52pm UTC](https://forum.pinegrow.com/t/a-transparent-layer-of-grid-viewing-to-help-design/622/4 "2017-01-23T17:52:03Z")

</div>

@JoseFR try this out.

Credit goes to @BATLABOR for this I’m just doing a short write up and adding a few screenshots!

1. Create new page in Pinegrow and save
2. Click Page \> edit code \> then paste the two lines of code below into the head of the page, I placed it just before the closing tag

`<script src="http://alefeuvre.github.com/foundation-grid-displayer/gd-bookmarklet.min.js"></script>`

`<link href="http://alefeuvre.github.com/foundation-grid-displayer/stylesheets/gd-bookmarklet.min.css" rel="stylesheet">`

1. Move your cursor over the top of the page you’ve created and a container appears that will allow you to select a framework, e.g. Bootstrap 3 if you are using BS 3
2. Add rows, columns, etc. to your layout and enjoy your grid layer!

**Screenshots:**

Adding code and how it looks in PG:

 ![](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/1X/af557ef1c5f25f43181c50fe5902acae8492e141.png)

* * *
Chose your framework:

 ![](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/1X/8b858b733f2a923ac511e3bbcd6147945d5260a5.png)

* * *
Edit display of grid, colour, etc.

 ![](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/1X/1feb7c486c0ec398d6799ccb0a78cbd135666537.png)

---

_[View the full topic](https://forum.pinegrow.com/t/a-transparent-layer-of-grid-viewing-to-help-design/622)._