Hello and welcome, I wanted to write this post to share my guide grids setup I use for Bootstrap 3.3.2 with the GuideGuide plug-in for Photoshop CC 2014.

Once you have installed the GuideGuide.me Plug-in into Photoshop start it but going to Window > Extensions > GuideGuide, at the of the plug-in window you should see "Custom", click it and you should see a place to put the below code.

1170 px Grid 

  $v = | 65px | 15px | 15px |
$vC = | 65px |
200px | 15px | 15px | $v*11 | $vC | 15px | 15px | 200px ( vlp, | ~ )

NOTE: I set my photoshop document width to 1570px to allow for 200px on both sides of my layout.

970 px Grid 

  $v = | 48px | 15px | 15px |
$vC = | 48px |
200px | 17px | 15px | $v*11 | $vC | 15px | 17px | 200px ( vlp, | ~ )

NOTE: I set my photoshop document width to 1370px to allow for 200px on both sides of my layout.

750 px Grid 

  $v = | 30px | 15px | 15px |
$vC = | 30px |
200px | 15px | 15px | $v*11 | $vC | 15px | 15px | 200px ( vlp, | ~ )

NOTE: I set my photoshop document width to 1150px to allow for 200px on both sides of my layout.

Importing My Sets

If you want to save yourself some time and import the 3 above sets, open the Plug-in click on the cog, then click on Import Sets and copy and paste the below code:

  {"Default":{"name":"Default","sets":{"cbc5507de150aa324c323dea5246f8a7f2dd3618":{"name":"Bootstrap 1170","string":"$v = | 65px | 15px | 15px |\n$vC = | 65px |\n200px | 15px | 15px | $v*11 | $vC | 15px | 15px | 200px ( vlp, | ~ )","id":"cbc5507de150aa324c323dea5246f8a7f2dd3618"},"6a188b701a91b394b3c1608844c33ad416d21f25":{"name":"Bootstrap 970","string":"$v = | 48px | 15px | 15px |\n$vC = | 48px |\n200px | 17px | 15px | $v*11 | $vC | 15px | 17px | 200px ( vlp, | ~ )","id":"6a188b701a91b394b3c1608844c33ad416d21f25"},"fbfee59f64b58b94682597dc8e6cf67ba84a65af":{"name":"Bootstrap 750","string":"$v = | 30px | 15px | 15px |\n$vC = | 30px |\n200px | 15px | 15px | $v*11 | $vC | 15px | 15px | 200px ( vlp, | ~ )","id":"fbfee59f64b58b94682597dc8e6cf67ba84a65af"}}}}

Assets