How to Use Code Blocks: A Complete Guide to Custom Code Implementation
Discover how to enhance your site with custom code blocks for HTML, Markdown, CSS, and more. Code blocks allow you to embed third-party widgets, display code snippets, and add custom functionality to various content areas.
embedded scripts alert
Adding a Code Block:
- Edit your page or post
- Click Add Block or insertion point
- Select Code
- Click the pencil icon to open block editor
- Add your code in the text field
Display Options:
- For code snippets: Enable "Show Source" for formatted, readable code display
- For rendering code: Select HTML or Markdown from the Type menu
- For CSS: Place code between
- For JavaScript: Place code between <script> tags
Important Tips:
- Preview in Safe Mode to view embedded elements while logged in
- Remove pages from Index if code doesn't display properly
- Disable Ajax loading if experiencing issues
- Custom code may need testing while logged out
- Contact code source for widget-specific troubleshooting
Best Practices:
- Test code thoroughly before implementation
- Keep backups of your custom code
- Ensure code is compatible with your site's platform
- Follow security best practices when implementing third-party code
Troubleshooting:
- Disable scripts in preview mode if unable to edit
- Test code outside of Index pages
- Verify code compatibility with your site's version
- Check for syntax errors in custom code
- Ensure all necessary dependencies are included
Code blocks provide a powerful way to extend your site's functionality while maintaining clean, organized implementation of custom features.