No code on the server. No API calls. No generators. Just HTML.
Pinegrow CMS lets end-users edit static HTML websites without touching the HTML code.
The simple process
- Open any HTML page (or create it with Pinegrow).
- Define editable areas with Pinegrow PRO.
- Let the end-users use Pinegrow in CMS mode to easily update the content.
Defining editable areas
You can make different parts of elements editable:
Inner content
By ticking the “Inner content” checkbox everything inside the element is fully editable.
Attributes
Selected attributes (for example a link href attribute) are editable.
Classes
Classes can be defined for addition or removal from the element.
Background image
Ticking the “Bkg. image” checkbox allows the background image (set as inline style) to be changed.
Collections
Component types can specified for addition, deletion or rearrangement inside the content of the element.
…or all together
You can also combine all above mentioned editable modes on a single editable area.
Simplified UI for the end-user
Content contributors (users who edit the content) can use Pinegrow in CMS mode with a simplified user interface.
Minimal user interface
The following features of the full Pinegrow Web Editor are disabled:
- Styles, Actions and WordPress panels
- Creating new pages (only new pages based on project’s master pages can be added through Project panel)
- Opening URL as pages
- Editing the code of the whole page
Powerful properties
All edits to the page can be done through the Properties panel.
Inline editing
Inline editing for larger sections of editable content.
Add items to collections
Convenient buttons to add new items to editable collections.
Delete and rearrange items
Delete collection items and rearrange them by dragging them in the tree.
Simplified tree outline
Only editable elements are shown in the document tree.
Activating the CMS mode
Three ways this can be accomplished:
- During development you can use Components -> Test CMS mode to quickly switch to CMS mode and test how the page will behave. In test mode all menus and panels remain visible.
- Tick the Support -> Settings -> Run in CMS mode checkbox and restart Pinegrow to switch to full CMS mode. This is useful for testing and if the end-user has a normal Pinegrow PRO license but wants to use it in CMS mode.
- Get a special Pinegrow CMS license for each end-user who will update the content.
Special Pinegrow CMS Client license
The Pinegrow CMS license is suitable for end-users who will edit the website content. Pinegrow activated with a CMS license runs only in the CMS mode. Only editable areas can be edited. This license is not suitable for general website editing. The price of the license is just $20 (one-time payment, volume discount is available).
Buy Pinegrow CMS Client licenses »
How many end-user licenses do we need?
Each individual end-user (content contributor) who will use Pinegrow needs a separate Pinegrow license: either Pinegrow CMS license or a normal Pinegrow PRO license run in CMS mode.
Under the hood
Information about editable areas and components is stored in data-pgc-* attributes directly in the HTML code. This is the standard and valid way of extending HTML attributes. It adds just a couple of extra characters to the code and makes pages self-contained with pure HTML.
Adding comments, forms and dynamic content to static HTML websites
One benefit of using WordPress or similar server-side CMSs is that they implement form and comment processing. But having to use a big CMS on your otherwise simple website just because of that, is unnecessary. Instead, you can use online services and embed their widgets into your plain HTML website.
For example:
- Wufoo and similar services for forms
- Disqus for comments
Hosting and publishing
Use your preferred method of publishing the changes to your hosting provider, either with FTP, Git or provider-specific method. At this time, Pinegrow doesn’t host and upload files directly. You have to setup the publishing outside of Pinegrow.
The good news is that you can host static HTML websites anywhere. You can even get high-quality hosting for free:
Tutorial – How to host your HTML website on GitHub Pages for free
Getting started
Mr. Pine Cone – Sample Pinegrow CMS-enabled theme with step-by-step tutorial
Check out the Editable areas documentation for examples of what can be done with editable areas
Why use static HTML?
Big CMSs like WordPress are great for websites with lots of regularly updated content, for websites with multiple authors or for websites with custom server-side functionality.
But for most websites using server-side CMS is not necessary: they have just a couple of pages, a single person is updating the content, and the purpose is displaying information without running business processes on the server.
Using CMSs like WordPress comes with a price: creating such websites are more expensive and take more time. Server code is vulnerable to hackers and requires continuous updates. Serving CMS generated pages can lead to performance and stability issues on the server…
Still, many websites use CMSs because they let end-users easily update the content.
Pinegrow CMS is the bridge between simplicity of static HTML websites and user-friendliness of CMS authoring interfaces. Pinegrow CMS lets end-users edit static HTML websites without touching the HTML code.