the need for using wordpress child themes and …however, when you update your active theme, any...
TRANSCRIPT
![Page 1: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/1.jpg)
The Need for Using WordPress Child Themes and How to Use Them
Mukalele Rogers, #WordCampKampala17 December 2017
![Page 2: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/2.jpg)
Hello!A bit about me…
@mrogers4christ
www.mukalele.net
![Page 3: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/3.jpg)
What I Docenter4webpresence.comOffering domain name registration and Web Hosting For Less!+Free SSL
![Page 4: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/4.jpg)
What I DoAs an ICT Teacher / Trainer, I maintain an online shop powered by + at mukalele.net
![Page 5: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/5.jpg)
What I DoSharebility Uganda -An educational digital resource sharing system for Ugandan Schools
sharebility.mukalele.net
![Page 6: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/6.jpg)
1.What is a child theme?
![Page 7: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/7.jpg)
child theme/ CHīld THēme /
1. A WordPress theme that inherits its functionality and styling from an existing (parent) theme.
![Page 8: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/8.jpg)
2.Why use a child theme?
![Page 9: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/9.jpg)
It’s important to keep your active theme up to date at all times for security purposes.
However, when you update your active theme, any modifications made directly to your theme files
![Page 10: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/10.jpg)
…will be completely lost!
![Page 11: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/11.jpg)
WordPress DevelopmentRule#1 Never EVER touch WordPress corecode. EVER!This means do not edit:• WordPress core files • Plugin files •Theme files
Why?•Stuff gets broken•Other plugins and themes may not work with your hacks •Updates wipe out your changes
![Page 12: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/12.jpg)
Using a child theme guarantees that customizations made outside of the WordPress admin will remain protected when you make theme updates.
![Page 13: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/13.jpg)
3.How to doit
![Page 14: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/14.jpg)
Set up a child theme at the start.
![Page 15: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/15.jpg)
Choose your parent theme wisely.
◎Was it made by a reliable developer?
◎Is it maintained?
◎Does it have any reviews?
◎Is there theme documentation?
◎Is there support via a support forum?
![Page 16: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/16.jpg)
Check to see if your purchased theme includes a ready-to-use child theme.
![Page 17: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/17.jpg)
First you need to open /wp-content/themes/ in your WordPress installation folder and create a new folder for your child thme.
You can name this folder anything you want. For this demo, lets call it wpbdemo
![Page 18: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/18.jpg)
Open a text editor like Notepad paste this code:/*Theme Name: WPB Child ThemeTheme URI: http://www.wpbeginner.com/Description: A Twenty Thirteen child theme Author: WPBeginnerAuthor URI: http://www.wpbeginner.comTemplate: twentythirteenVersion: 1.0.0*/
@import url("../twentythirteen/style.css");
NB: You can find all necessary code on wpbeginner.com :
https://goo.gl/SjSrc4
![Page 19: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/19.jpg)
Now save the file as style.css in the child theme folder you just created.
◎ This tells WordPress that our theme is a child theme and that our parent theme directory name is twentythirteen.
◎ The parent folder name is case-sensitive. If we provide WordPress with Template: TwentyThirteen, then it will not work.
◎ The last line in this code imports our parent theme’s stylesheet to the child theme.
![Page 20: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/20.jpg)
Activate your child theme inside the WordPress admin under Appearance > Themes.
![Page 21: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/21.jpg)
If you’ve done everything correctly, your activated child theme should look identical to your parent theme.
![Page 22: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/22.jpg)
Styles and template files added to your child theme’s folder will now take precedence over the parent theme’s files.
![Page 23: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/23.jpg)
#puppy { fur: purple; }
![Page 24: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/24.jpg)
Any template file in your child theme folder will replace the file of the same name in your parent theme folder.
![Page 25: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/25.jpg)
Benefits of a child theme
![Page 26: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/26.jpg)
Benefit #1.
It gives you the freedom to create new functions and template files without having to code a theme from scratch.
![Page 27: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/27.jpg)
Benefit #2.
You can freely update your parent theme without losing any of your customizations.
![Page 28: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/28.jpg)
Benefit #3.
It’s easy to tell which template files have been altered, because they will all be in your child theme’s folder.
![Page 29: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/29.jpg)
Benefit #4.
Creating an “images” folder in your child theme folder will make it easier to link to custom images from your childtheme’s stylesheet.
![Page 30: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/30.jpg)
body { background-image: url(images/file.jpg); }
body { background-image: url(http://your-domain.com/wp-content/uploads/2017/04/file.jpg); }
![Page 31: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/31.jpg)
Benefit #5.
If something goes wrong when you duplicate and alter a template file, you always have the parent theme’s version of the file to fall back on.
Read more at
https://goo.gl/BpU8GE
![Page 32: The Need for Using WordPress Child Themes and …However, when you update your active theme, any modifications made directly to your theme files …will be completely lost! WordPress](https://reader033.vdocuments.us/reader033/viewer/2022043019/5f3b3982d746837aa13d374a/html5/thumbnails/32.jpg)
Thanks!
Demo Time and questions.