Looking for Pinegrow V4 Documentation?

Visit our new documentation site

  • Features
  • Documentation
  • Forum
  • Blog
  • Download
Back

Working with partials

Categories: PHP, ASP, ERB and Partials

Partials are HTML documents that contain only a part of the complete page. Partials are usually used with web apps where the app logic dynamically constructs the page.

Here’s an example of a partial document, team-member.html:

partial1

Such partials usually contain dynamic parts (PHP blocks, AngularJS directives…) but for the sake of simplicity we’ll just use plain HTML for this example. A web app would use such partials to construct its views.

We can open the partial directly in Pinegrow but all the styling and Javascript code will be absent because they are defined by the container page in which partials are rendered by the app.

Open as partial to the rescue!

We can open and edit the partial in a selected container page. In PRJ, right click on the partial document and select Open as partial.

partial3

A dialog box will open:

partial4

Here we select the container page in which the partial will be shown during editing in Pinegrow. Let’s say our app uses index.html as the main page. We can select index.html.

Now we have to also tell Pinegrow in which part of index.html it should show the partial. We do that by specifying a selector that consist of combination of #ids, .classes, tags, [attributed] and > (child of) tokens. Use the target icon to open the container page and select the place where the partial should be shown. Pinegrow will try to guess the right selector that uniquely identifies the area. At the moment, the logic for that is quite simple, so in some cases it will fail to find a unique selector.

Once the container page and selector are selected, click on Open. The partial will be rendered inside the container. We can only edit the partial, not the rest of the container page. And if we check Page -> Edit code we’ll get only the code of the partial.

partial5

Remote urls can also be used as container pages.

When we save the file, only the partial will be saved.



Last updated on February 15, 2017 at 1:59 am


Print this article

Find this document useful ? Share it !
Back to Top
  • Recent Articles

    • How to change your Pinegrow subscription plan
    • How-to Renew your license to continue getting Pinegrow updates & Major upgrades
    • How to Cancel your Pinegrow subscription
    • Color the Boxes
    • Pinegrow + Atom = The Perfect IDE for the Web
    • About charging sales tax on Pinegrow purchases
    • How to Try Pinegrow for free for 7 days ?
    • Use the right jQuery version in your WordPress themes projects with Bootstrap V3.3.x
    • Countdown to Pinegrow 3.0 – A New Feature Presented Every Week
    • Experience Feedback: The relaunch of Mr. Bürli
  • Beginner’s Guides

    • Beginner’s Guides
    • Getting started with Pinegrow
    • Getting Started with Pinegrow WP
  • Editing

    • Layout
    • Elements
    • Text
    • Code
    • Javascript
    • PHP, ASP, ERB
    • Editing with Atom Editor
    • Tips & Tricks
    • More …
  • Pro Features

    • Features Overview
    • Projects
    • Master Pages
    • Components
    • Editable areas
    • Libraries
    • Partials
    • CMS
  • Blocks

    • Components
    • Editable areas
    • Build your own Blocks
    • Bootstrap Blocks
    • Bootstrap Blocks for WP
  • Helpdesk

    • What Pinegrow is and isn’t
    • Troubleshooting
    • Support Forum
    • Release notes
    • Download older versions
    • Renew your License
    • Change your subscription plan
    • Cancel your Subscription
    • Contact Us
Pinegrow Web Editor © Humane technologies LLC, Poklukarjeva 22, 1000 Ljubljana, Slovenia