Snippets are little bits of code that can often be added to your theme’s functions.php file. But, for the sake of preventing possible conflicts, the best practice for adding custom code is to create a functionality plugin. If it’s something specific to your theme, the best practice is to make sure you’re using a child theme, then add the customization to your child theme’s functions.php file. A third option is to use a plugin like Code Snippets to add a custom snippet without having to leave the WordPress dashboard.
Other than knowing where to implement a code snippet, there are additional things to take into consideration when adding custom code for your calendar to your site. Many WordPress tutorials — including our ours — provide snippets of code used for demonstration purposes. It’s totally fine to copy and paste those for your own use. But when you do, you’ll want to make sure you check a couple of things.
Remove the opening PHP tag
PHP code snippets often start with an opening PHP tag. like this:
<?php
/* Some code */
?>
Chances are that your theme already has that opening PHP tag. So the one included in the snippet is totally unnecessary for use, and can actually break your site.
Watch out for garbled code
Many people use GitHub Gists or similar sites like Pastebin, Cacher.io, or GitLab Snippets. They’re a convenient way to share code. At the same time, it’s possible that simply copying and pasting the code from one of these services will result in unescaped, or “garbled” code.
Here’s what we mean:
// This...
$this->method_name()
// ...might paste like this:
$this->method_name()See that > in the code? That’s the unescaped HTML for the “greater than” (>) sign. It’s subtle, but can also break your site.
Another possible formatting issue: quotation marks. There are actually two types of quotation marks in HTML: curly and plain.
Curly quote: “The quick brown fox...”
Curly single quote: ‘The quick brown fox...’
Plain quote: "The quick brown fox..."
Plain single quote: 'The quick brown fox...'See the difference? Again, it’s subtle, but curly quotes are unsupported in code. So, watch for those when copying and pasting and ensure that your snippets always use plain quotes.
CSS snippets
Everything we’ve looked at so far concerns PHP snippets. But let’s say you’re working with a CSS or JavaScript snippet instead.
The style.css file
A CSS snippet can go straight into your theme’s style.css file if you are using your own custom theme. However, if you are using a theme you downloaded or purchased, then you will want to make a child theme and paste the CSS snippet in the child theme’s style.css file instead. This ensures your custom code is preserved when installing theme updates.
The WordPress Customizer
Another way to add custom CSS is to paste it in the WordPress Customizer. Since WordPress 4.7, the Customizer includes a “Custom CSS” section that allows you to post code there instead of putting it in a theme’s style.css file.
Using the WordPress Customizer for CSS snippets is a super safe way to go, especially if you are uncomfortable or unable to access your theme’s files.
Backup, backup, backup!
Seriously, we can’t say this enough. Make sure you have a restorable backup of your site’s files and database before making any changes. This helps prevent a worst-case scenario and offers a lot of peace of mind.
Test changes first
We strongly recommend testing any change to your site in a safe staging environment before adding new code to your live site. This way, you can always be confident that the code you’re using works, and that it is compatible with your site without jeopardizing your live site.