[av_section min_height=” min_height_pc=’25’ min_height_px=’500px’ padding=’default’ custom_margin=’0px’ custom_margin_sync=’true’ color=’main_color’ background=’bg_color’ custom_bg=’#ffffff’ background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” attachment=” attachment_size=” attach=’scroll’ position=’top left’ repeat=’no-repeat’ video=” video_ratio=’16:9′ overlay_opacity=’0.5′ overlay_color=” overlay_pattern=” overlay_custom_pattern=” shadow=’no-border-styling’ bottom_border=’no-border-styling’ bottom_border_diagonal_color=’#333333′ bottom_border_diagonal_direction=” bottom_border_style=” custom_arrow_bg=” id=” custom_class=” template_class=” aria_label=” av_element_hidden_in_editor=’0′ av_uid=’av-nhqjs2′ sc_version=’1.0′]
[av_textblock fold_type=” fold_height=” fold_more=’Read more’ fold_less=’Read less’ fold_text_style=” fold_btn_align=” textblock_styling_align=” textblock_styling=” textblock_styling_gap=” textblock_styling_mobile=” size=” av-desktop-font-size=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” font_color=” color=” fold_overlay_color=” fold_text_color=” fold_btn_color=’theme-color’ fold_btn_bg_color=” fold_btn_font_color=” size-btn-text=” av-desktop-font-size-btn-text=” av-medium-font-size-btn-text=” av-small-font-size-btn-text=” av-mini-font-size-btn-text=” fold_timer=” z_index_fold=” id=” custom_class=” template_class=” av_uid=’av-lktnoqje’ sc_version=’1.0′ admin_preview_bg=”]

Documentation

This documentation is all about CJT PLUS, but CJT Free users will also benefit while understanding the features CJT PLUS has to offer.
[/av_textblock]
[/av_section]

[av_hr class=’invisible’ icon_select=’yes’ icon=’ue808′ font=’entypo-fontello’ position=’center’ shadow=’no-shadow’ height=’40’ custom_border=’av-border-thin’ custom_width=’50px’ custom_margin_top=’30px’ custom_margin_bottom=’30px’ custom_border_color=” custom_icon_color=” id=” custom_class=” av_uid=’av-q72x6q’ admin_preview_bg=”]

[av_textblock size=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” font_color=” color=” id=” custom_class=” av_uid=’av-jyr216vy’ admin_preview_bg=”]

Documentation for CJT PLUS

This documentation is all about CJT PLUS. If you are a CJT freebie user, you will notice all the extra-awesomeness that CJT PLUS has to offer.

We have just introduced our How-To usage tips for CJT PLUS. Clicking into this section will fast-track your learning of CJT PLUS.

You will certainly pickup the basics of CJT Free whilst looking through this documentation. We have retained the older documentation until we continue to write the new version. Click for: PREVIOUS DOCUMENTATION
[/av_textblock]

[av_one_full first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-1q4la2q’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr22866′ custom_class=” admin_preview_bg=”]

QUICK START

CJT at its most fundamental level consists of a Code Block. This Code Block combines a Code Editor, an Assignment panel, and a bunch of other useful tools.

The behind-the-scenes functionality of a Code Block are Revisions and something we call Code Files. Each and every Code Block contains a Master Code File that will hold your Active Code. Every time you hit the Save button, CJT will automatically save a new revision for you. This allows you to go to any of your earlier revisions, load one into the editor, and decide whether to select it as the Active Code revision for the Code Block.

A very powerful feature that only CJT PLUS offers, is for you to create your own User Code Files.  This allows you to create mini projects within a Code Block so you can keep your code a lot more organised and maintained.  Click Code Files and Revisions for a better explanation.
[/av_textblock]
[/av_one_full]

[av_one_half first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-zbwmle’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr23o40′ custom_class=” admin_preview_bg=”]

Code Editor

This is the Code Editor window where you add your CSS, JavaScript, PHP, HTML, or plain text.
[/av_textblock]
[/av_one_half]

[av_one_half min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-ox6eg2′]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr280iw’ custom_class=” admin_preview_bg=”]

Assignment Panel

The Assignment Panel is where you select the Page, Post, Category etc, where you want your code (or text) to go on your website. Learn more
[/av_textblock]
[/av_one_half]

[av_hr class=’default’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ av-desktop-hide=” av-medium-hide=” av-small-hide=” av-mini-hide=” av_uid=’av-1jd0uhu’]

[av_one_half first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-1cwl7xe’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr2s2v8′ custom_class=” admin_preview_bg=”]

Master Admin Toolbar

The Master Admin Toolbar contains all of the top-level functions for all of your Code Blocks collectively. Learn more
[/av_textblock]
[/av_one_half]

[av_one_half min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-t2qhlu’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr2s2v8-8′ custom_class=” admin_preview_bg=”]

Code Block Toolbar

The Code Block Toolbar contains all of the functions at the single Code Block level. The diagram above shows the code block maximised. Learn more
[/av_textblock]
[/av_one_half]

[av_one_half first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-t2qhlu-7′]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr2s2v8-6′ custom_class=” admin_preview_bg=”]

Editor Tools

The Editor Tools predominantly contains all of the useful functions required for the editing experience. Learn more
[/av_textblock]
[/av_one_half]

[av_hr class=’default’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ av-desktop-hide=” av-medium-hide=” av-small-hide=” av-mini-hide=” av_uid=’av-jgn7nm’]

[av_one_full first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-l0o3oi’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr867bh’ custom_class=” admin_preview_bg=”]

Create as many Code Blocks as you need

CJT PLUS has been tested using over 100 code blocks and 1000’s of assignments (e.g. Posts/Pages/Categories/etc).
[/av_textblock]
[/av_one_full]

[av_three_fifth first min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-1fuonxe’]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr2s2v8-5′ custom_class=” admin_preview_bg=”]

One Code Block

You can have just one Code Block that simply adds Google Analytics to every website page on the front end.
[/av_textblock]
[/av_three_fifth]

[av_two_fifth min_height=” vertical_alignment=” space=” custom_margin=” margin=’0px’ row_boxshadow=” row_boxshadow_color=” row_boxshadow_width=’10’ link=” linktarget=” link_hover=” title_attr=” alt_attr=” padding=’0px’ highlight=” highlight_size=” border=” border_color=” radius=’0px’ column_boxshadow=” column_boxshadow_color=” column_boxshadow_width=’10’ background=’bg_color’ background_color=” background_gradient_color1=” background_gradient_color2=” background_gradient_direction=’vertical’ src=” background_position=’top left’ background_repeat=’no-repeat’ animation=” mobile_breaking=” mobile_display=” av_uid=’av-1fuonxe-3′]
[av_textblock size=” font_color=” color=” av-medium-font-size=” av-small-font-size=” av-mini-font-size=” av_uid=’av-jyr2s2v8-2′ custom_class=” admin_preview_bg=”]

Many Code Blocks

Or many Code Blocks using different code languages that all work together to add some complex functionality. The diagram above shows all of the Code Blocks minimised.
[/av_textblock]
[/av_two_fifth]

[av_hr class=’default’ height=’50’ shadow=’no-shadow’ position=’center’ custom_border=’av-border-thin’ custom_width=’50px’ custom_border_color=” custom_margin_top=’30px’ custom_margin_bottom=’30px’ icon_select=’yes’ custom_icon_color=” icon=’ue808′ av-desktop-hide=” av-medium-hide=” av-small-hide=” av-mini-hide=” av_uid=’av-jgn7nm-4′]