EasyPageGO
Get Your Docs

Codeblocks

The Code Block element in EasyPageGO is designed to enhance your documentation by allowing you to easily insert and manage code snippets. Here’s everything you need to know about this powerful feature:

sdk-example.js javascript
import ExampleAPI from 'example-api-sdk'; const api = new ExampleAPI({ apiKey: 'YOUR_API_KEY', // Replace with your actual API key baseUrl: 'https://api.example.com' }); async function fetchUserData(userId) { try { const userData = await api.getUser(userId); console.log('User Data:', userData); } catch (error) { console.error('Error fetching user data:', error); } } // Call the function with a specific user ID fetchUserData('12345');

Simple to Insert

Adding a Code Block to your documentation is a breeze. With our intuitive no-code interface, you can insert a code snippet with just a few clicks. No technical expertise is required, making it accessible for everyone, regardless of their coding background.

Edit in Real Time

One of the standout features of the Code Block element is its real-time editing capability. As you make changes to your code snippet, you can see the updates instantly. This ensures that your documentation remains accurate and up-to-date without the need for cumbersome refreshes or additional steps.

You can assign a name to the snippet.

Optimized Code Block Rendering

When using Code Blocks in EasyPageGO, the final output automatically accounts for the space needed to render your code snippets. This ensures that the necessary space is allocated upfront, preventing any unexpected shifts in content as the page loads. By minimizing Cumulative Layout Shift (CLS), EasyPageGO helps you maintain a stable and visually consistent layout, resulting in a better user experience and improved SEO performance.

Based on Shiki

The element is powered by Shiki, a robust syntax highlighter that supports a wide range of programming languages and themes. Here are some key highlights:

  • Highlighting supports 282 Languages: whether you’re working with Python, JavaScript, HTML, or any other language, it has you covered. With support for 282 languages, you can showcase your code snippets in the most relevant format for your audience.
  • 45 Themes Available: customize the appearance of your code snippets with a selection of 45 themes. Whether you prefer a light or dark mode, or something in between, you can choose a theme that complements your documentation style and enhances readability.

From the general configuration page, you can choose two themes for your codeblocks, one for light mode and one for dark mode.

  • List of Supported Languages
  • List of available Themes