Editing PHP, ASP and ERB templates

PHP, ASP and ERB HTML templates are server-side code files that contain valid HTML layouts with dynamic PHP, ASP and ERB tags. Starting from Pinegrow 2.4 (2.95 for ASP and ERB) you can visually edit them in Pinegrow Web Editor.

PHP, ASP and ERB (Ruby on Rails) editing mode is designed for editing HTML code with server-side tags, not for general code editing.

PHP, ASP and ERB editing mode only displays server-side code blocks, it doesn’t execute the code.

For best results the HTML layout should be valid, with all tags properly closed.

For example, this is OK:

<div class="col <?php echo $active;?>">
    <p><?php echo $title;?></p>

..but code like this will NOT display nicely in Pinegrow and editing & saving it might lead to unintended results:

<?php if($active) {?>
    <div class="col active">
<?php } else { ?>
    <div class="col">
<?php } ?>

Activating the server-side mode

Pinegrow automatically activates server-side editing mode on files with .php, .php5, .ctp, .asp, .aspx, .erb extensions and on documents that contain server-side code.

To make additional file types editable list their extensions in Support -> Settings -> Editable file types.

You can also activate or deactivate server-side scripting support in Page -> Manage libraries and plugins:


PHP, ASP, ERB menu appears on the top toolbar and server-side code is colored yellow and displayed on the page. Code tags are also shown in the tree:


Editing the code

Double-clicking on any element that contains server-side code will open Element edit code window:


Inline editing is disabled for all elements that contain server-side code. Use Element edit code instead.

Editing partial views

Partials (PHP, ASP and ERB templates that render only a part of a complete page) can also be edited, either as stand-alone documents or as partials rendered in a container page.

When edited as stand-alone files, partials have no styles and other resources that are defined on the main page:


When using right-click -> Open as partial in Project explorer the partial is opened in a container page, so that it uses styling and other resources of the selected container page:


Adding server-side tags to the page

LIB panel contains the server-side scripting section from where various server-side tags can be dragged to the page or to the tree: