How to Easily Manage Code Snippets for Your MyListing Website

Building Better MyListing Websites. One Guide at a Time.

Table of Contents

Overview

Guide Updated: 11/6/2021

Our How to Easily Manage Code Snippets for Your MyListing Website guide will show you how to safely and efficiently manage code snippets without sacrificing website performance.

For this guide, we show you how this can be done with WPCodeBox, a premium solution that allows you to add Code Snippets to your WordPress website site in a safe and organized way, and by doing this, you will reduce the number of plugins and get better performance.

WPCodeBox is a very inexpensive solution as it is, with lifetime updates and support, but the team behind it is giving our Club members a generous, 25% OFF discount.

Many of us currently use the Code Snippets plugin (FREE) and while it is a great plugin, there are shortcomings when compared to WPCodeBox, and we will highlight those here in this guide. Does WPCodeBox do everything that Code Snippets does? No. But, not compared to the other way around, these are super minor things and WPCodeBox is already working on these things as shown here on their roadmap.

WPCodeBox Setup

  1. Log into your WPCodeBox account and download the current version.
  2. Install and activate the plugin.
  3. WPCodeBox > Settings > Move WPCodeBox to the tools menu > Enable, save, and refresh your screen. (Note: What this does is reduces a bit of clutter in your WordPress Dashboard, by moving WPCodeBox under the WordPress ‘Tools’ menu.).

Adding Code Snippets

We recommend being as thorough as possible when filling in the details for each of your snippets, especially if you think there is ever a chance of sharing your snippets with others.

Note: WPCodeBox defaults to a screen where it’s ready for you to input a new Code Snippet, within the ‘New Sippet’ window column.

  1. WordPress Dashboard > Tools > WPCodeBox.
  2. Title > Enter a Title.
  3. Description > Enter a Description (Optional).
  4. Type > Specify the snippet type (PHP, CSS, JavaScript, etc.).
  5. Priority > Specify a priority. (Note: You should rarely have to adjust this, but if you do, the lower the priority number…the more precedence you are giving your snippet for times when that’s required for it to execute.).
  6. Script Location > Optionally specify a different location for your script to load. (Note: You should rarely have to adjust this, as WPCodeBox automatically assigns a location based on the snippet ‘Type’ you selected above.).
  7. How to run the snippet > Leave as is. (Note: You should rarely have to adjust this, as WPCodeBox automatically assigns a value of ‘Always (On Page Load)’, which is typically what’s needed.).
  8. Where to run the snippet > Set according to the ‘Type’ you selected above and where you want the results to show up. (Note: For example, if you are adding a CSS snippet to change the design of a post or page, you would want to choose ‘Frontend’.).
  9. Save the snippet and toggle the status to ‘Enabled’.

At this point, your new code snippet will be saved to this particular WordPress install. If you would like to make your snippet available across all of your WPCodeBox installs, be sure to check out the ‘Cloud Storage’ section of this guide.

CSS Dev Mode (Auto-Reload)

This is available for CSS/SCSS/LESS snippets and is useful when you want to see the changes you make in real-time.

If you want to apply some CSS to one of your Explore pages, for example, you can have the Explore page open, and if dev mode is enabled for that CSS in WPCodeBox, the CSS changes will be loaded in real-time on the page without the need to reload the page each time.

Note: After you enable dev mode in WPCodeBox, you just need to refresh the page that you are working on one time, to start seeing the changes in real-time.

  1. Enable ‘CSS Dev Mode’ for the snippet you are testing.
  2. Save the snippet.
  3. Refresh the page that you would like to see your changes appear in real-time.

Conditions Builder

One of the options available when choosing ‘Where to run the snippet’, is ‘Custom’, and when you choose this option, it unlocks the ‘Conditions Builder’. Let’s look at how you would add some CSS to all of your Listings.

  1. Where to run the snippet > Custom.
  2. Click ‘Open conditions builder’.
  3. Click ‘Add Condition’.
  4. Change the ‘Location’ dropdown to ‘Current Post Type’.
  5. From the ‘Select’ dropdown, choose ‘Job Listing’.

