Skip to main content
  1. All Posts/


Tools Open Source PHP WordPress
=== CSS & JavaScript Toolbox ===
Contributors: wipeoutmedia
Author URL:
Donate link:
Tags: post, posts, admin, sidebar, page, pages, widget, image, shortcode, plugin, google, customise, style, scripts, hack, WordPress, HTML, CSS, JavaScript, HTML5, jQuery, PHP, code, script, scripts, manage, management, display, output, header, footer, apply, requests, match, hook, execute, run
License: GPLv2 or later
License URI:
Requires at least: 3.9
Tested up to: 4.3
Stable tag: 8.0.4

Easily add custom CSS, JavaScript, HTML and PHP code to unique CJT code blocks and assign them wherever you want.

== Description ==
= Update Notice =
After a long hiatus in development, we have decided to focus our entire efforts on our new premium extension plugin called [CSS & JavaScript Toolbox PLUS](, which is designed to work with and UPGRADE the free version. Unfortunately we will be moving many features from the free version into the premium. 

= What does this mean? =
For the next update (not this one), we will be removing features from CSS & JavaScript Toolbox Free including: 
- Custom Posts
- Categories
- Auxiliary assignments (e.g. entire website, website backend, etc)
- Advanced assignments (i.e. URLs and Expressions)
- Code Files 
- Code Templates
- Template Lookup System
- Packages 

If you rely on the features above, then you can do one of two things:

1) Stay on [CSS & JavaScript Toolbox Free v8.0.3](, and when the next update arrives, DO NOT UPDATE!!!


2) Purchase our premium extension plugin: [CSS & JavaScript Toolbox PLUS](

Of course if you have already updated, you can use FTP to rollback to the earlier version by manually overwriting the css-javascript-toolbox folder with: [CSS & JavaScript Toolbox Free v8.0.3](

= Why purchase PLUS? =
[CSS & JavaScript Toolbox PLUS]( is our new premium plugin, which will now take up all our time and efforts. It will also contain all of the above features - PLUS these features below:
- Editor Themes
- Editor Toolbox
- Editor Menu Tools
- Code Auto Completion (CAC)
- Import Export Tool
- Block Widget Linker
- PLUS more

We intend to give PLUS a complete makeover, including: 
- code optimisation and bug fixes
- 100% compatibility with the the latest WordPress
- a faster and more powerful core
- full codebase documentation
- and eventually a brand new flat responsive user interface

= About the CSS & JavaScript Toolbox Plugin =
CSS & JavaScript Toolbox (or CJT) is a powerful code management plugin that gives you the tools to easily and safely modify or extend the functionality and appearance of your WordPress-powered website.

= Perfect for WordPress website development =
Whether it be adding free/premium scripts, creating and testing new scripts, streamlining development work, making front-end customisations, or even teaching and learning WordPress – CJT is extremely flexible and versatile.

= How does it work? =
Since CJT was designed to be easy, adding scripts and styles can be done in as little as two steps.

- adding your code directly into unique CJT code blocks
- assigning where these code blocks go

CJT code blocks can be assigned to pages, posts, custom posts, categories, URLs, expressions, and practically anywhere you want on your website. Code block shortcodes can also provide you with further placement accuracy.

= Support Us =
The CSS & JavaScript Toolbox project is 100% developed and maintained by only two people since the very beginnings in August 2011. We have plenty of feature ideas that we want to introduce and this can only be possible with funding.

You can also support us by providing a [feedback review and rating]( on, and spreading the word and recommending CJT to others.

= Follow the Developments =
If you like to know more about the development state, issues and to track future versions code please follow us on [GitHub Plugin repository](

== Installation ==
1. If you're upgrading from older versions its highly recommended to backup your database before upgrading.
2. Upload the 'css-javascript-toolbox' folder to the '/wp-content/plugins/' directory
3. Activate the plugin through the 'Plugins' menu in WordPress
4. Click 'CSS & JavaScript Toolbox' link in the main navigation (left side of your Dashboard).

== Frequently Asked Questions ==
= Why was the CJT plugin developed and what is it used for? =
The CJT plugin was created to help website authors write their own code. The plugin allows you to contribute to your WordPress installation code via a simple web interface, where you can modify and extend the functionality and appearance of your website by writing code directly into CJT code blocks. A typical example of using the plugin can include changing the the way a specific WordPress page is displayed, or making a page more interactive by adding some JavaScript (Dynamic HTML).

= What is a CJT 'code block'? =
The CJT code block is the basic unit for writing code and to associate it with specific WordPress requests.

= What is the Assignment Panel? =
The Assignment Panel is a tabs window, which appears on the right side of the code block editor and is used to assign/apply the code block into specific requests.

= Can you select more than one item from the Assignment Panel? = 
Yes. You can select any number of items you need, there is no limitation regarding this.

= Can you assign multiple blocks to the same items from the Assignment Panel? =
Yes. It's one of the most useful features that CJT supports as it allows you to manage/split your codes into several code blocks, allowing you to override code in a former (or lower ordered) code block.

= What is Pages, Posts, Categories and Custom Posts tabs? =
These lists with checkboxes represent all of your WordPress Pages, Posts, Categories and Custom Posts that your entire website contains.  It also supports subpages and sub-categories, which you will also find in there. 

= What is the Auxiliary tab? =
As there are a number of requests that are not available as normal WordPress items (e.g. Pages, Posts, etc) but since it's commonly required and most likely be used, you will find them pre-defined in the Auxiliary tab. In the Auxiliary tab you can find pages like: Home, Blog Index, Author, 404 error, Tag, Archive, Entire website, Front-end, Admin backend and much more!

= Is it better to use the URLs tab, or select items if found through other tabs?  =
Pages, Posts, Custom Posts and Categories tabs are created to simplify the assignment process for all types of users. Using URLs is great for fast performance as it requires less time to evaluate/identify the request! However, not all things can be done through the URLs tab.  For example, applying a single block to a Category index page and all its sub-categories.

= What is the Advanced Expressions tab? =
The Advanced Expression tab allows you to fully control what requests to integrate into the code block by using Regular Expressions. In other words, allowing CJT users to define more requests to assign the code block to.

= Can I move the blocks around? =
Yes by hovering your mouse cursor over the code block title bar until it turns into a four-sided arrow, this allow you to move the blocks.  Clicking the block title bar allows you to open and close the blocks.

= Is block saved after I click 'Create' in 'Create New Code Block' form? =
Yes. The block is created and saved in your database. In order to discard the block, you have to delete it.

= Is block orders immediately saved after drag-and-drop block box?  =
No. In order to save blocks order you need to press 'Save All Changes' button.

= Is block immediately deleted after removed from the blocks list page? =
No. After delete block you need to click 'Save All Changes' button.

= I'm using the URLs tab and my code is not working? =
Make sure you have copied and pasted the Page, Post, or Category URL exactly as it appears in the address bar.  For example, you may have inadvertently included an extra forward slash at the end of your URL.

= Why use the Footer switch in Location/Hook? =
Hook location feature gives you control over the location of outputting the CSS/JS code. This is useful in case overriding another plugins' CSS is required. Also sometimes its better to put your JS code in the footer to avoid slowing down your page load.

= I received a weird error, what do I do...