Code Snippets in WordPress: An Easy Detailed Guide 2021

In this article, we are going to take a look at the code snippets in WordPress. But before we do that, let me address few things about code snippets.

In this article, we are going to take a look at the “code snippets in WordPress” 

What is Code Snippets?

If you’re a programmer or coder, then I bet you have heard about code snippets.In case if you haven’t, this is the perfect time to learn about code snippets.  

Code Snippets is often referred to a small portion of re-usable source code, machine code, or text. Programmers use code snippets to avoid writing repetitive code.  

Why add code Snippets in WordPress?

There are many reasons for adding custom code snippets & few of them are listed below – 

  • To get more control over your WordPress Website.
  • To make it more customizable.
  • To enable and disable certain WordPress features.
  • To improve the overall security.
  • And many more.

Also Read : How to Set Up a Disposable WordPress Environment

How to Add Code Snippets in WordPress  

There are two ways to Add Code Snippets in WordPress – 

  1. Using a plugin (Code Snippets)
  2. Manually adding Code Snippets

How to Use Code Snippets Plugin in WordPress (using a plugin)

Code Snippets in WordPress

1.Install Code Snippets plugin by Code Snippets Pro

Code Snippets in WordPress

2.Now Navigate to the menu “snippets” > All Snippets.

How to Add Code Snippets in WordPress

3.You should see the above interface (Here, I have a footer code active). You can either delete them or keep them (different default code snippets)

How to Add Code Snippets in WordPress

4.Now click on the Add New button to add a snippet(here we are adding a PHP code snippet).  

 Note: you click on the “Add New” either the top left or from the Snippet menu.

Code Snippets in WordPress

 5. Give the Code Snippet a name (here, “demo”).

Also read : Can Woocommerce be used with any theme?

Note: this code removes the “Website URL field” from the comment section.

There are four options to choose from, you can choose any of them

  • Run snippet everywhere  
  • Only run in administration area  
  • Only run on-site front-end  
  • Only run once

Here, I’m choosing Run snippet everywhere.

   6. Paste or write the code –

 add_filter('comment_form_default_fields', 'unset_url_field');
         function unset_url_field($fields){
              if(isset($fields['url']))
              unset($fields['url']);
              return $fields;}

  Source: wpbeginner

Note: this code removes the “Website URL field” from the comment section.

There are four options to choose from, you can choose any of them

  • Run snippet everywhere  
  • Only run in administration area  
  • Only run on-site front-end  
  • Only run once

Here, I’m choosing Run snippet everywhere.

Code Snippets

    7.  Click on save changes and activate. Go back to All Snippets     Check if the code snippet has been activated or not. 

Code Snippets in WordPress

   8. My Snippet named demo has been activated. 

  9. You’re done, Now you know, how to use Code snippets plugin in WordPress.

How to Add Code Snippets in WordPress Manually 

Yes, You can also add code snippets in WordPress manually, but Should you? Well, the answer is no, you should not try to add any code to WordPress if you don’t know what you are doing. One wrong step can break your whole WP site. Therefore, this process is for advanced users or developers

To add the Code Snippets Manually, follow the steps given below. 

  • Open your Cpanel > Go to Files > To Your Domain (something.com) 
  • Open your domain > Wp-content > themes 
  • Current Theme > functions.php 
How to Use Code Snippets in WordPres

Now open functions.php, Paste the code at the bottom (as shown in the Image), Here I have added the same code for removing the website URL from the comment. Generally,functions.php is the file you paste the custom PHP code.

Note: Do this process at your own risk. Although you can easily delete that specific to resolve that issue. You can also delete the code snippet if it malfunctions or breaks the site, but be careful though.

How To Add Custom JavaScript to your WordPress Site

There are many ways to add javascript to your WordPress Site. You can use a plugin like Insert Headers and Footers, but since we are using the Code Snippets plugin. We will use the Code Snippets plugin to add JavaScript to your WordPress Site. 

  1. Follow the steps from the above ^.
How to Use Code Snippets in WordPres

2.Now, if haven’t deleted the “Example JavaScript snippet” from the Code Snippets plugin. You can click on the edit and put the Javascript.

Also Read : 12 Best Dom Manipulation Methods in Javascript

  3. Alternatively, You can create a new snippet manually by pasting the following code to functions.php or Header.php, or footer.php.

  1. Javascript for Head Section

<?php
        add_action( 'wp_head', function () { ?>
	<script>
         /* write your JavaScript code here */
        </script>
 <?php } );

  2. Javascript for Footer Section

<?php
        add_action( 'wp_footer', function () { ?>
	<script>
	/* write your JavaScript code here */
        </script>
 <?php } );

Also read: Do Plugins Slow Down WordPress Sites? – Speed Up WP

5 Cool Code Snippets for WordPress in 2021 

  1. Use Current Year by using 2022 in your posts.
function year_shortcode() {
	$year = date('Y');
	return $year;
	}
	add_shortcode('year', 'year_shortcode');

        Source :css-tricks

   2. Limit WordPress Post Revisions

if (!defined('WP_POST_REVISIONS')) define('WP_POST_REVISIONS', 3);
	if (!defined('WP_POST_REVISIONS')) define('WP_POST_REVISIONS', false);

    Source : WP-Functions

      3.Automatic JPEG Compression

	add_filter( 'jpeg_quality', 'compressing_jpeg' );
	function compressing_jpeg() {
	return 100;
	}

Source: SmashingMagazine

 4. Hide The Admin from the front end

          add_filter( 'show_admin_bar', '__return_false' );

Source: WordPress

5.Limit Post Per Search Page

        function limit_posts_per_search_page() {
	       if ( is_search() )
	        set_query_var('posts_per_archive_page', 20);
	}
	 add_filter('pre_get_posts', 'limit_posts_per_search_page');

  Source : WordPress

Learn About – More Code Snippets for WordPress 

Conclusion: I hope that you got some knowledge about Code Snippets in WordPress from this post. And be careful while putting any code to your WP site.

Image: Pixabay , WordPress

Leave a Comment