Pinegrow PRO lets you open any folder as a project. The file tree of the folder is displayed in PRJ panel. There you can easily open pages, add new ones, delete unneeded files and so on.

Project mode is the foundation of Pinegrow PRO features.

What is Projects in Pinegrow?

Projects group sets of files and folders to keep your web design work organized. Basically, a project is a folder on your hard drive which contains all the files and folders relative to a particular webdesign project. (HTML, CSS, JS, Images and more …)


Project mode is mandatory if your want to use Pinegrow PRO features.

How to start a Project?

For an existing project

If you already have a folder with your HTML template and resources, use File > Open project and select the folder.

If you want to start a new project:

  • Start Pinegrow
  • Select File -> New page (you can also use the New page button from Pinegrow interface)
  • Select the template you want to use


  • File -> Save -> New folder -> select a name and folder location for your project

Pinegrow will now ask if you want to open your new folder as a project, select YES.


In Pinegrow PRO, you can set up a project in a way that suits you by adding, moving, renaming files and folders using the PRJ menu BUT you can also modify your project from your computer file explorer:

  • Explorer for Windows
  • Finder for Macintosh
  • Nautilus for Ubuntu Linux


How to work with Projects?

In a project you can: 

  • Browse the files/resources which belongs to your web design project
  • Reload the project: Useful to activate some of your modifications
  • Add new folders to your project structure
  • Add new pages
  • Close your project



Depending on the document type that you select, you can have access to different options through a contextual menu (Right click)


Pages section

  • Open documents
  • Save documents
  • Duplicate documents
  • Delete documents
  • Rename documents
  • Fix links: Fix broken links and resources references if you move a page and/or the resource of a page in a different location of your project folder. Note: Fix links will not work if you RENAME a page and/or the resource of a page.


Links Section

  • Set href/src of …
  • Append link to …
  • Insert link after …

The Links section will allow you to select resources in your project and use them to create or replace resources and links in selected elements from the Tree view.

For example, in your document, you can select an image reference from the tree view, then select an image resource in the project and use Set href/src of Image to use the selected image as resource in your document.

You can also select a link reference from the tree view, then select a page from the project and use Set href/src of Link to use the selected document as link in your document.



Components Section

  • Add to resources: Read our documentation about Libraries and Resources
  • Update screenshot: If you have selected a Master page, you can update the screenshot that is used for the document.

Meaning of the icons in Project view

While working in project mode, and if you use Master pages and components, you will notice some useful icons beside your files names. Here is the meaning of these icons.