How To Install Pinegrow Plugins – Interactive Guide, Video, Text & Visual Tutorials

Pinegrow Tutorial

VIDEO WALKTROUGH

Video is 4.5 Minutes Long. We Recommend increasing Quality to 1080p60

STEP BY STEP VISUAL GUIDE

Hover over the Images to play and Follow along

Download to Machine

After you have downloaded your Pinegrow Plugin, open the zip file and extract the folder somewhere on your machine. We recommend unzipping to the frameworks folder of your Pinegrow Install, but you could unzip anywhere you want really eg – desktop 

How to install Pinegrow Plugins

Start a Project or Open a current one

Open Pinegrow. If you are already working on a project, open it. If not start a new project.  

From the Pinegrow Home screen, click open new page or project. In this example we will select a new Bootstrap 3 Index page (be sure to select Bootstrap4 if the plugin you are installing uses this – We are phasing out Bootstrap 3 Plugins so if you are using a premium Plugin, it will Bootstrap 4). Wait for the page to load.

Once the page is open, the next step is to save it. You should have a folder ready to save to. From Pinegrow Menu click file>save (or shift + S).

NOTE: WE HIGHLY RECOMMEND SAVING TO AN EMPTY FOLDER YOU HAVE ALREADY CREATED ON YOUR DESKTOP, CALLED SOMETHING LIKE MYPG-PLUGIN-TEST, JUST TO TEST YOUR NEW PLUGIN FOR THE FIRST TIME.

You might get prompted to open as a project. click yes.

Load & Activate the plugin

Now its time to load the plugin. This will be from the javascript file inside the folder of the plugin you downloaded.

  1. From Pinegrow Menu Click file>manage libraries and plugins
  2. Click load plugin
  3. Locate the folder of the plugin you downloaded
  4. Open the plugin JS file
  5. Click Add and Activate the plugin
  6. A pop up will appear prompting to add the resources to the page or project. Click add
  7. Thats’s it. Once the resources have added your good to go! 

Activate Additional resources

Some Plugins Such as Chocka Blocks & Pinegrow Construction might need additional frameworks added such as (and m Font Awesome Icons. Just add these by clicking file>manage libraries and plugins> activate>add the resources and save.

INTERACTIVE GUIDE

Learn and see how easy it is to install a Pinegrow Plugin using the interactive guide below by clicking where prompted.

Avoiding Common Issues:

1. If you get prompted by Pinegrow that the file contains special classes added by Pinegrow from a previous Install Click YES to remove them.

2. Be Sure you are using the correct Framework version EG – Bootstrap 4 and not 3 if the Plugin uses this, and vice versa.

3. Do not save your project to your install folder, or the folder of your plugin download. Start with a new folder and save your project to it the first time you test your new plugin.

4. If images are not included in a download, you need to be connected to the net to see their placeholder replacements. 

5. If Icons are not displaying, have you activated Font Awesome Plugin?

6. Have you got a lot of Plugins activated together at the same time? Not all plugins are designed to work together and may have different dependencies, frameworks might be different or you could have plain old CSS/JS conflicts. Again we recommend doing a test install for each plugin,  starting with saving a new page in an empty folder, to get to know it first.

6. Remember The JS file is the plugin, you need to activate it in Pinegrow, you don’t just download the plugin and open its HTML files to load it, or copy the files to your project, you must load and activate the plugin, then add the resources to your project.

Still Can't Install??

If all else fails just open a support ticket here and we can schedule a one to one walk through via skype (premium users only). If you are not a premium user, just send us an email at support@pluginsforpinegrow.com and we will gladly help you out.

About Author

Ben