--- title: "Adding code blocks" slug: "code-blocks" description: "Document360 uses for syntax highlighting and supports various programming languages in code blocks. You can insert code blocks in Markdown, WYSIWYG, and Advanced WYSIWYG editor. " tags: ["codeblock"] updated: 2026-04-10T20:09:03Z published: 2026-04-17T05:28:20Z --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Adding code blocks Document360 uses [Prism.js](https://prismjs.com/) for syntax highlighting and supports various programming languages in code blocks, including: - HTML - C# - Java - JavaScript - XML - JSON - CSS - SQL - Python - Markdown - PHP - PowerShell - Text For an exhaustive list of languages that are supported, please refer to the documentation for [Prism's Supported languages](https://prismjs.com/#supported-languages). --- ## Creating code blocks in the Markdown editor In the Markdown editor, there are two methods to create fenced code blocks: 1. Use **triple backticks** ````` before and after the code snippet. For example: ```csharp [your code snippet] ``` 1. Use the shortcut `Ctrl+Shift+P`**** or click the **Insert codeblock** (**) icon from the formatting toolbar. ![1_ScreenGIF-Creating_code_blocks_in_the_Markdown_editor](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/1_ScreenGIF-Creating_code_blocks_in_the_Markdown_editor.gif) --- ## Creating code blocks in the WYSIWYG (HTML) editor To create code blocks in the WYSIWYG (HTML) editor, follow the steps below: 1. Navigate to the desired article in the WYSIWYG editor. 2. Click the **Code block** (**) icon, and a panel will appear. 3. Select your desired language from the dropdown menu. 4. Enter your code into the **Insert your code** field. 5. Click **Insert** to add the code block to your article. 6. Click the **Edit** (**) icon on the right side to edit a code block. 7. Click the **Delete**(**) icon on the right side to delete a code block. ![2_ScreenGIF-Creating_code_blocks_in_WYSIWYG_HTML](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/2_ScreenGIF-Creating_code_blocks_in_WYSIWYG_HTML.gif) --- ## Creating code blocks in the Advanced WYSIWYG editor To create a code block in the Advanced WYSIWYG editor, follow the steps below: 1. Navigate to the desired article in the Advanced WYSIWYG editor. 2. You can create code blocks in three ways: 1. Click the **Code block** (**) icon in the **Quick insert** menu. The **Quick insert** menu will appear only when the block is empty. 2. Enter three backticks ````` and press **Enter**. 3. Use the slash command `/code block` and press **Enter**. 3. Click on the created code block. A floating menu will appear. 4. Select the desired heading. 5. Click the **Copy**(**) icon to copy the code. 6. Click the **Delete** (**) icon to delete the code block. 7. Enter the indented code inside the code block. ![Instructions for using the Advanced WYSIWYG Editor with code block methods highlighted.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/code block.png) --- #### Language shortcodes - C: c - C++: CPP, c++ - C#: csharp - CSS: css - CoffeeScript: coffeescript - HTML: html - JSON: json - Java: java - JavaScript: javascript, js - Objective-C: objective-c, obj-c, objc - Objective-C++: objc++ - PHP: php - Perl: perl, pl - Python 3: python3, py3 - Python: python, py - Ruby: ruby, rb - Snobol: snobol - XML: xml #### Custom language If the desired language is unavailable, you can create a **Custom Language** code block. 1. **In the Markdown editor**: After inserting the code block, add a title by entering the desired text after the initial backticks: ```markdown ```HTML Hello world ``` ``` 1. **In the WYSIWYG editor**: Select **Custom** from the **Select Language** dropdown and enter your desired title in the **Enter your title** field. 2. **In the Advanced WYSIWYG editor**: Use the search bar in the dropdown to select **Custom**, then click the **Edit**(**) icon to enter your title and click **Update**. ![](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/ScreenGIF-Custom_Language_in_code_block.gif) --- ### Indentation and code blocks Any text indented by at least four spaces will be treated as a code block. This method is useful for longer code snippets, but it will not include syntax highlighting. The following code block is created using indents instead of backticks. ```python def test():    logging.error('Test failed') ``` --- ### Code block examples The following code blocks are created in various programming languages, including C#, JavaScript, XML, JSON, PowerShell, and Ruby, to dynamically showcase syntax and functionality. ****C# block**** ```csharp using System; namespace HelloWorld {    class Hello    {        static void Main()        {            Console.WriteLine("Hello World!");            // Keep the console panel open in debug mode.            Console.WriteLine("Press any key to exit.");            Console.ReadKey();        }    } } ``` ****Javascript block**** ```javascript function $initHighlight(block, cls) { try { if (cls.search(/\bno\-highlight\b/) != -1) return process(block, true, 0x0F) + ` class="${cls}"`; } catch (e) { /* handle exception */ } export $initHighlight; ``` ****XML block**** ```xml      Gambardella, Matthew      XML Developer's Guide      Computer      44.95      2000-10-01      An in-depth look at creating applications      with XML.   ``` ****JSON block**** ```json {    "one": 2,    "three": {        "point_1": "point_2",        "point_3": 3.4    },    "list": [        "one",        "two",        "three"    ] } ``` ****PowerShell block**** ```powershell $user = Read-Host "Enter Username" $pass = Read-Host "Enter Password" -AsSecureString ``` ****Ruby block**** ```ruby require 'redcarpet' markdown = Redcarpet.new("Hello World!") puts markdown.to_html ``` --- ### FAQs #### What programming languages are supported for syntax highlighting in code blocks? Document360 supports syntax highlighting for languages such as HTML, C#, Java, JavaScript, XML, JSON, CSS, SQL, Python, Markdown, PHP, PowerShell, and Text. #### How do I indent the contents in a code block with multiple lines? To indent, manually add spaces at the start of each line where you want indentation. If you're pasting code, use the shortcut `Ctrl + Shift + V` to preserve the formatting. #### How can I create a code block in the Markdown editor? You can create a code block in the Markdown editor by using triple backticks ````` before and after your code snippet or by using the shortcut `Ctrl+Shift+P`. #### Is it possible to create a custom language code block? Yes, select **Custom** from the language dropdown, then enter your desired title. A lightweight text-to-HTML conversion tool used to format content such as lists, headers, images, videos, and links. Document360 includes a powerful markdown editor as one of its two basic editors. ## Related - [Adding hyperlinks](/linking-to-other-articles.md)