Features

Global Code Blocks

A CJT code block is the basic fundamental unit for writing code and associating it with specific WordPress requests. You can create as many code blocks as you need and assign them to posts, pages, categories and much more. You can even manage/split your codes into several code blocks and assign them all to a page or post, allowing you to override code in a former (or lower-ordered) code block. To sum up, code blocks were intentionally designed to be flexible, allowing either one code block to be assigned to many requests, or many code blocks to be assigned to one request.

  • Add as many CJT code blocks as you need
  • Assign a code block to multiple Pages/Posts/Categories/etc
  • Edit multiple code blocks at the same time without navigating browsers
  • Reorder code blocks via drag and drop to allow block priority over others

code-blocks

Introducing the Assignment Panel

assignment-panelThe Assignment Panel (on the right-hand side of a code block) is where you assign your code to specific WordPress requests. These requests can be for example a particular WordPress page, or all WordPress posts that fall under a particular category. We have made it very flexible, and included common requests like assigning code to your entire website, which would be useful for analytics tracking code. Also included are assignments Custom Posts, and for individual URLs and Regular Expressions. All the WordPress requests are shown below:

  • Pages
  • Child/sub Pages
  • Posts
  • Custom Posts
  • Categories
  • Child/sub Categories
  • Auxiliary (or Common) Assignments – including the Entire Website, Website Backend, All Pages, All Posts, Recent Posts, Blog Index, All Categories, Search Pages, All Archives, Tag Archives, Author Archives, Attachment Pages, and 404 Error Pages
  • URLs
  • Regular Expressions

Shortcodes & Metabox Code Blocks

  • For more accurate placement of your code blocks, you can add code block shortcodes at the Page/Post level. We include a TinyMCE button, which lists all your code block shortcodes for easy insertion via a single click
  • Security setting in Options to enable/disable metabox code block

Code Block Shortcodes

When a shortcode is inserted into a WordPress Post or Page, it is replaced with some other content. In our case, we instruct CJT to find the code block that is in the square brackets [ ] and replace it with the appropriate code block contents. This allows for perfect positioning of content in your webpage, and even specific execution order of the script within the page. Shortcodes are very useful and we have a dedicated TinyMCE button that can be used to automatically add shortcodes. Additionally, if you know the code block name, you can use this in the square brackets.

An example of this can be like: [cjtoolbox name=”Google Maps – HTML”][/cjtoolbox]

Shortcode Support

Page/Post Metabox Code Blocks

Metabox Code Blocks are shown at the page/post level. When you are working with your pages or posts, you may prefer to work with code blocks at this level rather than in the CJT dashboard. It is therefore a matter of personal preference. The main difference in the metabox Code Block UI, is that there is no Assignment Panel. You will also notice an added Preview button (see Code Editor Toolbar), and when clicked, will open your page or post in a new window.

Page Post Code Block Metaboxes

Code Metabox Security

If you have users that are authorised to create Posts or Pages, although you do not want them to be able to create a new Code Block metabox for these posts or pages, then you can disable this in the CJT Options. You can disable Code Block metaboxes for Pages, Posts, and Custom Posts.

Code Files

Code Files are a relatively new feature that allows you to create and attach code files to a code block. This means you no longer have to create many code blocks, which can become difficult to manage and organise. Instead, you can create many code files and group them inside a single code block.

  • Create as many code files as needed
  • Add a name, language type (i.e. HTML, PHP, CSS and JavaScript), and description for your code file. Editor language will automatically be switched for you
  • All code files will share the same assignments (e.g. the same Posts/Pages/Categories/etc)
  • You can turn your code block into a mini project. For example, you can assign a single block with multiple code files to a Page or Post, instead of creating multiple blocks to a single Page or Post
  • Switch between code files using AJAX
  • Multiple authors can work on the same block at the same time by editing different code files
  • When executed all code files (within a code block) will be merged together and involved as a single file

code-files

Code Blocks Tools

  • For more accurate placement of your code blocks, you can add code block shortcodes at the Page/Post level. We include a TinyMCE button, which lists all your code block shortcodes for easy insertion via a single click
  • Security setting in Options to enable/disable metabox code block

Activate/Deactivate

Location Hook

Batch Tools

Editor Tools

  • For more accurate placement of your code blocks, you can add code block shortcodes at the Page/Post level. We include a TinyMCE button, which lists all your code block shortcodes for easy insertion via a single click
  • Security setting in Options to enable/disable metabox code block

32 Editor Themes

Font-Size Adjustment

These tools allow you to: increase the font size; decrease the font size; or reset the font-size in the code editor. Resetting the font size returns it to the default size.

Full-Width Editing

