WPFolio handles the majority of changes users make to their site – in the theme options you can modify fonts, colors, the site background, navigation, and the sidebar.
But what if you want to do more? Then you can use WPFolio as a starting point and modify the theme files to do whatever you like!
Two important notes on modifying WPFolio theme files:
- It helps to have some knowledge of HTML, CSS, and maybe PHP, but not a lot. Reading up on the WordPress Support Forums, well crafted searches online, and reading up will go a long way.
- Make your changed in a child theme. Let me say that again: Make your changes in a child theme.
Child themes are your friend
Child themes allow you modify the styling and layout of a parent theme (like WPFolio) to any extent without editing the files of the parent theme itself.
“Why does that matter?” you ask. Well without a child theme, when you update WPFolio your changes are overwritten and lost. You could painstakingly pick through the code and migrate your modifications, but it’s tedious and you might miss something. Using a child theme, you get the benefits of new features while your modifications are preserved in the child theme. The best of both worlds!
- You want to change colors not available in the theme options? Use a child theme!
- Tweak the layout? Use a child theme!
- Add some rounded accents on elements of the page? Use a child theme!
- Have the default galleries added in the WordPress interface show 4 images across instead of three? Use a child theme!
- Change the styling of the dropdown navigation? Use a child theme!
Child themes are powerful stuff!
Whatever changes you make in the child theme override the defaults in WPFolio. Your tweaks take precedence and remain when you update the theme.
Child Theme Included!
Starting with WPFolio 1.6, a child theme is included. Just drag the WPFolio-child-theme folder into your themes folder (see figure A), activate the child theme, and start adding and manipulating files.
Child themes inherit the GPL license from WordPress and WPFolio, so share your code! Send us your tweaks. If you have more technical ability, post your child theme or fork the project on github so we can include your changes in core releases!
If you move the WPFolio child theme into your themes folder and see a notice in Appearance > Themes that says that says something like:
The parent theme is missing. Please install the "WPFolio" parent theme.
Fear not! Occasionally the directory (folder) that WPFolio is in will be named differently than in the WPFolio Child Theme’s style.css file. You just need to make them match. In WPFolio-child-theme/style.css rename “Template: WPFolio” to the exact name of the directory WPFolio is in.
For example if WPFolio was located in www.mysite.com/wp-content/themes/wpfolio I would change this in WPFolio-child-theme/style.css
Theme Name: WPFolio Child Theme Theme URI: Description: My changes to the WPFolio Theme. Author: You Author URI: http://yourwebsite.com/about Template: WPFolio Version: 0.1 Tags: WPFolio
Theme Name: WPFolio Child Theme Theme URI: Description: My changes to the WPFolio Theme. Author: You Author URI: http://yourwebsite.com/about Template: wpfolio Version: 0.1 Tags: WPFolio
because the template has to match the folder’s name exactly. That should solve it!
Here’s some links on child themes so you can learn more:
- Child Themes from the WordPress Codex
- How to make a child theme for WordPress: A pictorial introduction for beginners from op111.net
- How To Modify WordPress Themes The Smart Way from Themeshaper.com