Bootstrap 4.1, control over the remote access to the Internal web server, a bunch of WordPress Theme Builder improvements and more.
This covers the Release 4.71 as well. 4.71 was published just a couple of hours after 4.7 to fix an important bug in the Bootstrap Properties panel.
To update your installation of Pinegrow download Pinegrow 4.7 from pinegrow.com and install it over your current version.
Bootstrap 4.1
Bootstrap support in Pinegrow now comes with Bootstrap 4.1.1 starting templates and controls for additional element properties like shadows and new text colors, that were introduced in Bootstrap 4.1.
Pinegrow automatically detects which version of Bootstrap 4.x is used on the page and shows the appropriate set of property controls in the Properties panel.
There we also added the Bootstrap options section where you can manually set the Bootstrap version for controls.
Controlling the remote access to the Internal web server
Pinegrow uses an internal web server to serve pages when you’re editing them in Pinegrow and when you’re previewing the edited pages in the browser.
Until now, the server only allows access to files in the current project folder, and – when the project is not loaded, or when the requested file is located outside of the project folder – only to website related file types, like .html, .css, .json and so on.
Now, in addition to this, Pinegrow will notify you in case a file is requested from the remote address (from a different computer than the one where Pinegrow is running) and ask to either Block or Allow the connection.
Pinegrow remembers the answer for the duration of the application session. Restart Pinegrow to clear the lists of blocked and allowed addresses.
The typical case of accessing the Pinegrow’s web server remotely is previewing the page on a different device:
Copy the url of Unsplash photos
Pinegrow lets you use more than 400.000 high quality free images from Unsplah.
We added the option to easily copy the URL of the selected image to clipboard, so that you can than use it in CSS properties and elsewhere.
Use “_” in HTML tag names
Pinegrow now correctly supports HTML elements with a “_” character in the tag name, for example:
<my_tag>This is special!</my_tag>Improved Drag & Drop to the Tree panel
We improved the accuracy and placement control of the Tree panel Drag & Drop operations, especially when adding elements to the end of the document.
WordPress Theme Builder
Pinegrow 4.7 adds another batch of useful improvements to our WordPress Theme Builder, on top of WordPress Smart actions that were introduced in Pinegrow 4.6.
Team collaboration with User variables in Theme settings
Until now the Theme folder (the folder where the theme files get exported) and the Preview URL of the local WordPress installation were hard coded into the WordPress Site action.
That created problems for teams if team members used different locations for theme export and preview URLs. They had to correct these WordPress Site action settings whenever pushing or pulling the code from the source control repository.
This inconvenience is a thing of the past.
The Theme folder and Preview URL settings can now contain user specific variables that are defined in Pinegrow Settings for each individual user.
For example, a variable pg_docs_theme_folder is used in the WordPress Site action.
Use ${var_name} to include the variable’s value in the theme folder or preview URL settings.
Each team member than points the variable to their export folder for the theme in User variables section in the app Settings.
Variables can also be used to define just the customizable portion of the value and hard code the fixed part.
In this example, each team member just needs to define one variable that points to their local WordPress installation and the actual theme folder is defined in the theme.
“Enable REST API” setting for Custom Post Types, required for Gutenberg
This setting exposes the Custom Post Types in WordPress API.
At the first glance, this setting is not very exciting. But having the “Enable REST API” enabled is required for using the new Gutenberg editor with custom type posts.
Registering a Custom Post Type with Post & Loop – Smart action enables this setting by default.
Easily add IF statement to Post Field and Customizer Field smart actions
Sometimes we need to check if a field value is defined before using it on an element.
Post Field – Smart and Customizer Field – Smart actions now have “Add IF statement” setting that encloses the element with IF statement checking if all of fields where this setting is checked are defined.
post_permalink() -> get_permalink()
The post_permalink() function has been deprecated since WordPress 4.4.
Get Permalink action was added to the Links section in the WordPress panel. Instances of post_permalink() calls generated by actions like Post Link – Smart were replaced by get_permalink() calls.