This enables full-width mode, where the assignment panel is hidden and the code editor will expand into its place. The icon will then change to the minimise icon, which will revert the code editor to the default mode, allowing the assignment panel to reappear.

Full-Screen Editing

This action maximises (opens and expands) the code block to fit the browser window to allow for fullscreen editing. The icon will then change to the minimise icon, which will revert the code editor to the default mode. Utilising the fullscreen mode provides a full-height assignment panel, which lists a lot more posts, pages, categories, etc. If you have created many scripts in the Template Manager, then using a full-height Template Lookup panel would list a lot more scripts.

External Script Support

The External Link feature is an easy way to add scripts from an external source. It works by fetching the script file from the remote host. It then creates a template record for it, and links it to the code block.

Templates & Packages

External Link function seamlessly download a third-party script (e.g. from CDN), add it as a template and link it to the current code block

Code Template Manager allows you to:

  • Create HTML, PHP, CSS and JavaScript code templates so you can link or embed them to your code blocks
  • Centralise your library/third-party codes by linking templates, which is using WordPress scripts/styles queue to avoid conflicts

Template Lookup System allows you to:

  • link/embed BOTH Templates and even WordPress built-in scripts/styles (such as jQuery, Thickbox, etc) that are bundled with WordPress

Package System allows you to:

  • Install packages from the CJT website
  • Create your own packages (zip package made up of code blocks and templates)
  • Work in external editors, save all code blocks and templates into files, and then import them into CJT via a simple definition.xml file
  • Share packages with other CJT developers
  • define block parameters, making it possible to utilise shortcode parameters form, which allows block to prompt for parameters when inserted as a shortcode

Cool Tools

Write HTML, PHP, CSS and JavaScript using the Advanced Code Editor
Powerful editor coding tools like: Undo, Redo, Find, Replace, Go To Line, Fold, UnFold, Collapse and Expand, and much more!
Code Auto Completion is a powerful helper tool to quickly auto-complete HTML, PHP, CSS and JavaScript code syntax and code snippets
Syntax highlighting and error checking
Around 30 editor and code block themes to choose from

Header/Footer Support

Header and Footer SupportThe header/footer location hook feature gives you control over the location of outputting your code blocks, by forcing the code to execute in the header or footer of the webpage. This is useful in case you need to override another plugins’ CSS. Also, it is sometimes better to put your JavaScript code in the footer to avoid slowing down your page load.

Many batch operations including:

  • Activate/Deactivate/Revert state for all code blocks (great for debugging)
  • Switch all code blocks to either the Header or Footer
  • Delete all or delete only the empty code blocks

Create multiple backups for all your code blocks, allowing them all to be restored
Create multiple code block revisions, allowing the single block to be restored
Tools allow for font-size adjustment, full-width and full-screen editing
Minimise or maximise all code blocks with a single click

Performance

Have you ever noticed how your website can start slowing down when you add more and more WordPress plugins into the mix. Unfortunately plugins can bloat your website and use unnecessary resources if they are used when not needed. CJT only reserves memory resources and usage processes when it needs to, otherwise it will not get involved. Additionally, by adding scripts that emulate an existing plugin, YOU get to decide exactly where the script will run.

CJT has been fully tested using over 100 code blocks and 1000’s of assignments (e.g. Posts/Pages/Categories/etc). This was made possible using a combination of AJAX scrolling and pagination. In fact, 99% of CJT utilises AJAX technology, which means there is no need to refresh/reload the webpage.

 

 

Batch Operations

There are many batch operations that you can utilise in the master admin toolbar of CJT.

  • Tools for block state includes: Activate (turn on) all code blocks, Deactivate (turn off) all code blocks, and Switch current state for all code blocks
  • Tools for location hook includes: Set output location hook to footer for all code blocks, and Set output location hook to header for all code blocks
  • Tools for Block Cleanup includes: Delete all code blocks, and Delete only the empty code blocks

CJT Batch Tools

CSS, JS, HTML, PHP Support

CSS, JS, HTML, PHP SupportThere are four code languages that are supported, which are: CSS, HTML, JavaScript, and PHP. These languages can be used in code blocks and code templates, with full support using the syntax highlighter. If you have the Code Auto Completion extension plugin installed, then you will get code syntax dictionary support for CSS, HTML, JavaScript, and PHP also.

Syntax Highlighting

Our Syntax Highlighter is built on the best and most popular open-source JavaScript project called Ace Editor. Some of the great features of this editor include: Automatic indent and outdent; Highlight matching parentheses; Drag and drop text using the mouse; Line wrapping; and Cut, copy, and paste functionality.

Syntax Highlighting

Backups & Revisions

