mirror of
https://github.com/processwire/processwire.git
synced 2025-08-11 17:24:46 +02:00
Welcome to the Default Site Profile (Intermediate Edition) ========================================================== This is a plain text document. If you are currently online with internet access, you will find it much nicer to read an HTML formatted version of this document located at: http://processwire.com/docs/tutorials/default-site-profile/ If you are just getting started with ProcessWire, you might also want to look into the beginner edition of this site profile. Need multi-language support? The multi-language version of this default site profile is a good place to start. Both the beginner and multi-language versions of this site profile are available as installation options when installing ProcessWire. Introduction ============ Just getting started with ProcessWire and aren't totally clear on what template files are? The good news is that template files aren't anything other than regular HTML or PHP files, and you can use them however you want! This particular site profile uses a strategy called Delayed Output, but you should use whatever strategy you prefer. If you know enough to create an HTML or PHP document, then you already know how to use ProcessWire template files. The only difference is that ProcessWire provides your template files with certain variables that you may choose to use, or not use. Most notable is the $page variable, which contains all the fields of text or other information contained by the page being viewed. For instance, $page->title contains the text contained in the Title field of the current page, and $page->body contains the text for the Body field of the current page. You can choose to output those wherever you want. A really simple template file might look like a regular HTML document except for where you want to output the dynamic portions (like title and body). Here's an example: <html> <head> <title><?= $page->title ?></title> </head> <body> <h1><?= $page->title ?></h1> <?= $page->body ?> </body> </html> That's all that a template file is. Now when we're building something for real, we like to save ourselves as much work as possible and avoid writing the same HTML markup in multiple places. In order to do that we'll usually isolate the repetitive markup into separate files or functions so that we don't have to write it more than once. That's not required of course, but it's a good strategy to save you time and make it easier to maintain your site further down the road. Template file strategies ======================== The two most popular strategies for template files are: 1. Direct Output is the simplest strategy and the one used by the Classic Site Profile. While it doesn't scale as well as other strategies, it is a very good point to start from. If you've ever worked with WordPress templates, chances are you already know how Direct Output works. If you'd rather get started with this strategy, we recommend installing the Classic Site Profile rather than this one. Read more about the Direct Output strategy: http://processwire.com/to/direct-output/ 2. Delayed Output is the strategy used by this site profile. It is also quite simple but involves populating content to placeholder variables rather than outputting directly. As a result it may take a few more seconds to understand than direct output, but the result is more scalable and maintainable. Read more about Delayed Output here: http://processwire.com/to/delayed-output/ How this Default Site Profile works =================================== This Default Site Profile uses the Delayed Output strategy. Here's how it works: 1. The initialization file is loaded (_init.php). We use it to define placeholder variables for content regions. 2. The template file is loaded (i.e. home.php or another). We use it to populate values into the placeholder variables. 3. The main output file is loaded (_main.php). It is an HTML document that outputs the placeholder variables. Below are more details on exactly what takes place and in the three steps outlined above: 1. The initialization file is loaded (_init.php) --------------------------------------------- We define placeholder variables for the regions in our page in the _init.php file. These placeholders can be anything that you like (and in any quantity) and usually depends entirely on the needs of your site design and content. In this default site, our needs are simple so we've defined placeholders for just 3 regions on the page. We usually name these regions something consistent with the HTML tag, id or class attribute just for ease of readability, but that's not required. These are the three placeholder variables we've defined in this site: $title - The headline or title (we use for <title> and <h1>) $content - The main page content (we use for <div id='content'>) $sidebar - Sidebar content (we use for <div id='sidebar'>) The leading "$" is what designates them as placeholder variables. We do this in a file called _init.php. ProcessWire knows to load this _init.php file first, before our actual template file. We define these placeholder variables simply giving each a default value, or by just making them blank. Go ahead and take a look at the _init.php file now if you can. But to summarize, here's how you define a blank placeholder variable: $content = ''; And here's how you define a placeholder variable with an initial or default value: $content = "<p>Hello World</p>"; Here's how we would populate it with a dynamic value from $page: $content = $page->body; The last thing we want to mention about _init.php is that we might also use it to load any shared functions. You'll see a line in this site's _init.php the includes a file called _func.php. That file simply contains a shared function (used by multiple template files) for generating navigation markup. This part is not so important for now, so come back to it once you understand how everything else works. But the point to understand now is that the _init.php file initializes everything that may be used by the site's template files. 2. The template file is loaded (i.e. home.php or another) ------------------------------------------------------ Next, ProcessWire loads the template file used by the page being viewed. For example, the homepage uses home.php. We use our template file to populate those placeholder variables we defined in _init.php with the values we want. For instance, most often we populate our $content variable with the body copy from the current page: $content = $page->body; But we might also do something more like append some navigation under the body copy or prepend a photo... the sky is the limit. $content = "<img src='/photo.jpg'>" . $page->body; Our search.php template file for example, populates $content with a list of search results. Because our placeholder variables were already defined in the _init.php file with default values, our template file (like home.php or basic-page.php) need only focus on populating the placeholder variables that you want to modify. It does not even need to mention those placeholder variables that it doesn't need or doesn't need to change. 3. Everything gets output by _main.php ----------------------------------- After ProcessWire has loaded our template file (i.e. home.php) it then knows to load the _main.php file last. In the case of this site, our _main.php file is an entire HTML document that outputs our placeholder variables in the regions where they should appear. For example, the $content variable gets output in #content <div> like this: <div id='content'> <?= $content ?> </div> Please go ahead and take a look at the _main.php file for context. Note that our _main.php uses "<?php echo $content; ?>" style, rather than "<?= $content ?>" style, like shown above, just in case you happen to be running an older version of PHP. But more than likely you can use the shorter syntax when preferred, as the two are functionally equivalent. More template file resources ============================ - How do template files work? https://processwire.com/api/templates/ Official documentation on template files. - API variables https://processwire.com/api/variables/ We mentioned $page above, but here are all the other API variables your template file can make use of. - API cheatsheet http://cheatsheet.processwire.com/ Once you've got the basics down, this cheatsheet is invaluable in describing all the properties and functions available to your template files. Tutorials that help with template files ======================================= - Hello Worlds Tutoral, by Ryan Cramer http://processwire.com/docs/tutorials/hello-worlds/ The Hello Worlds tutorial gently introduces ProcessWire and template files, starting from a blank slate. - "But what if I don't know how to code?", by Joss Sanglier http://processwire.com/docs/tutorials/but-what-if-i-dont-know-how-to-code/ This particular series of tutorials will not only introduce you to ProcessWire, but step by step, will give you those small bits of coding knowledge that will get you going and open up this amazing world of a Content Management Framework. - Installing a CSS Framework, by Joss Sanglier http://processwire.com/docs/tutorials/installing-a-css-framework/ A quick demonstration about how easy it is to use one of the many CSS frameworks available to designers. - How to structure your template files, by Ryan Cramer http://processwire.com/docs/tutorials/how-to-structure-your-template-files/ This tutorial contrasts and compares the direct output and delayed output strategies and more. It is a very good introduction to using ProcessWire template files.