Code editor: multi-language
2 min
Code editor: multi-language blocks group multiple code snippets into a single container with a language switcher. They are useful for presenting examples in different programming languages without taking up additional space.
Syntax
You can add this component using either Markdown or MDX.
:::CodeblockTabs
```javascript
const greeting = 'Hello, world!'
console.log(greeting)
```
```python
greeting = "Hello, world!"
print(greeting)
```
```bash
echo "Hello, world!"
```
:::Each fenced code block inside a CodeblockTabs container becomes a separate tab. By default, the tab title is generated from the language identifier of the code block, such as javascript, python, or bash.
To give a tab its own title, write the title on its own line directly above the code block. A title can contain colons, such as Step 1: install, and must fit on one line.
:::CodeblockTabs
Step 1: install
```bash
npm install
```
Step 2: start
```bash
npm start
```
:::If you only need to display a single snippet, use a standard fenced code block instead.
```javascript
const x = 1
```Have a question?
Our super-smart AI, knowledgeable support team and an awesome community will get you an answer in a flash.
To ask a question or participate in discussions, you'll need to authenticate first.