Compatible XF Versions
2.0, 2.1, 2.2
Visible Branding
No
Additional Requirements
For 2.1+ versions:
• XenForo 2.1
• PHP 7 +
CodeLogotype.png

Description

This addon makes code bbcode and code editor way more functional by adding copy, expand, collapse buttons, resizer bar and automatically adjusting the colors to fit chosen forum style.

Features
func_features.png

Custom title and lines highlighting

You can now specify a custom code block header title. For example, users can provide a filename for code blocks instead of writing it in the text or putting the whole code block inside a spoiler with filename title.

Moreover, you can even highlight certain lines!

Custom title and lines to be highlighted can be set via "Insert code" dialog:
highlight_lines_text_field.png

You can also set the title and lines to highlight directly in text editor by adding title="..." and highlight="..." parameters in code bbcode.

Example: [code lang="php" title="My Custom Title"]<? .... ?>[/code] will produce this codeblock:
1535718915924.png

Hovering custom title will show the code language:
1535719001075.png

Example of highlighting: [code lang="php" highlight="2, 5-8"]a log of code...[/code]
highlighted_code_example.png

Expand/Collapse buttons

Expand button smoothly increasing the height of code block until all the code is showing. It is visible only when code block height is LESS than the actual code size.

Collapse button smoothly decreasing the height of code block to it's default height which you can set in style properties. It is visible only when code block height is LARGER than default code block height.
expand-collapse.gif

Both expand and collapse buttons are visible when code block height is within min and max limits and invisible on code blocks that are smaller than default code block height.

The default height of code block can be set in style properties ("Code" section below "Messages"):
1535723219891.png

Copy button

Copy button simply copy the code right into your clipboard:
copy.gif

Line numbers

All code blocks have line numbers (up to 1000 lines). Line numbers can be turned off via style properties:
1535721681160.png

Resizer

Every code block which code height is larger than the default height has a resizer bar. It allows users to vertically resize code block:
resizer.gif

Common languages

I always thought there is something wrong about "Common languages". Why can't we set which languages are "common" to our specific forum? Weird...

With Code addon you can now set common languages right after "Allowed code languages" option in "Messages" option-group:
1535723658651.png

Hurray!
1535723826755.png

Default language

You can also set a default language code for "Insert code" dialog via "Default code language" option after common languages in "Messages" option-group:
1535743202787.png

Custom code block CSS class

There is an option to add a custom CSS class for code block. Just specify class="..." BB code attribute for that. Now you can style code blocks with this class. Here is an example:
custom_code_block_styling.png

Installation
  1. Download the addon
  2. Upload contents of upload folder to your forum root
  3. In admin control panel go to "Addons" section and install Code
Unistallation

WARNING: after unistalling all code blocks with custom titles/highlighting/class will not be rendered as code blocks!
  1. Uninstall the addon from ACP
  2. Go to forum root folder and remove js/CMTV/Code folder.
Author
ENXF NET
Downloads
131
Views
2,127
Last update
Rating
5.00 star(s) 1 ratings

More resources from ENXF NET

Latest updates

  1. Correction to set custom title for code block and highlighted lines:

    Attached to this post fixed version for 2.2.7
  2. Update 2.2.0

    Features An option to set a default code language for all code block on the forum without...
  3. Hotfix 2.1.2

    Fixes a problem with upgrading. If any other errors happen, try to fully remove the addon. Than...

Latest reviews

nice
Top