Jump to content

Extend multiple template with delayed output

abmcr

By abmcr,
in General Support

 Share

Recommended Posts

abdus Hero Member

abdus

Posted
Posted

You can manually include any file you want. You dont have to use $config->appendTemplateFile. 

<?php namespace ProcessWire;

// home template

?>
<div pw-id="content">
    this is content
</div>

<?php include_once 'layouts/my-layout.php';

Only requirement is that the file you include needs to have <!DOCTYPE declaration and <html> tag in it. 

<?php namespace ProcessWire; 

// my-layout.php

?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <main id="content"></main>
</body>
</html>

From the documentation in WireMarkupRegions.php 

This takes anything output before the opening `<!DOCTYPE` and connects it to the right places
 * within the `<html>` that comes after it.
/**
 * Identify and populate markup regions in given HTML
 *
 * To use this, you must set `$config->useMarkupRegions = true;` in your /site/config.php file.
 * In the future it may be enabled by default for any templates with text/html content-type.
 *
 * This takes anything output before the opening `<!DOCTYPE` and connects it to the right places
 * within the `<html>` that comes after it. For instance, if there's a `<div id='content'>` in the
 * document, then a #content element output prior to the doctype will replace it during page render.
 * This enables one to use delayed output as if it’s direct output. It also makes every HTML element
 * in the output with an “id” attribute a region that can be populated from any template file. It’s
 * a good pairing with a `$config->appendTemplateFile` that contains the main markup and region
 * definitions, though can be used with or without it.
 *
 * Beyond replacement of elements, append, prepend, insert before, insert after, and remove are also
 * supported via “pw-” prefix attributes that you can add. The attributes do not appear in the final output
 * markup. When performing replacements or modifications to elements, PW will merge the attributes
 * so that attributes present in the final output are present, plus any that were added by the markup
 * regions. See the examples for more details.
 *
 * Examples
 * ========
 * Below are some examples. Note that “main” is used as an example “id” attribute of an element that
 * appears in the main document markup, and the examples below focus on manipulating it. The examples
 * assume there is a `<div id=main>` in the _main.php file (appendTemplateFile), and the lines in the
 * examples would be output from a template file, which manipulates what would ultimately be output
 * when the page is rendered.
 * 
 * In the examples, a “pw-id” or “data-pw-id” attribute may be used instead of an “id” attribute, when
 * or if preferred. In addition, any “pw-” attribute may be specified as a “data-pw-” attribute if you
 * prefer it. 
 * ~~~~~~
 * Replacing and removing elements
 * 
 *   <div id='main'>This replaces the #main div and merges any attributes</div>
 *   <div pw-replace='main'>This does the same as above</div>
 *   <div id='main' pw-replace>This does the same as above</div>
 *   <div pw-remove='main'>This removes the #main div</div>
 *   <div id='main' pw-remove>This removes the #main div (same as above)</div>
 *
 * Prepending and appending elements
 * 
 *   <div id='main' class='pw-prepend'><p>This prepends #main with this p tag</p></div>
 *   <p pw-prepend='main'>This does the same as above</p>
 *   <div id='main' pw-append><p>This appends #main with this p tag</p></div>
 *   <p pw-append='main'>Removes the #main div</p>
 * 
 * Modifying attributes on an existing element
 * 
 *   <div id='main' class='bar' pw-prepend><p>This prepends #main and adds "bar" class to main</p></div>
 *   <div id='main' class='foo' pw-append><p>This appends #main and adds a "foo" class to #main</p></div>
 *   <div id='main' title='hello' pw-append>Appends #main with this text + adds title attribute to #main</div>
 *   <div id='main' class='-baz' pw-append>Appends #main with this text + removes class “baz” from #main</div>
 *
 * Inserting new elements
 * 
 *   <h2 pw-before='main'>This adds an h2 headline with this text before #main</h2>
 *   <footer pw-after='main'><p>This adds a footer element with this text after #main</p></footer>
 *   <div pw-append='main' class='foo'>This appends a div.foo to #main with this text</div>
 *   <div pw-prepend='main' class='bar'>This prepends a div.bar to #main with this text</div>
 * 
 * ~~~~~~
 *
 * @param string $htmlDocument Document to populate regions to
 * @param string|array $htmlRegions Markup containing regions (or regions array from a find call)
 * @param array $options Options to modify behavior: 
 *  - `useClassActions` (bool): Allow "pw-*" actions to be specified in class names? Per original/legacy spec. (default=false)
 * @return int Number of updates made to $htmlDocument
 *
 */
public function populate(&$htmlDocument, $htmlRegions, array $options = array()) { ... }

 

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...