Using AI-Generated Code
Artificial intelligence (AI) tools such as ChatGPT, Claude, Gemini, Microsoft Copilot, and others can be excellent resources for creating HTML, CSS, and JavaScript. However, AI-generated code often requires review and modification before it is suitable for use within an existing website.
Best Practices
When using AI-generated code within CatapultCMS:
- Generate only the HTML, CSS, and JavaScript needed for the specific component or section of the page.
- Ensure all CSS is scoped to a unique parent container rather than using global selectors.
- Avoid generating complete HTML documents (
<!DOCTYPE html>,<html>,<head>, or<body>). - Avoid page-level CSS or JavaScript that modifies common elements such as:
bodyhtmlheader.container- generic heading (
h1,h2, etc.) or paragraph (p) selectors
- Test custom code on a staging site before publishing to your live website.
Common Issues
AI tools are often designed to generate complete standalone web pages. When that code is pasted directly into a CatapultCMS page, it may unintentionally:
- Override the website's existing styles.
- Change page layout or spacing.
- Affect navigation, headers, or footers.
- Interfere with built-in CatapultCMS or Bootstrap components.
- Cause unexpected behavior elsewhere on the page.
Support for Custom and AI-Generated Code
CatapultCMS Support is happy to help determine whether custom or AI-generated code is affecting your website or conflicting with the CMS.
Standard Support includes:
- Identifying whether custom code is causing an issue.
- Explaining the nature of the conflict.
- Assisting with restoring the page by removing or disabling problematic code.
Standard Support does not include:
- Troubleshooting custom HTML, CSS, or JavaScript.
- Debugging or rewriting AI-generated code.
- Modifying custom code to work within a CatapultCMS website.
- Developing or enhancing custom functionality.
Requests to repair, modify, or integrate custom or AI-generated code may require a Professional Services engagement.
Recommendations
If you're using an AI tool to generate code, we recommend prompting it to create embeddable HTML components rather than complete web pages. The generated code should be designed to integrate with an existing website and should avoid modifying global page styles.