This page guides you on how to modify your Project Page templates (when using Project Pages for WordPress).
If you want to read more generally about Templating in Project Pages, please see our guide on templates in Gutenberg (WordPress editor), and our Legacy PHP templates.
Modifying templates: WordPress Editor (Gutenberg – Default Mode) #
When you first install Project Pages it will be in ‘Default Mode’. This means that it’s using your theme and building Project Page pages through Gutenberg (WP Editor) templates.
This gives you the flexibility of the WordPress editor and blocks, while natively sitting inside your theme (keeping your look and feel, font and global style settings, etc.)
If you want to change how your Project Pages look, rearrange blocks, or otherwise modify the templates, here’s how:
1. Copy the Template files #
Once you have the Project Pages plugin installed, you’ll be able to copy the template files out of Project Pages into your theme. (I advise that you use a child theme so that these templates you modify don’t get deleted when you next update your theme. Read about child themes here.)
You can do this via FTP, by downloading the files, renaming them, then re-uploading into your theme directory.
Here are the file names you need to copy from, and to:
Copy from:
/project-pages/templates/single-projectpage_DEFAULT.html
/project-pages/templates/archive-projectpage_DEFAULT.html
/project-pages/templates/taxonomy-projectpagetag_DEFAULT.html
Copy to:
/wp-content/your-child-theme/templates/single-projectpage.html
/wp-content/your-child-theme/templates/archive-projectpage.html
/wp-content/your-child-theme/templates/taxonomy-projectpagetag.htmlNote: Please don’t edit these templates in the plugin, as any changes there would also be wiped out when you next update the plugin. Also note these go inside your theme, in a directory named /templates/.
2. Modify in WP Editor #
Once you have your templates in your theme templates directory you can then edit them from within WordPress admin.
2.1. Go to your Site Editor (‘Appearance’ from the wp-admin menu, or *yoururl*/wp-admin/site-editor.php)
2.2. Click ‘Templates:
2.3. Select a template to edit, (you should see ‘archive-projectpage’, ‘single-projectpage’, and ‘taxonomy-projectpagetag’):
2.4. Click the edit pencil icon, or click into the page view on the right:
2.5. Tweak the template!
As you can see in this screenshot, you can select any of the blocks in the template and be presented with lots of style options on the right hand Block menu. In the above screenshot example we’ve selected the ‘Hero’ block which presents at the top of each Project page.
You can edit these templates however you want. Add extra blocks. Remove sections. Tweak the settings for each block.
Each of our blocks also uses straightforward HTML elements, so if you know a bit of CSS you can easily modify the styles further by adding some overriding CSS.
There is a world of options for modifying these templates, and each situation might likely call for a different approach. I’ll do my best to support you in the support forum, but I won’t go any more in-depth in this guide.
3. Save #
Lastly, it’s worth noting you can see what the active templates in use are by visiting your Project Page settings page (with Project Pages installed click ‘Project Pages’ – > ‘Settings’ from your wp-admin screen).
Read more about this in our note on the general templating guide.
Reach out for support if none of this is making sense.
Modifying templates: PHP Templates (Legacy Template Mode) #
In v2.0 of Project Pages we’ve included support for the legacy (V1.*) PHP templates. If you want quick, root-level access to all of the code behind displaying Project Pages, this’ll allow you complete flexibility.
However, there are downsides:
1. You’ll need to know PHP, HTML, JS, CSS etc.
2. These templates are standalone (they do not use your theme appearance at all – may be a pro for some).
3. They will not be updated as features/tweaks are released for v2.0+ blocks etc.
… with all that being said, sometimes it’s nice to just have simple PHP templates for things. Here’s how you’d edit those, if you’re interested:
1. Copy the files #
Using the below as guidance, copy the template files from the Project Pages plugin directory into your child theme directory:
Copy from:
/project-pages/templates/single-projectpage_DEFAULT.php
/project-pages/templates/archive-projectpage_DEFAULT.php
/project-pages/templates/taxonomy-projectpage_DEFAULT.php
Copy to:
/wp-content/your-child-theme/templates/single-projectpage.php
/wp-content/your-child-theme/templates/archive-projectpage.php
/wp-content/your-child-theme/templates/taxonomy-projectpagetag.php2. Modify the files #
Once you have copies in your (child) theme template folder, feel free to edit these as you see fit. I can give limited support for hard-editing these, but if you hit any major challenges, please reach out via the support forum.
Summary on template modifying #
Thanks for reading this guide on modifying your templates. If you have any feature requests, support queries please do submit them here.
Lastly, here are the related guides on templating:
