How to fix AI code slop
Clean up messy AI output and get better code quality from Clyro.
Sometimes the AI generates code that works but looks messy, has unnecessary complexity, or does not match the quality you expect. Here is how to deal with it.
What is "code slop"?
Signs that the AI output needs cleanup:
- Inline styles everywhere instead of using CSS classes
- Overly complex Liquid logic for something simple
- Duplicate code across sections
- Settings that do not actually work in the customizer
- Hardcoded values that should be settings
How to prevent it
1. Use a better model
Haiku is fast and cheap but more likely to produce sloppy code. Switch to Sonnet or Opus for anything beyond simple edits. The quality difference is significant.
2. Be specific in your prompts
"Add a hero section" gives the AI too much freedom. "Add a hero section with a full-width background image, overlay text, and a CTA button. Make all text and the image editable in the customizer." gives it clear constraints.
3. Ask for cleanup explicitly
If you see messy output, just say so:
"The hero section has too many inline styles. Refactor it to use clean CSS classes in the stylesheet tag."
"This section has hardcoded colors. Make them all customizer settings."
"Simplify this code. It's doing too much for what it needs to do."
How to fix it after the fact
Use fix mode
Start your message with the problem. The AI will switch to diagnostic mode, read the current code, and fix specific issues without rewriting everything.
Edit the code yourself
On paid plans, you can open the Code tab and edit files directly. If you know Liquid, sometimes it is faster to fix a few lines yourself than to explain the change to the AI.
Rewind and try again
If the output is really bad, use the rewind feature to go back to before the AI made the change. Then try again with a more specific prompt or a better model.