Cloud Storage

WPCodeBox allows you to save code snippets to your own private cloud storage, sharing those snippets across all of your WordPress installs, saving you a ton of time by not having to track down and apply snippets from various locations.

Once you have a snippet saved within a particular WordPress install, use the ‘Upload to Cloud’ option, and now that snippet will be available to you anywhere you install WPCodeBox. To pull down a snippet from the cloud, for use on a particular WordPress install, simply use the ‘Download from Cloud’ option.

WPCodeBox Snippet Repository

Clicking on the ‘Repository’ icon within WPCodeBox brings up a ton of snippets that have been submitted by other customers and/or added by the WPCodeBox team, and you have the convenient option of using search to find that perfect snippet.

Troubleshooting

In most cases, WPCodeBox will detect if a snippet triggers an error and it will disable it automatically. When a snippet is disabled because of this, that snippet will be colored red in WPCodeBox, and the error it triggered will be shown above the editor. You then have the option to dismiss the error, fix the problem, and re-enable the snippet.

In the rare case, a snippet causes an error and it is not caught and you are locked out of your site, please use the following steps.

  1. Connect to your website via SFTP/FTP, using an application like FileZilla (Free).
  2. Disable all snippet execution within WPCodeBox by adding the following code snippet to your wp-config.php file, which is found at the root of your WordPress install.
				
					//// INSTRUCTIONS: 
//// Use a plugin like WPCodeBox to add this code snippet to your website.
//// WPCodeBox Guide and Discount: 🔥 https://mylisting.club/wpcodebox 🔥

----------------- CODE SNIPPET IS BELOW THIS LINE - REMOVE THIS LINE AND ABOVE ----------------- 

define('WPCB_SAFE_MODE', true);
				
			
  1. Log back into your website and either remove the offending code snippet entirely or adjust it so it no longer contains syntax that will throw errors.
  2. Within your wp-config.php file, either remove the code snippet you added in step 2 or comment it out so you have it readily available to you in the future.
  3. Save changes.

Tip: To comment out a snippet in your wp-config.php, you can do so by simply adding a ‘//’ before the actual snippet (e.g. //define(‘WPCB_SAFE_MODE’, true);)

Video Tutorial

Play Video

Black Friday and Cyber Monday Deals and Giveaways.

Get special offers from our partners and others.

Offers end...

Days
Hours
Mins
Secs

WooCommerce Subscriptions Ready

The latest version of the WooCommerce Subscriptions plugin is included (unlicensed) and once you have a Starter Site in hand, you can easily put in your own pricing, package features, graphics, etc.

Should you not wish to use WooCommerce Subscriptions, you can simply turn the Listing Subscription packages into standard MyListing packages in just a few clicks and be on your way.

  • Custom WooCommerce Endpoint Design
  • WooCoommerce Subscriptions Setup
  • Listing Subscription Packages
  • Listing Subscription Switching
  • Stripe Payment Gateway Plugin
  •  and more…

Note: The latest version of the WooCommerce Subscriptions plugin is included, but you need to purchase your own license or sign up for a qualifying MyListing Website Care plan if you wish to receive future plugin updates and support.

Premium Assets

Get licensed, premium plugins, valued at over $600 in the first year alone, making a Starter Site investment a no-brainer.

You will get licensed copies of all the plugins listed below, with the exception of the WooCommerce Subscriptions and WooCommerce Product Vendors, and the licenses are yours to keep, for as long as the plugins remain on your website.

  • Elementor Pro ($49)
  • Perfmatters ($25)
  • Permalink Manager Pro ($45)
  • SEOPress Pro ($39)
  • UiPress ($39)
  • WooCommerce Product Vendors ($79) 
  • WooCommerce Subscriptions ($199)
  • WP Rocket ($49)