Every WordPress user watches WordPress tutorials to find out “how to add code snippets in WordPress posts.” However, the answer to this question seems very simple but difficult to handle because the user can’t afford a minor mistake in the procedure.
A code snippet is a set of small codes added to the website to improve its functionality. However, people also add extra features for a custom message or make changes to the web design. Moreover, it can be used to adjust CSS, improve website speed, and hide the WordPress version number to protect it from hackers.
However, one can add third-party plugins for incorporating extra functionalities, but it often doesn’t work because it becomes challenging to find the right one for you, and one has to update them regularly. Otherwise, there are substantial security risks. So, adding code snippets to WordPress is a much better and safer option. So, today in this writing, we will explore the best 3 ways to add code snippets in WordPress.
Problems with adding code snippets to WordPress:
Code snippets can be an essential part of any eCommerce site, especially for user experience. However, while adding the snippet, one should be very careful as altering the code of your website could cause it to shut down completely. Downtimes are also significant while adding code snippets to WordPress as one can lose sales too. Moreover, the problem can also occur if the user adds multiple code snippets because it becomes difficult to manage the file.
Ways to add code snippets to WordPress:
Keeping the sensitivity of this procedure as a concern, we have enlisted the best 3 ways to add code snippets in WordPress. They are as follows:
1. Adding Code Snippet WordPress plugin
In this step, the user can add a custom code snippet plugin in WordPress more straightforwardly as we know that adding a snippet to WordPress can cause the website at risk. So, those who don’t want to take this risk should add a plugin to WordPress. However, this is one of the easiest and safest ways to add code snippets to your WordPress site.
Using this method, one can easily add or delete the snippet just as any plugin, making it easier to organize and keep track of snippets.
For this method first thing, you have to do is install the Code Snippets plugin and activate it.
After activation, the plugin will add a new menu item labeled Snippets into your WordPress admin bar.
By default the plugin will give you some snippet examples, you can edit any of them or add new ones.
After clicking on the Add New button you will get your first custom code snippet in your WordPress Website.
After adding a new snippet enter the title for your code snippet and then copy your code into the Code box
Beneath the code box, you will see a text region to add a description. You can add anything here that assists you with getting what this code does, where you tracked down it, and why you are adding it to your site.
Finally, you can click on the ‘Save Changes and Activate button.
After you have saved and activated the code, it would become visible on your site right away.
2. Creating a child theme
Creating a child theme of the main parent theme. Child themes are basically sub-themes of the main themes you are using on your website, whose files are entirely separate from the original one, and when the parent theme is updated, the child theme is not affected or overwritten.
To create a child theme first thing you have to do is, You’ll need to access your website File Transfer Protocol e.g. File Zilla or you can use File Manager in your hosting account.
After logging in you have to navigate to wp-content > themes in your site’s directory.
After that, you’ve to create a folder for your child’s theme on your computer. Give it a descriptive title, such as “your theme name_childtheme” Example Twenty Twenty-One would be “twentytwentyone_childtheme”
After creating a folder, you have to add a Style.css file to it. To create this file you have to open your favorite text editor and paste the following code:
/*
Theme Name: My Child Theme
Theme URI: http: //mysite.com/
Description: Custom child theme.
Author: your name
Author URI: http: //mysite.com/
Template: parent theme
Version: 1.0
*/
You’ll also need to call the parent theme’s CSS file within your child theme’s style.css file. For that just add the following code:
@import url(“../parenttheme/style.css”);
Remember to change “parentheme” to match the name of your current theme. After that, save your file as style.css in your child theme’s folder.
You’ll also need to create a functions.php file for your child theme. To do this, open your text editor again and add PHP tag
< ? php
//* your code here
? >
Save the file as functions.php and add it to your child’s theme folder. Then, using your FTP client, drag that folder to your site’s themes directory:
After that, activate your theme. Navigate to Admin Dashboard and Appearance > Themes and select your created child theme and activate it.
After that, add code snippets to your child theme, go to Appearance > Theme Editor and add code to the functions.php file.
When you’re ready, click on Update File. These changes will immediately become visible on your WordPress site.
3. Adding code with Insert Header and Footer Plugin
Insert Headers and Footers by WPBeginner is the best way to add code to your website’s header and footer. For instance, If you want to add tracking code for your Google Analytics, Google Adsense, and other Services.
After Installing and activating the plugin. Navigate to Settings > Insert header and footer.
Insert Headers and Footers by WPBeginner gives you the option to add your code in 3 different fields. You can add it to the header, body, and footer sections of your site.
Enter your code snippet in the box, and then click on Save. Your changes are now instantly live!