The Backup Manager allows you to create, restore, or delete backups. It makes a full backup of all code blocks, whilst giving you a simple user interface for info such as backup entries, backup name, user who created the backup, date and time, and restore and delete links. The Revision function allows you to save your work, by recording a new code block revision similar to how WordPress stores revisions for Pages and Posts. You see all your saved revisions, ordered by oldest at the top and most recent at the bottom. Each row produces a revision date and time, and a Restore link.
backups-revisions

Custom Post Support

Custom Post SupportCJT fully supports custom posts, which works a little differently to pages and posts. Each custom post type lists all of its own posts within it and you can select any of these posts that you want your code block to run on. Support is also provided for hierarchical custom posts (i.e. child custom posts), and can be selected along with the parent custom post. Custom posts will only appear in the Assignment Panel so long as you have created custom posts.

Sub-Page/Category Support

Support is provided for hierarchical pages, hierarchical custom posts, and hierarchical categories. In other words: child  pages (or sub-pages), child custom posts, and child-categories (or sub-categories). These are shown in an intuitive layout and can be selected along with the parent by checking a coloured checkbox. You can also select the parent page without any of the child pages.

URLs & Expressions

The Advanced section of the Assignment Panel allows you to manually enter an URL or Expression that you want your code block to run on. URLs allow you to assign a code block to run on a particular webpage URL (i.e. or webpage address), whilst the Expressions section 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.

Code Template Manager

The Code Template Manager is the heart of CJT. It allows you to create a library of scripts and styles that you can assign to pages, posts, custom posts, categories, and much more. It provides all the tools needed to create, edit, delete, and manage all of your code templates in one main table.

Template Lookup System

The CJT Template Lookup is a powerful system, which allows you to embed or link templates to code blocks. Embedding a script from the Template Manager copies and pastes the entire script into your code block, making it easy to see and make changes to the script. Linking a script from the Template Manager, makes it ideal for linking multiple scripts. The Template Lookup also allows you embed or link to WordPress built-in scripts. You can embed or link JavaScript, CSS, PHP, and HTML code templates. Other tools include showing you which scripts are linked or unlinked.

Package Installer

The main goal of the package installer is to make implementing scripts into your website super easy!!! The Package Installer is basically an upload and installation system that allows you to upload the package zip file to your CJT Pro plugin. Once you have uploaded and installed a CJT Package, you will then be able to see all the information in the Packages section of the CJT menu. The Package Installer works by automatically creating new code blocks and templates based on the scripts and files within the package. It then instructs CJT Pro to link those code templates to code blocks, as well as storing files and setting the output hook of the code blocks to the header or footer. It does all this behind the scenes to make installing and running scripts on your website easier.

Free Script Packages

By purchasing CJT Pro, you get the Package Installer system that allows you to download scripts from the Scripts section of our website and upload and install them into your own website. We source quality free open-source scripts to package for you so you don’t have to try and work out how to add the scripts to your website yourself. On another note, we want to promote these great open-source scripts, and we do this by including the author, website and script license information.

WordPress Installations

Your CJT license determines how many websites you are permitted to install CJT on. CJT Free has no stipulation and therefore grants you unlimited installations. The CJT Pro license allows you to install it on strictly one website, whilst the licence for CJT Dev entitles you to unlimited website installs.

Automatic Updates

Updates are crucial for bug fixes and stability, security updates, and additional features. Your CJT license determines the amount of time you are given for automatic updates. CJT Free of course provides unlimited time for automatic updates through the WordPress.org website. The CJT Pro license provides 1 year of automatic updates from the CJT website starting from the date of purchase. CJT Dev license provides unlimited time for automatic updates from the CJT website.

Support Forum Access

If you have purchased either CJT Pro or CJT Dev, you are entitled to log into the CJT website and utilise the support forum. The CJT Pro license provides 1 year of support forum access starting from the date of purchase. CJT Dev license provides unlimited time for support forum access. We do not answer any support questions for CJT Free, and therefore must be done on the CJT Free WordPress.org support forum page.

Priority Support

If you have purchased either CJT Pro or CJT Dev, you are entitled to priority support via email. The CJT Pro license provides 1 year of priority email support starting from the date of purchase. CJT Dev license provides unlimited time for priority email support. We do not answer any support questions for CJT Free via email.

More Features for CJT Pro/Dev in the Pipeline

We always listen, and we understand the features you would like us to develop. We have a number of awesome feature developments in the future, including:

  • System to export/import code blocks and templates into another website
  • Assignment Panel controller for placing sidebar widgets on Pages/Posts/Categories/etc
  • Shortcode in text widgets to allow assigning code blocks to the sidebar
  • Assignment of code blocks to page templates
  • Edit WordPress core, Theme, and Plugin files within code blocks