HTML-Prompts für KI
Lassen Sie die KI HTML schreiben, das sauber konvertiert
If your HTML is AI-generated, paste one of these prompts first. The result maps more cleanly into Elementor headings, text, images, buttons and containers.
Allgemeiner Prompt
For ordinary pages, detail pages and intros. Copy the whole block, then add your info.
Please generate a complete HTML page that I will import into Elementor, following these rules:
1. Output only a single complete HTML file starting from <!doctype html>, no extra explanation.
2. Put all styles inside one <style> tag in <head>, or as inline style. Do not link external CSS files.
3. Split the page into clear sections (hero, benefits, content, call to action), each wrapped in <section> or <div>.
4. Use <h1>–<h3> for headings, <p> for body text, and <a> or <button> for buttons.
5. Use <img> with clear alt text; if there is no real image, use a placeholder URL and note it must be replaced.
6. Prefer flex or grid for layout; do not rely on absolute positioning.
7. Use simple inline SVG for icons, not emoji.
8. Do not include JavaScript, form submissions, carousels or popups.
Here is the page information:
(add your product/page topic, key selling points, and copy notes here)Prompt für Produktseite
For product and detail pages, emphasizing product structure.
Generate a complete product detail HTML page to import into Elementor. Same rules as above (single file, inline styles, clear sections, no scripts), and include these sections:
1. Hero: product name <h1>, one-line selling point <p>, two buttons (Get a Quote / View Details), and a main product image placeholder.
2. Key benefits: 3–6 benefit cards, each with a title, description and an inline SVG icon.
3. Specifications: a <table> listing key parameters.
4. Use cases: 2–3 image-and-text use cases.
5. Call to action: a heading and a button.
Product info:
(add product name, benefits, specs, target customer here)Prompt für Landingpage
For campaign and single-product pages, emphasizing conversion structure.
Generate a complete marketing landing HTML page to import into Elementor. Same rules as above (single file, inline styles, clear sections, no scripts), with this structure:
1. Hero: big heading <h1> + subheading <p> + primary button + a visual placeholder.
2. Advantages: 3–4 advantage cards with simple inline SVG icons.
3. Trust: testimonials or stats (as text, not inside images).
4. FAQ: 3–5 items as headings and paragraphs.
5. Closing CTA: one line + a button.
Campaign info:
(add the campaign topic, audience, selling points and goal here)Warum diese Regeln
They make AI output convert into editable Elementor components more easily.
| Regel | Vorteil |
|---|---|
| Inline styles, no external CSS | The tool reads real styles, so spacing and colors match after import. |
| Clear sections, semantic tags | Easier to split into separate heading/text/image/button/container components. |
| SVG icons, not emoji | Icons import more reliably and look more polished. |
| Clear image replacement notes | Even without real images, image slots import and can be replaced later. |
| No complex scripts | Safer import and fewer Elementor errors. |
| Content split into clear blocks | Better structure after import, easier to move, delete and edit. |
Try to avoid asking AI for this
Not impossible to convert, but more likely to need manual fixes after import.
- Script-driven carousels, popups or toggles.
- Important text baked into images — keep text in the page.
- Emoji used as icons.
- Strange deep nesting — keep sections clear.
- Image URLs pointing at local disk paths.
- Pages that depend on external files, which lose styles or content when pasted.