CSS & JavaScript Toolbox

توسط wipeoutmedia

Safely add CSS, JavaScript, PHP or HTML to unique code blocks, then choose where it goes on your site. For even more power, get our free AI-powered snippet plugin here: WP Snippets AI

IDEAL FOR:

Making CSS front-end changes – No need to modify theme files or work with tedious built-in theme options. Just create a CSS code block.
Adding site functionality – Stop adding plugins for simple tasks as they can slow down your site. Create a JavaScript or PHP code block instead.
Adding widgets, code snippets and third-party scripts – Code blocks are perfect for adding scripts such as Google Analytics and chat widgets to your website.

CJT is built on the concept of a code block. Each code block is more than just a code editor. It also contains a location editor so you can click the sections of your website you want your code to run.

It was designed for super-fast development without any cumbersome page refreshing. Create as many code blocks as you need and see all of your code and locations in the one dashboard. Don’t worry, CJT has been optimised to handle 100’s of code blocks and thousands of locations (i.e. Pages, Posts, Categories, Custom Posts, etc).

Click for CSS & JavaScript Toolbox PLUS

FEATURES:

Easy to use ‘code blocks’ interface
Powerful code editor
Intuitive assignment panel (click where your code goes)
Code/script library management
Add code to the header or footer hook
PREMIUM Add code to entire website, all posts, etc
PREMIUM Add code via shortcodes, widgets, Gutenburg blocks, etc
PREMIUM Add code via tags, URLs, regular expressions
PREMIUM 8 additional hooks for more precise assignments
PREMIUM Invert feature (run code everywhere but …)
PREMIUM Editor tools (code auto complete, beautify/minify, etc)
PREMIUM Code revisions system
PREMIUM Backup and export/import system

Click for CSS & JavaScript Toolbox PLUS

OVERVIEW VIDEO

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

سوالات متداول

Why was the CJT plugin developed and what is it used for?

The CJT plugin was created to help website authors write or add 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. Some typical examples can include changing the look of a specific page by adding some CSS code; adding functionality to a page with PHP; or making a page more interactive by adding some JavaScript.

What is a CJT ‘code block’?

The CJT code block is the most fundamental unit for writing code and to associate it with specific WordPress requests via the assignment panel.

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. These assignments include: Pages, Posts, Custom Posts, Tags, and Categories. Auxiliary sections such as Entire Website, Website Backend, All Pages, All Posts, Recent Posts, Blog Index, All Categories, Search Pages, All Archives, Tag Archives, Author Archives, Attachment Pages, 404 Error Pages. Advanced sections such as URLs, or Regular Expressions (Regex).

I have noticed a bunch of question marks appear during mouse hover – what are they?

These are premium features, which are only available for our CJT PLUS plugin. Click here to purchase a license for any of our premium CJT PLUS products.

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 sub-pages and sub-categories, which you will 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 to be used, you will find them pre-defined in the Auxiliary tab. In the Auxiliary tab you can find things like: Entire Website, Blog Index, Author, 404 error, 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 a code 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, then click the ‘Save All Changes’ button.

After shuffling the order of the code blocks using drag-and-drop, is the new code block order immediately saved?

No. In order to save the code blocks order, you need to click the ‘Save All Changes’ button.

Is a code block permanently deleted from the blocks list page after a code block delete icon is clicked?

No. After you delete a code block, you then need to click the ‘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 browser address bar. For example, you may have inadvertently included an extra forward slash at the end of your URL.

Why use the Hook switch in the code block bar?

The hook location feature gives you further control over the outputting of your CSS and JavaScript code. This is useful in case overriding another plugins’ CSS code is required. Also, it’s sometimes better to put your JavaScript code in the footer to avoid slowing down your page load.

I received a weird error, what do I do now?

Due to the overwhelming amount of emails we get for users requesting support for our CJT plugins, we cannot provide support for the CJT Free plugin (hosted here on WordPress.org) at this stage unfortunately. If you wish to receive priority support, please visit our CJT website and then purchase a license for any of our premium CJT PLUS products.