Pinegrow Community Support Forum

Pinegrow Snap Shots no clue what to do with it?


Even after reading the documentation and downloading the demo of Snap Shots I wonder what I can do with it. Are we talking about saving snippets? Then I would name it “Snippet Shots”, but I still don’t see how I can save a part of HTML and automatically save the CSS that comes with it (and nothing more) with it.
What can I do with the saved HTML page?
Please can someone from the Pinegrow staff elaborate?


I’ve been playing with it and not sure if it can save snippets of the page, would be cool if you could, and maybe it can but it does not pull down the css - instead you can grab the css you need by saving it to the custom css stylesheet in Pinegrow (click on the html tag and it shows the css for it) - only dipped into it and I was not all that impressed at first but I quickly realised this is an incredibly useful tool and has a wide range of use cases - I just used it a moment ago to grab a block of code from a clients WordPress template for suggested changes- the code and layout came out perfect- and sent back how the results would look, so it’s already paid for itself for me and I will be buying it

Pinegrow Snapshots saves the HTML of the current app state.
For example, if you click a button that opens a modal and then take the snapshot, the open modal will be saved in the snapshot.

On the other hand, saving a remote page in Pinegrow Web Editor will save the source code of the page without any dynamic elements that were created / changed by Javascript code on the page.

Another difference is that Pinegrow Web Editor struggles with opening certain types of web apps, for example React apps and we plan to keep this aspect as Pinegrow Snapshots territory in the future. (the way how snapshots works is very different from Pinegrow)

I hope these clarifications will help you decide whether or not Pinegrow Snapshots can be integrated into your workflow.

Note: We have a documentation about Pinegrow Snapshots available here + a detailed use case is presented on the application homepage

We use “HTML Rapid Prototyping” strait out/in of Bootstrap. I rather show the real working Modal then a “Snap Shot”. Still don’t get it, Bootstrap and it’s components are excellent for that job.
What is the advantage of a “Snap Shot”? Compare to the real deal? It reminds me of Prototyping in Sketch or Photoshop (read twice as much work!) that we stopped doing.


Snapshots is great news for my workflow. I plan to use it after most of the static template design is done in PG Web Editor and the corresponding parts are converted to php templates with dynamic content.
Somehow a piece was missing between creating/designing a static page and working with dynamic pages (powered by a cms). Snapshots builds a nice bridge to these dynamically generated pages.
It provides a more convenient way to style and edit some things with PG Web Editor, even if the page comes from a local or remote web server.
Of course, this all depends on your workflow, you might not need it.

What about a text editor like Sublime Text 3 in combination with Mamp Pro and
? ( UnderStrap - WordPress/Bootstrap 4 Framework) and work strait in to Bootstrap in WordPress?
It all sounds very complicated and lacks code knowledge.If I want to show something for eventual modification we exchange the WordPress folder that can be exported from Mamp Pro and imported in Mamp Pro elsewhere. Still don’t get what I’m missing.

Better first implement a responsive images and srcset generator in Pinegrow editor and take care of the fact that you can’t even use a PHP include.

Purchased the Pinegrow Pro WP version 2 months ago and went back to Sublime.

Just had an opportunity to read both of your posts. I’m using it to quickly grab code that I can integrate into a project to add onto pages, blogs, etc., where it’s a new client and they need a continuation of work to be performed. This is helpful for clients we haven’t worked with before, but they don’t need to rip everything out. It helps to get a better understanding of the layouts and what’s going on. Also, for those who used visual builders, we can convert that to a coded, dynamic solution and get them away from that.

I’d like to see the assets downloadable, that would be more than helpful, and organized in the project folders. I could take it from there.

This is a good start, and a helpful tool. While you’re talking about prototyping tools and quick-start templated frameworks like Understrap, that’s not quite the point here and is a whole other discussion.

Wonder how you do that! Can you please show me an example of a easy crabbed code that is integrated in a blog and the original where it came from? I could’t find that function in the app!