Advices on how to find a suitable WordPress theme, explanation of the automatic and manual installation, the WordPress file system, theme customizations and how to set up a child theme.
Talk at the WordPress Vienna Meetup on 7 June 2017.
2. Agenda
§ Personal introduction
§ How to find a suitable theme
§ Automatic vs. manual theme installation
§ The WordPress file system
§ Theme customisation
§ Child theme setup
§ Questions?
Feel free to ask any time!
3. kreativhuhn
§ Webagentur aus Gols
§ Spezialisiert auf Online-Marketing, Websites & E-Commerce
§ Google Partner
§ Stefanie Drucker
§ Digitale Medientechnikerin
§ Zertifizierte Expertin für Online-Marketing
§ Websites seit Ende der 90er
§ „Online Marketing Native“
§ Eigene Webagentur seit 2011
§ Einzelunternehmen + SpezialistInnen-Netzwerk
§ SpezialistInnen-Netzwerk:
Zusammenarbeit mit ExpertInnen individuell bei Bedarf
§ z.B. für Content, andere CMS-Systeme wie TYPO3,
Grafikdesign und manchmal auch WordPress-Entwicklung
4. REFRACTORY SYSTEMS AND SOLUTIONS
Kunden
Shabby ist chic
Fräulein Annabell
Burgenland
Pflege
Kranken
Kinder
Mobile
5. How to find a suitable WordPress theme
§ Considerations:
§ What is the purpose of your website?
Small website, large website, blog, one-page website, e-commerce, ...
§ Do you have any special or business-specific requirements?
E.g. page builder, Bootstrap, real estate, restaurant...
§ Price: Do you have budget for buying a theme?
§ Mandatory requirements:
§ Stable (no beta, no v1.0, good ratings, many users)
§ Up-to-date (last update should be within the last few months)
§ Compatibility with current WordPress release (v4.7.5 at the moment)
§ Compatibility with common plugins/plugins you need (e.g. WPML, WooCommerce)
§ Theme support
§ Responsive Design
6. Where to search for themes
§ WordPress Theme Directory
https://wordpress.org/themes/
or in your backend à Appearance à Themes à Add New
§ Basic filter possibilities
§ Look at compatibility, ratings, active installs and support forums
§ Theme marketplaces
e.g. https://themeforest.net/
§ Many filter criterias and detailled information about the themes – use it!
§ Big Community + forums
§ Google J
§ There are sooo many different theme stores and blog articles out there.
§ Also use Google to find out more about a theme you have found!
7. Free WordPress themes
§ WordPress‘ default theme:
Twenty Seventeen
§ OK for playing around when learning WordPress
§ OK for small websites and blogs without ambitions J
§ Very simple design
§ Only very basic customisation possibilities
§ Search wordpress.org – often there is a free and a premium version of
the same theme with extended features if you buy a licence
8. Some premium theme recommendations
Some of the best and most popular multi-purpose themes
§ Great compatibility, many users and regular updates, good support
§ Good visual page builders
§ Enfold by kriesi
http://www.kriesi.at/ and on themeforrest (made in Austria)
§ Divi by elegant themes
https://www.elegantthemes.com/gallery/divi/
§ X Theme by themeco
https://theme.co/x/
...and many more – tell me what you are using!
9. Multi-purpose themes
§ Pros:
§ Many, many features and possibilities
§ Common multi-purpose themes are permanently updated and supported
§ Good backend usability thanks to drag & drop editors / visual page builders
§ Very helpful if you develop or manage many websites – use one theme for all
§ Great for everyone who is no programmer because of many settings for
customisation
§ Cons:
§ Feature overload – usually you never need all the functionality and it makes
§ Eventually lower performance on slow webservers because of unnecessary
code
10. Theme installation
1. Upload and unzip the theme directory to your webhost
§ Search for a free theme in the WordPress theme directory
à Appearance à Themes à Add New à Install
§ Upload any theme‘s zip file through the backend
à Appearance à Themes à Add New à Upload Theme
§ Upload any unzipped theme via FTP to /wp-content/themes/
2. Activate the theme in the backend
à Appearance à Themes
3. Customise the theme for your needs
12. Theme files
§ Found in /wp-content/themes/ directory
§ Every theme that is installed on your WordPress has it‘s own directory
here.
§ Never change files of the original theme to keep it upgrade safe!
§ If you want to change your theme, make your own child theme
13. Theme customisation
§ Basic customisation with WordPress default backend features
à Appearance à Customise
§ Additional admin pages for customisation may come with your theme
§ Common multi-purpose themes come with plenty settings to adapt design and
behaviour of your website.
§ Great for non-programmers:
You don‘t need to know how to code and usually get good support in theme
forums.
§ Go into code!
...but use your own child theme!!!
14. Child theme setup
§ Make a new theme directory
e.g. /wp-content/themes/mychildtheme
§ Make a new file inside this directory and name it style.css
§ This file has to start with the following code:
15. Child theme setup
§ Important are:
§ Giving your child theme a name
§ Naming the original theme name as template
§ Referring to the original theme‘s style.css
§ Basically that‘s it!
Now you can activate your own child theme on the backend and make
any theme customisations or extensions inside the child theme folder
§ Add custom css code to the style.css
§ Extend functionality by adding your own functions.php file
§ Override template php files of the original theme by copying them here and
change anything you want or add own template files.
16. Recommendations
§ Use the resources on wordpress.org to learn more about file structure
and how to make your own template files
§ Template file hierarchy:
https://developer.wordpress.org/themes/basics/template-hierarchy/
§ Use forums and Google search
§ Don‘t be afraid, try everything out, make your own theme!
...but don‘t do that on your live website, make a copy of it for testing and
development
§ Make backups!!!