{"id":77258,"date":"2025-03-18T10:13:57","date_gmt":"2025-03-18T10:13:57","guid":{"rendered":"https:\/\/fahimai.com\/?p=77258"},"modified":"2026-03-03T22:56:35","modified_gmt":"2026-03-03T19:56:35","slug":"how-to-use-codedesign-ai","status":"publish","type":"post","link":"https:\/\/www.fahimai.com\/de\/how-to-use-codedesign-ai","title":{"rendered":"How to Use CodeDesign AI Step by Step &#8211; 2026 Tutorial"},"content":{"rendered":"\n<h2 id='quick-start'  id=\"boomdevs_1\" class=\"wp-block-heading\">Quick Start<\/h2>\n\n\n\n<div class=\"wp-block-group quick-start-logo is-layout-flow wp-block-group-is-layout-flow\"><style>.kb-image71695_14d860-5e.kb-image-is-ratio-size, .kb-image71695_14d860-5e .kb-image-is-ratio-size{max-width:350px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image71695_14d860-5e.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image71695_14d860-5e .kb-image-is-ratio-size{align-self:unset;}.kb-image71695_14d860-5e figure{max-width:350px;}.kb-image71695_14d860-5e .image-is-svg, .kb-image71695_14d860-5e .image-is-svg img{width:100%;}.kb-image71695_14d860-5e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image71695_14d860-5e\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"800\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA.png\" alt=\"Codedesign CTA\" class=\"kb-img wp-image-53809\" title=\"\" srcset=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA.png 800w, https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA-480x480.png 480w\" sizes=\"auto, (min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 800px, 100vw\" \/><\/figure><\/div>\n<\/div>\n\n\n\n<p><strong>This guide covers every CodeDesign AI feature:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"#getting-started-with-codedesign-ai\">Getting Started<\/a> \u2014 Create your account and first project<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-web-hosting\">How to Use AI Web Hosting<\/a> \u2014 Publish and host your site instantly<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-sales-funnel-builder\">How to Use AI Sales &amp; Marketing Funnel Builder<\/a> \u2014 Build funnels that convert visitors<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-seo-content-tools\">How to Use SEO Content Tools<\/a> \u2014 Rank higher on search engines<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-code-generator\">How to Use Free AI Code Generator<\/a> \u2014 Export clean HTML, CSS, and JavaScript<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-writing-tools\">How to Use AI Writing Tools<\/a> \u2014 Generate marketing copy in seconds<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-drag-drop-builder\">How to Use Drag &amp; Drop Website Builder<\/a> \u2014 Design pages without code<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-landing-page-builder\">How to Use Landing Page Builder<\/a> \u2014 Create high-converting landing pages<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-project-manager\">How to Use Project Manager<\/a> \u2014 Organize multiple websites at once<\/li>\n\n\n\n<li><a href=\"#how-to-use-codedesign-ai-template-builder\">How to Use Template Builder<\/a> \u2014 Create reusable custom templates<\/li>\n<\/ul>\n\n\n\n<p><strong>Time needed:<\/strong> 5 minutes per feature<\/p>\n\n\n\n<p><strong>Also in this guide:<\/strong> <a href=\"#codedesign-ai-pro-tips-and-shortcuts\">Pro Tips<\/a> | <a href=\"#codedesign-ai-common-mistakes-to-avoid\">Common Mistakes<\/a> | <a href=\"#codedesign-ai-troubleshooting\">Troubleshooting<\/a> | <a href=\"#codedesign-ai-pricing\">Pricing<\/a> | <a href=\"#codedesign-ai-vs-alternatives\">Alternatives<\/a><\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Why Trust This Guide<\/p>\n\n\n\n<p>I have used CodeDesign AI for over 6 months and tested every feature covered here. This how to use codedesign ai tutorial comes from real hands-on experience.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"420\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/03\/Fahim-AI-5-1-12.png\" alt=\"how to use codedesign\" class=\"wp-image-77259\" title=\"\" srcset=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/03\/Fahim-AI-5-1-12.png 800w, https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/03\/Fahim-AI-5-1-12-480x252.png 480w\" sizes=\"auto, (min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 800px, 100vw\" \/><\/figure>\n\n\n\n<p>CodeDesign AI is one of the most powerful AI website builders available today.<\/p>\n\n\n\n<p>But most users only scratch the surface of what it can do.<\/p>\n\n\n\n<p>This guide shows you how to use every major feature.<\/p>\n\n\n\n<p>Step by step, with screenshots and pro tips.<\/p>\n\n\n\n<h2 id='codedesign-ai-tutorial'  id=\"boomdevs_2\" class=\"wp-block-heading\">CodeDesign AI Tutorial<\/h2>\n\n\n\n<p>This complete CodeDesign AI tutorial walks you through every feature step by step, from initial setup to advanced tips that will make you a power user.<\/p>\n\n\n\n<div class=\"wp-block-group cta-box-container is-layout-flow wp-block-group-is-layout-flow\">\n<div class=\"wp-block-columns cta-box-inner is-layout-flex wp-container-core-columns-is-layout-3058809c wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column cta-box-left is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-group cta-box-logo is-layout-flow wp-block-group-is-layout-flow\"><style>.kb-image71695_14d860-5e.kb-image-is-ratio-size, .kb-image71695_14d860-5e .kb-image-is-ratio-size{max-width:350px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image71695_14d860-5e.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image71695_14d860-5e .kb-image-is-ratio-size{align-self:unset;}.kb-image71695_14d860-5e figure{max-width:350px;}.kb-image71695_14d860-5e .image-is-svg, .kb-image71695_14d860-5e .image-is-svg img{width:100%;}.kb-image71695_14d860-5e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image71695_14d860-5e\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"800\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA.png\" alt=\"Codedesign CTA\" class=\"kb-img wp-image-53809\" title=\"\" srcset=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA.png 800w, https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-CTA-480x480.png 480w\" sizes=\"auto, (min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 800px, 100vw\" \/><\/figure><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column cta-box-right is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"cta-box-title\">CodeDesign AI<\/p>\n\n\n\n<p class=\"cta-box-description\">Build a professional website in under 60 seconds with AI. CodeDesign AI turns a simple text prompt into a fully designed, responsive site. Get started free with no coding needed.<\/p>\n\n\n\n<div class=\"wp-block-group cta-box-buttons is-layout-flow wp-block-group-is-layout-flow\">\n<p><a class=\"cta-btn cta-btn-primary\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\">TRY CODEDESIGN AI NOW \u2192<\/a><\/p>\n\n\n\n<p><a class=\"cta-btn cta-btn-secondary\" href=\"https:\/\/www.fahimai.com\/codedesign\">READ FULL REVIEW \u2192<\/a><\/p>\n\n\n\n<p><a class=\"cta-btn cta-btn-secondary\" href=\"https:\/\/www.fahimai.com\/codedesign-ai-alternatives\">CODEDESIGN AI ALTERNATIVES \u2192<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<h3 id='getting-started-with-codedesign-ai'  id=\"boomdevs_3\" class=\"wp-block-heading\" id=\"getting-started-with-codedesign-ai\">Getting Started with CodeDesign AI<\/h3>\n\n\n\n<p>Before using any feature, complete this one-time setup.<\/p>\n\n\n\n<p>It takes about 3 minutes.<\/p>\n\n\n\n<p>Now let us walk through each step.<\/p>\n\n\n\n<h4 id='step-1-create-your-account'  id=\"boomdevs_4\" class=\"wp-block-heading\">Step 1: Create Your Account<\/h4>\n\n\n\n<p>Go to codedesign.ai and click &#8220;Get Started for Free.&#8221;<\/p>\n\n\n\n<p>Enter your email address and create a password.<\/p>\n\n\n\n<p>You can also sign up with your Google account.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> Check your <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/inbox-placement-tool\" title=\"inbox\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48173\" target=\"_blank\" rel=\"noopener\">inbox<\/a> for a confirmation email.<\/p>\n\n\n\n<h4 id='step-2-generate-your-first-website'  id=\"boomdevs_5\" class=\"wp-block-heading\">Step 2: Generate Your First Website<\/h4>\n\n\n\n<p>Type a short description of the website you want to build.<\/p>\n\n\n\n<p>For example: &#8220;A photography portfolio with a contact form.&#8221;<\/p>\n\n\n\n<p>Here&#8217;s what the AI generation screen looks like:<\/p>\n\n\n<style>.kb-image053d3b_86d1d8 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image053d3b_86d1d8 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/homepage-3-1280x698.png\" alt=\"Codedesign ai Homepage\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see a full website design in about 60 seconds.<\/p>\n\n\n\n<h4 id='step-3-explore-the-dashboard'  id=\"boomdevs_6\" class=\"wp-block-heading\">Step 3: Explore the Dashboard<\/h4>\n\n\n\n<p>Click through the main navigation to see all your tools.<\/p>\n\n\n\n<p>The dashboard shows your projects, templates, and settings.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Done:<\/strong> You&#8217;re ready to use any feature below.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-web-hosting'  id=\"boomdevs_7\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-web-hosting\">How to Use CodeDesign AI Web Hosting<\/h3>\n\n\n\n<p><strong>AI Web Hosting<\/strong> lets you publish your site on CodeDesign cloud servers with one click.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch AI Web Hosting in action:<\/p>\n\n\n<style>.kb-image6c1364_08aa5f .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image6c1364_08aa5f size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/ai-web-hosting-980x611.png\" alt=\"Codedesign ai AI Web Hosting\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-open-your-project-settings'  id=\"boomdevs_8\" class=\"wp-block-heading\">Step 1: Open Your Project Settings<\/h4>\n\n\n\n<p>Go to your project and click the Publish button in the top menu.<\/p>\n\n\n\n<p>Select Host on CodeDesign from the dropdown options.<\/p>\n\n\n\n<h4 id='step-2-connect-your-domain'  id=\"boomdevs_9\" class=\"wp-block-heading\">Step 2: Connect Your Domain<\/h4>\n\n\n\n<p>Enter your custom domain name or use the free CodeDesign subdomain.<\/p>\n\n\n\n<p>Here is what this looks like:<\/p>\n\n\n<style>.kb-imagea2077b_5ad301 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-imagea2077b_5ad301 size-large\"><img decoding=\"async\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Untitled-design-19.png\" alt=\"Codedesign ai Top Benefits\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see a green checkmark next to your domain.<\/p>\n\n\n\n<h4 id='step-3-click-publish'  id=\"boomdevs_10\" class=\"wp-block-heading\">Step 3: Click Publish<\/h4>\n\n\n\n<p>Hit the Publish button and your site goes live in seconds.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> Your website is live and hosted on CodeDesign cloud servers.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> CodeDesign enables SSL by default on all hosted sites. No extra setup needed for HTTPS.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-sales-marketing-funnel-builder'  id=\"boomdevs_11\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-sales-funnel-builder\">How to Use CodeDesign AI Sales &amp; Marketing Funnel Builder<\/h3>\n\n\n\n<p><strong>AI Sales &amp; Marketing Funnel Builder<\/strong> lets you create multi-step funnels that guide visitors toward a purchase.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch the Funnel Builder in action:<\/p>\n\n\n<style>.kb-image4f5e52_282465 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image4f5e52_282465 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/AI-Sales-Marketing-Funnel-Builder-980x762.png\" alt=\"Codedesign ai AI Sales &amp; Marketing Funnel Builder\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-choose-a-funnel-template'  id=\"boomdevs_12\" class=\"wp-block-heading\">Step 1: Choose a Funnel Template<\/h4>\n\n\n\n<p>Click Sales Funnel from the dashboard and pick a funnel type.<\/p>\n\n\n\n<p>Options include lead capture, product launch, and webinar funnels.<\/p>\n\n\n\n<h4 id='step-2-customize-each-funnel-step'  id=\"boomdevs_13\" class=\"wp-block-heading\">Step 2: Customize Each Funnel Step<\/h4>\n\n\n\n<p>Edit the landing page, thank you page, and email capture form.<\/p>\n\n\n\n<p>Here is what this looks like:<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see all funnel steps connected in the flow editor.<\/p>\n\n\n\n<h4 id='step-3-connect-your-forms-and-go-live'  id=\"boomdevs_14\" class=\"wp-block-heading\">Step 3: Connect Your Forms and Go Live<\/h4>\n\n\n\n<p>Link your email service or <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/zapier\" title=\"Zapier\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48171\" target=\"_blank\" rel=\"noopener\">Zapier<\/a> integration to capture leads.<\/p>\n\n\n\n<p>Click Publish Funnel to make it live.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> Your sales funnel is live and ready to capture leads.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Start with the lead capture funnel template. It converts well and only needs two pages.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-seo-content-tools'  id=\"boomdevs_15\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-seo-content-tools\">How to Use CodeDesign AI SEO Content Tools<\/h3>\n\n\n\n<p><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/local-seo-tools\" title=\"SEO\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48177\" target=\"_blank\" rel=\"noopener\">SEO<\/a> Content Tools<\/strong> lets you write search-friendly copy that ranks higher on Google.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch SEO Content Tools in action:<\/p>\n\n\n<style>.kb-image7cf647_d74cd7 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image7cf647_d74cd7 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/seo-content-tools-980x390.png\" alt=\"Codedesign ai SEO Content Tools\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-open-the-seo-panel'  id=\"boomdevs_16\" class=\"wp-block-heading\">Step 1: Open the SEO Panel<\/h4>\n\n\n\n<p>Click on any page in your project and open the SEO settings tab.<\/p>\n\n\n\n<p>You will see fields for title tag, meta description, and keywords.<\/p>\n\n\n\n<h4 id='step-2-generate-seo-content-with-ai'  id=\"boomdevs_17\" class=\"wp-block-heading\">Step 2: Generate SEO Content with AI<\/h4>\n\n\n\n<p>Click Generate with AI to auto-fill your title and description.<\/p>\n\n\n\n<p>Here is what this looks like:<\/p>\n\n\n<style>.kb-image0a3de6_a95638 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image0a3de6_a95638 size-large\"><img decoding=\"async\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-top-benefits.png\" alt=\"Codedesign ai Personal Experience\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see a green SEO score for your page.<\/p>\n\n\n\n<h4 id='step-3-add-alt-text-and-headings'  id=\"boomdevs_18\" class=\"wp-block-heading\">Step 3: Add Alt Text and Headings<\/h4>\n\n\n\n<p>Make sure every image has alt text and your page uses H1 and H2 tags.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> Your page is now search-engine friendly and ready to rank.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Use the meta description <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-ai-text-generator\" title=\"generator\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48182\" target=\"_blank\" rel=\"noopener\">generator<\/a> to write click-worthy snippets for better click-through rates.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-free-ai-code-generator'  id=\"boomdevs_19\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-code-generator\">How to Use CodeDesign AI Free AI Code Generator<\/h3>\n\n\n\n<p><strong>Free AI Code Generator<\/strong> lets you export clean HTML, CSS, and JavaScript from any project.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch the Code Generator in action:<\/p>\n\n\n<style>.kb-image5f4c91_c568e4 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image5f4c91_c568e4 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/Free-AI-Code-Generator-980x834.png\" alt=\"Codedesign ai Free AI Code Generator\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-open-the-code-export-panel'  id=\"boomdevs_20\" class=\"wp-block-heading\">Step 1: Open the Code Export Panel<\/h4>\n\n\n\n<p>Go to your project settings and click Export Code.<\/p>\n\n\n\n<p>Choose between HTML\/CSS or React export options.<\/p>\n\n\n\n<h4 id='step-2-preview-and-download-the-code'  id=\"boomdevs_21\" class=\"wp-block-heading\">Step 2: Preview and Download the Code<\/h4>\n\n\n\n<p>Review the generated code in the preview window.<\/p>\n\n\n\n<p>Click Download to save the files to your computer.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see a ZIP file with all your code files inside.<\/p>\n\n\n\n<h4 id='step-3-deploy-to-your-own-host'  id=\"boomdevs_22\" class=\"wp-block-heading\">Step 3: Deploy to Your Own Host<\/h4>\n\n\n\n<p>Upload the exported files to any web hosting provider you prefer.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> You have clean, production-ready code you can host anywhere.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Open the exported code in VS Code first. Test locally before pushing to your live server.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-writing-tools'  id=\"boomdevs_23\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-writing-tools\">How to Use CodeDesign AI Writing Tools<\/h3>\n\n\n\n<p><strong>AI Writing Tools<\/strong> lets you generate headlines, paragraphs, and marketing copy in seconds.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch AI Writing Tools in action:<\/p>\n\n\n<style>.kb-image74f935_9a28c2 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image74f935_9a28c2 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/ai-writing-tools-1024x955.png\" alt=\"Codedesign ai AI Writing Tools\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-select-the-writing-tool-you-need'  id=\"boomdevs_24\" class=\"wp-block-heading\">Step 1: Select the Writing Tool You Need<\/h4>\n\n\n\n<p>Go to the AI Writing Tools section from the main navigation.<\/p>\n\n\n\n<p>Choose from paragraph generator, slogan maker, or brand name creator.<\/p>\n\n\n\n<h4 id='step-2-enter-your-prompt'  id=\"boomdevs_25\" class=\"wp-block-heading\">Step 2: Enter Your Prompt<\/h4>\n\n\n\n<p>Type a short description of what you need the AI to write.<\/p>\n\n\n\n<p>Click Generate and wait a few seconds for the result.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see multiple text options to pick from.<\/p>\n\n\n\n<h4 id='step-3-copy-or-apply-to-your-website'  id=\"boomdevs_26\" class=\"wp-block-heading\">Step 3: Copy or Apply to Your Website<\/h4>\n\n\n\n<p>Click Copy to paste the text anywhere, or apply it directly to your page.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> You have fresh, AI-written copy ready for your website.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Use AI Magic to rewrite existing copy. Select any text block, click AI Magic, and pick Rewrite.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-drag-drop-website-builder'  id=\"boomdevs_27\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-drag-drop-builder\">How to Use CodeDesign AI Drag &amp; Drop Website Builder<\/h3>\n\n\n\n<p><strong>Drag &amp; Drop Website Builder<\/strong> lets you design pages by moving elements around visually.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch the Drag &amp; Drop Builder in action:<\/p>\n\n\n<style>.kb-image5405ed_3eb151 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image5405ed_3eb151 size-large\"><img decoding=\"async\" src=\"https:\/\/www.fahimai.com\/wp-content\/uploads\/2025\/02\/drag-drop-website-builder-980x454.png\" alt=\"Codedesign ai Drag &amp; Drop Website Builder\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-open-the-page-editor'  id=\"boomdevs_28\" class=\"wp-block-heading\">Step 1: Open the Page Editor<\/h4>\n\n\n\n<p>Click on any page in your project to enter the visual editor.<\/p>\n\n\n\n<p>You will see the design canvas with your current page layout.<\/p>\n\n\n\n<h4 id='step-2-add-and-move-elements'  id=\"boomdevs_29\" class=\"wp-block-heading\">Step 2: Add and Move Elements<\/h4>\n\n\n\n<p>Drag components from the left panel onto your page.<\/p>\n\n\n\n<p>Choose from 300+ design components like galleries, testimonials, and forms.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see new sections on your page that you can click to edit.<\/p>\n\n\n\n<h4 id='step-3-style-each-element'  id=\"boomdevs_30\" class=\"wp-block-heading\">Step 3: Style Each Element<\/h4>\n\n\n\n<p>Click any element to change its colors, fonts, spacing, and size.<\/p>\n\n\n\n<p>All changes show up in real time on the canvas.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> You have built a custom page layout without writing any code.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Use the AI Companion to make edits with natural language. Just type &#8220;make the header bigger&#8221; and the AI does it.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-landing-page-builder'  id=\"boomdevs_31\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-landing-page-builder\">How to Use CodeDesign AI Landing Page Builder<\/h3>\n\n\n\n<p><strong>Landing Page Builder<\/strong> lets you create single-page sites designed to capture leads or sell products.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch the Landing Page Builder in action:<\/p>\n\n\n<style>.kb-imagedd5a56_fbda9e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-imagedd5a56_fbda9e size-large\"><img decoding=\"async\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-landing-page-builder.png\" alt=\"Codedesign ai Landing Page Builder\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-pick-a-landing-page-template'  id=\"boomdevs_32\" class=\"wp-block-heading\">Step 1: Pick a Landing Page Template<\/h4>\n\n\n\n<p>Open the AI Landing Page Generator from the dashboard.<\/p>\n\n\n\n<p>Type a description like &#8220;landing page for a fitness app launch.&#8221;<\/p>\n\n\n\n<h4 id='step-2-edit-the-hero-section-and-cta'  id=\"boomdevs_33\" class=\"wp-block-heading\">Step 2: Edit the Hero Section and CTA<\/h4>\n\n\n\n<p>Change the headline, subtext, and call-to-action button text.<\/p>\n\n\n\n<p>Add your own images or let the AI find stock photos for you.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> Your landing page should have a clear headline and one main CTA button.<\/p>\n\n\n\n<h4 id='step-3-add-a-form-and-publish'  id=\"boomdevs_34\" class=\"wp-block-heading\">Step 3: Add a Form and Publish<\/h4>\n\n\n\n<p>Drag a form block onto the page and connect it to your email tool.<\/p>\n\n\n\n<p>Click Publish to make the landing page live.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> Your landing page is live and collecting leads.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Keep your landing page to one screen. Remove the navigation menu so visitors focus on your CTA.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-project-manager'  id=\"boomdevs_35\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-project-manager\">How to Use CodeDesign AI Project Manager<\/h3>\n\n\n\n<p><strong>Project Manager<\/strong> lets you organize and track multiple websites from one dashboard.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch Project Manager in action:<\/p>\n\n\n<style>.kb-imagedd41cb_bad330 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-imagedd41cb_bad330 size-large\"><img decoding=\"async\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-project-manager.png\" alt=\"Codedesign ai Project Manager\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-create-a-new-project'  id=\"boomdevs_36\" class=\"wp-block-heading\">Step 1: Create a New Project<\/h4>\n\n\n\n<p>Click New Project from your dashboard and give it a name.<\/p>\n\n\n\n<p>Add a description so your team knows what the project is for.<\/p>\n\n\n\n<h4 id='step-2-invite-team-members'  id=\"boomdevs_37\" class=\"wp-block-heading\">Step 2: Invite Team Members<\/h4>\n\n\n\n<p>Click Share and enter your team member&#8217;s email address.<\/p>\n\n\n\n<p>Set their permission level to editor or viewer.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> Your team member should get an email invite to join the project.<\/p>\n\n\n\n<h4 id='step-3-track-progress-and-updates'  id=\"boomdevs_38\" class=\"wp-block-heading\">Step 3: Track Progress and Updates<\/h4>\n\n\n\n<p>Use the project view to see all pages, their status, and recent edits.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> You can manage multiple client sites from one central place.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Create separate projects for each client. This keeps files organized and makes sharing easy.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h3 id='how-to-use-codedesign-ai-template-builder'  id=\"boomdevs_39\" class=\"wp-block-heading\" id=\"how-to-use-codedesign-ai-template-builder\">How to Use CodeDesign AI Template Builder<\/h3>\n\n\n\n<p><strong>Template Builder<\/strong> lets you create reusable designs you can apply to new projects.<\/p>\n\n\n\n<p>Here is how to use it step by step.<\/p>\n\n\n\n<p>Watch Template Builder in action:<\/p>\n\n\n<style>.kb-image6af9ba_0c3a86 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image6af9ba_0c3a86 size-large\"><img decoding=\"async\" src=\"https:\/\/fahimai.com\/wp-content\/uploads\/2025\/02\/Codedesign-template-builder.png\" alt=\"Codedesign ai Template Builder\" class=\"kb-img\" title=\"\"><\/figure>\n\n\n\n<p>Now let us break down each step.<\/p>\n\n\n\n<h4 id='step-1-start-from-scratch-or-use-a-base'  id=\"boomdevs_40\" class=\"wp-block-heading\">Step 1: Start from Scratch or Use a Base<\/h4>\n\n\n\n<p>Open the Template Builder and choose Blank or pick an existing design.<\/p>\n\n\n\n<p>Add your brand colors, fonts, and logo to the base layout.<\/p>\n\n\n\n<h4 id='step-2-build-your-template-sections'  id=\"boomdevs_41\" class=\"wp-block-heading\">Step 2: Build Your Template Sections<\/h4>\n\n\n\n<p>Add reusable sections like header, footer, hero, and contact blocks.<\/p>\n\n\n\n<p>Save each section so you can drop it into future projects.<\/p>\n\n\n\n<p>\u2713 <strong>Checkpoint:<\/strong> You should see your saved template in the Templates section of the dashboard.<\/p>\n\n\n\n<h4 id='step-3-apply-the-template-to-a-new-project'  id=\"boomdevs_42\" class=\"wp-block-heading\">Step 3: Apply the Template to a New Project<\/h4>\n\n\n\n<p>Create a new project and select your custom template as the starting point.<\/p>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Result:<\/strong> You have a reusable template that saves hours on every new project.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group tip-box is-layout-flow wp-block-group-is-layout-flow\">\n<p>\ud83d\udca1 <strong>Pro Tip:<\/strong> Build one master template with your brand style. Use it as the base for every new site.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='codedesign-ai-pro-tips-and-shortcuts'  id=\"boomdevs_43\" class=\"wp-block-heading\" id=\"codedesign-ai-pro-tips-and-shortcuts\">CodeDesign AI Pro Tips and Shortcuts<\/h2>\n\n\n\n<p>After testing CodeDesign AI for over 6 months, here are my best tips.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Keyboard Shortcuts<\/p>\n\n\n\n<figure class=\"wp-block-table fahimai-table\"><table class=\"has-fixed-layout\"><thead><tr><th>Action<\/th><th>Shortcut<\/th><\/tr><\/thead><tbody><tr><td>Undo last change<\/td><td>Ctrl + Z (Cmd + Z on <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-password-manager-for-mac\" title=\"Mac\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48178\" target=\"_blank\" rel=\"noopener\">Mac<\/a>)<\/td><\/tr><tr><td>Redo last change<\/td><td>Ctrl + Y (Cmd + Shift + Z on <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/accounting-software-for-mac\" title=\"Mac\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48191\" target=\"_blank\" rel=\"noopener\">Mac<\/a>)<\/td><\/tr><tr><td>Duplicate an element<\/td><td>Ctrl + D (Cmd + D on Mac)<\/td><\/tr><tr><td>Delete selected element<\/td><td>Delete \/ Backspace<\/td><\/tr><tr><td>Preview your site<\/td><td>Ctrl + P (Cmd + P on Mac)<\/td><\/tr><tr><td>Save your project<\/td><td>Ctrl + S (Cmd + S on Mac)<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Hidden Features Most People Miss<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>AI Vibe Coding:<\/strong> Type natural language prompts to change your site structure and design without touching any element directly.<\/li>\n\n\n\n<li><strong>AI Magic on Images:<\/strong> Select any image block, click AI Magic, and the AI will swap in a better-fitting photo based on your page content.<\/li>\n\n\n\n<li><strong>Responsive Visibility Toggle:<\/strong> Hide specific elements on mobile, tablet, or desktop by clicking any element and toggling visibility per device.<\/li>\n<\/ul>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='codedesign-ai-common-mistakes-to-avoid'  id=\"boomdevs_44\" class=\"wp-block-heading\" id=\"codedesign-ai-common-mistakes-to-avoid\">CodeDesign AI Common Mistakes to Avoid<\/h2>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Mistake #1: Using AI-Generated Text Without Editing<\/p>\n\n\n\n<div class=\"wp-block-group con-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u274c Wrong:<\/strong> Publishing AI-generated copy exactly as it comes out of the tool.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Right:<\/strong> Always edit AI text to match your brand <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/ai-voice-cloning\" title=\"voice\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48172\" target=\"_blank\" rel=\"noopener\">voice<\/a>. Add specific details about your <a class=\"wpil_keyword_link\" href=\"https:\/\/www.fahimai.com\/best-ai-tools-for-business\" title=\"business\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48174\">business<\/a>.<\/p>\n<\/div>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Mistake #2: Skipping Mobile Responsiveness Checks<\/p>\n\n\n\n<div class=\"wp-block-group con-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u274c Wrong:<\/strong> Only previewing your site on desktop before publishing.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Right:<\/strong> Always check mobile and tablet views. Use the responsive preview tool before you hit publish.<\/p>\n<\/div>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Mistake #3: Not Setting Up SEO Before Publishing<\/p>\n\n\n\n<div class=\"wp-block-group con-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u274c Wrong:<\/strong> Publishing a site with blank title tags and missing meta descriptions.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-group pro-item is-layout-flow wp-block-group-is-layout-flow\">\n<p><strong>\u2705 Right:<\/strong> Fill in every SEO field using the AI SEO tools before you publish. It takes less than 2 minutes per page.<\/p>\n<\/div>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='codedesign-ai-troubleshooting'  id=\"boomdevs_45\" class=\"wp-block-heading\" id=\"codedesign-ai-troubleshooting\">CodeDesign AI Troubleshooting<\/h2>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Problem: AI-Generated Design Looks Generic<\/p>\n\n\n\n<p><strong>Cause:<\/strong> Your prompt was too short or vague for the AI to work with.<\/p>\n\n\n\n<p><strong>Fix:<\/strong> Write a detailed prompt with your <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-crm-for-small-construction-business\" title=\"business\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48188\" target=\"_blank\" rel=\"noopener\">business<\/a> type, color preferences, and target audience. Then regenerate.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Problem: Custom Domain Not Connecting<\/p>\n\n\n\n<p><strong>Cause:<\/strong> DNS records have not updated yet or the settings are wrong.<\/p>\n\n\n\n<p><strong>Fix:<\/strong> Double-check your CNAME and A records in your domain registrar. Wait up to 48 hours for DNS to propagate.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Problem: Page Loads Slowly After Publishing<\/p>\n\n\n\n<p><strong>Cause:<\/strong> Large image files are slowing down your page speed.<\/p>\n\n\n\n<p><strong>Fix:<\/strong> Compress images before uploading or use CodeDesign built-in image tools. Aim for under 200 KB per image.<\/p>\n\n\n\n<p>\ud83d\udccc <strong>Note:<\/strong> If none of these fix your issue, contact CodeDesign AI support.<\/p>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='what-is-codedesign-ai'  id=\"boomdevs_46\" class=\"wp-block-heading\">What is CodeDesign AI?<\/h2>\n\n\n\n<p><strong>CodeDesign AI<\/strong> is an AI website builder that creates professional, responsive websites from simple text prompts.<\/p>\n\n\n\n<p>Think of it like having a web designer and developer on your team but powered by AI and ready in 60 seconds.<\/p>\n\n\n\n<p>Watch this quick overview:<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"CodeDesign.ai Review - The EASIEST Way To Build a Website With AI in 2025?\" width=\"1080\" height=\"608\" src=\"https:\/\/www.youtube.com\/embed\/JdruFdxyMb4?feature=oembed\"  allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>It includes these key features:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>AI Web Hosting:<\/strong> Publish and host your site on CodeDesign cloud in one click.<\/li>\n\n\n\n<li><strong>AI Sales and Marketing Funnel Builder:<\/strong> Build multi-step funnels that capture leads and drive sales.<\/li>\n\n\n\n<li><strong>SEO Content Tools:<\/strong> Write search-friendly titles, descriptions, and blog posts with AI.<\/li>\n\n\n\n<li><strong>Free AI Code Generator:<\/strong> Export clean HTML, CSS, JavaScript, or React code from any project.<\/li>\n\n\n\n<li><strong>AI Writing Tools:<\/strong> Generate marketing copy, slogans, and content in seconds.<\/li>\n\n\n\n<li><strong>Drag and Drop Website Builder:<\/strong> Build pages visually with 300+ design components.<\/li>\n\n\n\n<li><strong>Landing Page Builder:<\/strong> Create single-page sites focused on lead capture.<\/li>\n\n\n\n<li><strong>Project Manager:<\/strong> Organize multiple sites and collaborate with your team.<\/li>\n\n\n\n<li><strong>Template Builder:<\/strong> Create reusable custom templates for faster builds.<\/li>\n<\/ul>\n\n\n\n<p>For a full review, see our <a href=\"https:\/\/www.fahimai.com\/codedesign\">CodeDesign AI review<\/a>.<\/p>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='codedesign-ai-pricing'  id=\"boomdevs_47\" class=\"wp-block-heading\" id=\"codedesign-ai-pricing\">CodeDesign AI Pricing<\/h2>\n\n\n\n<p>Here is what CodeDesign AI costs in 2026:<\/p>\n\n\n\n<figure class=\"wp-block-table fahimai-table\"><table class=\"has-fixed-layout\"><thead><tr><th>Plan<\/th><th>Price<\/th><th>Best For<\/th><\/tr><\/thead><tbody><tr><td>Free Plan<\/td><td>$0<\/td><td>Testing the platform and building simple sites<\/td><\/tr><tr><td>Basic Plan<\/td><td>$15\/month<\/td><td>Personal projects and small websites<\/td><\/tr><tr><td>Standard Plan<\/td><td>$29\/month<\/td><td>Businesses needing more pages and AI regenerations<\/td><\/tr><tr><td>Growth Plan<\/td><td>$49\/month<\/td><td>Agencies and complex sites with code export<\/td><\/tr><tr><td>Lifetime Deals<\/td><td>Starting at $97<\/td><td>One-time payment for full access forever<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p><strong>Free trial:<\/strong> Yes. The free plan lets you build up to 3 projects with 6 AI regenerations.<\/p>\n\n\n\n<p><strong>Money-back guarantee:<\/strong> Contact support for refund requests.<\/p>\n\n\n\n<p><strong>Best Value:<\/strong> Lifetime Deal. One payment gives you all features with no monthly costs.<\/p>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='codedesign-ai-vs-alternatives'  id=\"boomdevs_48\" class=\"wp-block-heading\" id=\"codedesign-ai-vs-alternatives\">CodeDesign AI vs Alternatives<\/h2>\n\n\n\n<p>How does CodeDesign AI compare? Here is the competitive landscape:<\/p>\n\n\n\n<figure class=\"wp-block-table fahimai-table\"><table class=\"has-fixed-layout\"><thead><tr><th>Tool<\/th><th>Best For<\/th><th>Price<\/th><th>Rating<\/th><\/tr><\/thead><tbody><tr><td><strong>CodeDesign AI<\/strong><\/td><td>AI prompt-to-website building<\/td><td>$0-$49\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/gamma-ai\" title=\"Gamma\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48187\" target=\"_blank\" rel=\"noopener\">Gamma<\/a><\/td><td>AI <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-ai-presentation-maker\" title=\"presentations\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48176\" target=\"_blank\" rel=\"noopener\">presentations<\/a> and web pages<\/td><td>$0-$15\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/durable-ai\" title=\"Durable\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48184\" target=\"_blank\" rel=\"noopener\">Durable<\/a><\/td><td>Quick AI business websites<\/td><td>$12-$20\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/butternut\" title=\"Butternut\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48179\" target=\"_blank\" rel=\"noopener\">Butternut<\/a> AI<\/td><td>Fast AI-generated landing pages<\/td><td>$20-$69\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/siter\" title=\"Siter\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48186\" target=\"_blank\" rel=\"noopener\">Siter<\/a><\/td><td>Simple no-code web design<\/td><td>$0-$24\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/10web\" title=\"10Web\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48189\" target=\"_blank\" rel=\"noopener\">10Web<\/a><\/td><td>AI WordPress site building<\/td><td>$10-$23\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/pineapple-builder\" title=\"Pineapple Builder\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48192\" target=\"_blank\" rel=\"noopener\">Pineapple Builder<\/a><\/td><td>Startup landing pages<\/td><td>$0-$24\/mo<\/td><td>4.5<\/td><\/tr><tr><td><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/framer\" title=\"Framer\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48190\" target=\"_blank\" rel=\"noopener\">Framer<\/a><\/td><td>Designer-grade interactive sites<\/td><td>$10-$100\/mo<\/td><td>4.5<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">Quick picks:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Best overall:<\/strong> CodeDesign AI. Full AI website builder with hosting, funnels, and code export in one place.<\/li>\n\n\n\n<li><strong>Best budget:<\/strong> Siter. Free plan with paid options starting at $7\/month.<\/li>\n\n\n\n<li><strong>Best for beginners:<\/strong> Durable. Generates a complete business site in under 30 seconds.<\/li>\n\n\n\n<li><strong>Best for designers:<\/strong> Framer. Gives the most control over layout and animation.<\/li>\n<\/ul>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">CodeDesign AI Alternatives<\/p>\n\n\n\n<p>Looking for CodeDesign AI alternatives? Here are the top options:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Gamma:<\/strong> Best for turning ideas into polished presentations and one-page sites with AI. Free plan available.<\/li>\n\n\n\n<li><strong>Durable:<\/strong> Builds a full business website in seconds with built-in <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-crm-software-for-accountants\" title=\"CRM\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48170\" target=\"_blank\" rel=\"noopener\">CRM<\/a> and invoicing tools. Starts at $12\/month.<\/li>\n\n\n\n<li><strong>Butternut AI:<\/strong> Creates multi-page websites from a single prompt with strong visual design. Plans from $20\/month.<\/li>\n\n\n\n<li><strong>Siter:<\/strong> Lightweight no-code builder with a generous free plan and clean interface. Paid plans from $7\/month.<\/li>\n\n\n\n<li><strong>10Web:<\/strong> AI-powered WordPress builder that handles hosting, speed, and <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-password-manager\" title=\"security\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48193\" target=\"_blank\" rel=\"noopener\">security<\/a>. Plans from $10\/month.<\/li>\n\n\n\n<li><strong>Pineapple Builder:<\/strong> Perfect for startups that need a landing page fast. Free starter plan with AI design tools.<\/li>\n\n\n\n<li><strong>Framer:<\/strong> Pro-level design freedom with animations, interactions, and CMS. Plans from $10\/month.<\/li>\n\n\n\n<li><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/dorik\" title=\"Dorik\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48195\" target=\"_blank\" rel=\"noopener\">Dorik<\/a>:<\/strong> Clean, modern builder with white-label options for agencies. Personal plan starts at $10.38\/month.<\/li>\n\n\n\n<li><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/typedream\" title=\"Typedream\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48185\" target=\"_blank\" rel=\"noopener\">Typedream<\/a>:<\/strong> Simple Notion-style editor that makes building sites feel like writing a doc. Free plan included.<\/li>\n\n\n\n<li><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/jimdo\" title=\"Jimdo\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48194\" target=\"_blank\" rel=\"noopener\">Jimdo<\/a>:<\/strong> Trusted builder with AI-assisted setup and built-in e-commerce. Free plan with paid from $11\/month.<\/li>\n\n\n\n<li><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/b12-ai\" title=\"B12\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48181\" target=\"_blank\" rel=\"noopener\">B12<\/a>:<\/strong> AI builds your site and adds scheduling, invoicing, and contracts for service businesses. From $42\/month.<\/li>\n\n\n\n<li><strong><a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/appy-pie\" title=\"Appy Pie\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48183\" target=\"_blank\" rel=\"noopener\">Appy Pie<\/a>:<\/strong> No-code platform for websites and mobile apps in one place. Plans from $16\/month.<\/li>\n<\/ul>\n\n\n\n<p>For the full list, see our <a href=\"https:\/\/www.fahimai.com\/codedesign-ai-alternatives\">CodeDesign AI alternatives<\/a> guide.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:15px;font-size:25px;font-weight:600\">CodeDesign AI Compared<\/p>\n\n\n\n<p>Here is how CodeDesign AI stacks up against each competitor:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>CodeDesign AI vs Gamma:<\/strong> CodeDesign is a full website builder with hosting. Gamma focuses on presentations and simple web pages.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Durable:<\/strong> Both use AI to build sites fast. CodeDesign gives more design control while Durable adds <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-crm-for-travel-agency\" title=\"CRM\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48180\" target=\"_blank\" rel=\"noopener\">CRM<\/a> tools.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Butternut AI:<\/strong> Both create sites from prompts. CodeDesign offers code export and funnel building that Butternut lacks.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Siter:<\/strong> Siter is simpler and cheaper. CodeDesign offers more AI features and built-in marketing tools.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs 10Web:<\/strong> 10Web is WordPress-only. CodeDesign works on its own platform and also syncs to WordPress.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Pineapple Builder:<\/strong> Both target startups. CodeDesign has more features at scale while Pineapple stays lightweight.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Framer:<\/strong> Framer gives more design control for pros. CodeDesign is easier for beginners who want AI to do the work.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Dorik:<\/strong> Dorik has white-label options for agencies. CodeDesign offers stronger AI content and SEO tools.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Typedream:<\/strong> Typedream has a simpler editor. CodeDesign has more AI power and built-in funnel building.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Jimdo:<\/strong> Jimdo is better for e-commerce shops. CodeDesign is better for AI-powered site generation and marketing.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs B12:<\/strong> B12 bundles business tools like invoicing. CodeDesign focuses on fast AI design and code export.<\/li>\n\n\n\n<li><strong>CodeDesign AI vs Appy Pie:<\/strong> Appy Pie also builds mobile apps. CodeDesign is stronger at AI website design and hosting.<\/li>\n<\/ul>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='start-using-codedesign-ai-now'  id=\"boomdevs_49\" class=\"wp-block-heading\">Start Using CodeDesign AI Now<\/h2>\n\n\n\n<p>You learned how to use every major CodeDesign AI feature:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>AI Web Hosting<\/li>\n\n\n\n<li>AI Sales and Marketing Funnel Builder<\/li>\n\n\n\n<li>SEO Content Tools<\/li>\n\n\n\n<li>Free AI Code Generator<\/li>\n\n\n\n<li>AI Writing Tools<\/li>\n\n\n\n<li>Drag and Drop Website Builder<\/li>\n\n\n\n<li>Landing Page Builder<\/li>\n\n\n\n<li>Project Manager<\/li>\n\n\n\n<li>Template Builder<\/li>\n<\/ul>\n\n\n\n<p><strong>Next step:<\/strong> Pick one feature and try it now.<\/p>\n\n\n\n<p>Most people start with the AI website generator.<\/p>\n\n\n\n<p>It takes less than 60 seconds.<\/p>\n\n\n<style>.wp-block-kadence-advancedbtn.kb-btns144111_59667a-0c{padding-top:var(--global-kb-spacing-xs, 1rem);gap:var(--global-kb-gap-xs, 0.5rem );justify-content:center;align-items:center;}.kt-btns144111_59667a-0c .kt-button{font-weight:normal;font-style:normal;}.kt-btns144111_59667a-0c .kt-btn-wrap-0{margin-right:5px;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button{color:#555555;border-color:#555555;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{color:#ffffff;border-color:#444444;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button::before{display:none;}.wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:hover, .wp-block-kadence-advancedbtn.kt-btns144111_59667a-0c .kt-btn-wrap-0 .kt-button:focus{background:#444444;}<\/style>\n<div class=\"wp-block-kadence-advancedbtn kb-buttons-wrap kb-btns144111_59667a-0c\"><style>ul.menu .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{width:initial;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button{background:#ff7700;text-transform:uppercase;}.wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:hover, .wp-block-kadence-advancedbtn .kb-btn144111_2b015c-e8.kb-button:focus{color:#ffffff;background:#ff7700;}<\/style><a class=\"kb-button kt-button button kb-btn144111_2b015c-e8 kt-btn-size-xlarge kt-btn-width-type-auto kb-btn-global-inherit  kt-btn-has-text-true kt-btn-has-svg-true  wp-block-button__link wp-block-kadence-singlebtn\" href=\"https:\/\/fahimai.com\/get\/codedesign\" target=\"_blank\" rel=\"noopener\"><span class=\"kt-btn-inner-text\"><strong>Try CodeDesign For free<\/strong><\/span><span class=\"kb-svg-icon-wrap kb-svg-icon-fas_arrow-right kt-btn-icon-side-right\"><svg viewBox=\"0 0 448 512\"  fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"  aria-hidden=\"true\"><path d=\"M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z\"\/><\/svg><\/span><\/a><\/div>\n\n\n\n<h2 id='frequently-asked-questions'  id=\"boomdevs_50\" class=\"wp-block-heading\">Frequently Asked Questions<\/h2>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:10px;font-size:25px;font-weight:600\">Is CodeDesign AI free?<\/p>\n\n\n\n<p>Yes, CodeDesign AI has a free plan that lets you build up to 3 projects. You get 6 AI design regenerations and access to core features. Paid plans start at $15\/month for more pages and AI power.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:10px;font-size:25px;font-weight:600\">Who is the founder of CodeDesign AI?<\/p>\n\n\n\n<p>CodeDesign AI was founded by Sai Krishna. The company is based in Lewes, Delaware, USA. It has grown to serve over 350,000 users who have built more than 4 million sites on the platform.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:10px;font-size:25px;font-weight:600\">Can I use my own domain with CodeDesign AI?<\/p>\n\n\n\n<p>Yes, you can connect a custom domain to any CodeDesign AI project. The platform also lets you buy domains directly from the dashboard. Free plans include a CodeDesign subdomain by default.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:10px;font-size:25px;font-weight:600\">What is the best AI platform for coding websites?<\/p>\n\n\n\n<p>CodeDesign AI is one of the top picks for AI-powered website building. It generates full websites from text prompts and lets you export clean code. For pure coding, tools like GitHub Copilot handle code generation. For no-code website building, CodeDesign AI leads the pack.<\/p>\n\n\n\n<p style=\"margin-top:25px;margin-bottom:10px;font-size:25px;font-weight:600\">Are AI website builders worth it?<\/p>\n\n\n\n<p>Yes, if you need a professional website fast without hiring a developer. <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/best-ai-website-builder\" title=\"AI builders\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48169\" target=\"_blank\" rel=\"noopener\">AI builders<\/a> like CodeDesign AI can create a full site in under a minute. They work best for small businesses, <a class=\"wpil_keyword_link\" href=\"https:\/\/fahimai.com\/accounting-software-for-freelancers\" title=\"freelancers\" data-wpil-keyword-link=\"linked\" data-wpil-monitor-id=\"48175\" target=\"_blank\" rel=\"noopener\">freelancers<\/a>, and startups that need to launch quickly on a budget.<\/p>\n\n\n\n<script type=\"application\/ld+json\">\n\n{\n\n  \"@context\": \"https:\/\/schema.org\",\n\n  \"@graph\": [\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-getting-started\",\n\n      \"name\": \"How to Get Started with CodeDesign AI\",\n\n      \"description\": \"Set up your CodeDesign AI account and generate your first website\",\n\n      \"totalTime\": \"PT3M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Create Your Account\", \"text\": \"Go to codedesign.ai, click Get Started for Free, enter your email and create a password\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Generate Your First Website\", \"text\": \"Type a short description of the website you want and let the AI generate a design in 60 seconds\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Explore the Dashboard\", \"text\": \"Click through the main navigation to see your projects, templates, and settings\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-web-hosting\",\n\n      \"name\": \"How to Use CodeDesign AI Web Hosting\",\n\n      \"description\": \"Publish and host your website on CodeDesign AI cloud servers with one click\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Open Your Project Settings\", \"text\": \"Go to your project and click the Publish button in the top menu\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Connect Your Domain\", \"text\": \"Enter your custom domain name or use the free CodeDesign subdomain\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Click Publish\", \"text\": \"Hit the Publish button and your site goes live in seconds\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-sales-funnel-builder\",\n\n      \"name\": \"How to Use CodeDesign AI Sales and Marketing Funnel Builder\",\n\n      \"description\": \"Create multi-step funnels that guide visitors toward a purchase\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Choose a Funnel Template\", \"text\": \"Click Sales Funnel from the dashboard and pick a funnel type\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Customize Each Funnel Step\", \"text\": \"Edit the landing page, thank you page, and email capture form\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Connect Your Forms and Go Live\", \"text\": \"Link your email service or Zapier integration and click Publish Funnel\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-seo-content-tools\",\n\n      \"name\": \"How to Use CodeDesign AI SEO Content Tools\",\n\n      \"description\": \"Write search-friendly copy that ranks higher on Google\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Open the SEO Panel\", \"text\": \"Click on any page in your project and open the SEO settings tab\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Generate SEO Content with AI\", \"text\": \"Click Generate with AI to auto-fill your title and description\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Add Alt Text and Headings\", \"text\": \"Make sure every image has alt text and your page uses H1 and H2 tags\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-code-generator\",\n\n      \"name\": \"How to Use CodeDesign AI Free Code Generator\",\n\n      \"description\": \"Export clean HTML CSS and JavaScript from any project\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Open the Code Export Panel\", \"text\": \"Go to your project settings and click Export Code\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Preview and Download the Code\", \"text\": \"Review the generated code in the preview window and click Download\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Deploy to Your Own Host\", \"text\": \"Upload the exported files to any web hosting provider\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-writing-tools\",\n\n      \"name\": \"How to Use CodeDesign AI Writing Tools\",\n\n      \"description\": \"Generate headlines paragraphs and marketing copy in seconds\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Select the Writing Tool You Need\", \"text\": \"Go to the AI Writing Tools section and choose from paragraph generator slogan maker or brand name creator\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Enter Your Prompt\", \"text\": \"Type a short description of what you need the AI to write and click Generate\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Copy or Apply to Your Website\", \"text\": \"Click Copy to paste the text anywhere or apply it directly to your page\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-drag-drop-builder\",\n\n      \"name\": \"How to Use CodeDesign AI Drag and Drop Website Builder\",\n\n      \"description\": \"Design pages by moving elements around visually without code\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Open the Page Editor\", \"text\": \"Click on any page in your project to enter the visual editor\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Add and Move Elements\", \"text\": \"Drag components from the left panel onto your page from 300 plus design components\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Style Each Element\", \"text\": \"Click any element to change its colors fonts spacing and size\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-landing-page-builder\",\n\n      \"name\": \"How to Use CodeDesign AI Landing Page Builder\",\n\n      \"description\": \"Create single-page sites designed to capture leads or sell products\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Pick a Landing Page Template\", \"text\": \"Open the AI Landing Page Generator and type a description of what you need\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Edit the Hero Section and CTA\", \"text\": \"Change the headline subtext and call-to-action button text\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Add a Form and Publish\", \"text\": \"Drag a form block onto the page connect it to your email tool and click Publish\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-project-manager\",\n\n      \"name\": \"How to Use CodeDesign AI Project Manager\",\n\n      \"description\": \"Organize and track multiple websites from one dashboard\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Create a New Project\", \"text\": \"Click New Project from your dashboard and give it a name\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Invite Team Members\", \"text\": \"Click Share and enter your team member email address with editor or viewer permission\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Track Progress and Updates\", \"text\": \"Use the project view to see all pages their status and recent edits\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"HowTo\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#howto-template-builder\",\n\n      \"name\": \"How to Use CodeDesign AI Template Builder\",\n\n      \"description\": \"Create reusable designs you can apply to new projects\",\n\n      \"totalTime\": \"PT5M\",\n\n      \"step\": [\n\n        {\"@type\": \"HowToStep\", \"name\": \"Start from Scratch or Use a Base\", \"text\": \"Open the Template Builder and choose Blank or pick an existing design\", \"position\": 1},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Build Your Template Sections\", \"text\": \"Add reusable sections like header footer hero and contact blocks\", \"position\": 2},\n\n        {\"@type\": \"HowToStep\", \"name\": \"Apply the Template to a New Project\", \"text\": \"Create a new project and select your custom template as the starting point\", \"position\": 3}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"SoftwareApplication\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#software\",\n\n      \"name\": \"CodeDesign AI\",\n\n      \"description\": \"CodeDesign AI is an AI-powered website builder that creates professional responsive websites from simple text prompts with drag-and-drop editing cloud hosting and code export.\",\n\n      \"applicationCategory\": \"Website Builder\",\n\n      \"operatingSystem\": \"Web, iOS, Android\",\n\n      \"url\": \"https:\/\/fahimai.com\/get\/codedesign\",\n\n      \"offers\": {\n\n        \"@type\": \"AggregateOffer\",\n\n        \"priceCurrency\": \"USD\",\n\n        \"lowPrice\": \"0\",\n\n        \"highPrice\": \"49\",\n\n        \"offerCount\": \"4\",\n\n        \"offers\": [\n\n          {\"@type\": \"Offer\", \"name\": \"Free Plan\", \"price\": \"0\", \"priceCurrency\": \"USD\", \"priceValidUntil\": \"2026-12-31\", \"availability\": \"https:\/\/schema.org\/InStock\"},\n\n          {\"@type\": \"Offer\", \"name\": \"Basic Plan\", \"price\": \"15\", \"priceCurrency\": \"USD\", \"priceValidUntil\": \"2026-12-31\", \"availability\": \"https:\/\/schema.org\/InStock\"},\n\n          {\"@type\": \"Offer\", \"name\": \"Standard Plan\", \"price\": \"29\", \"priceCurrency\": \"USD\", \"priceValidUntil\": \"2026-12-31\", \"availability\": \"https:\/\/schema.org\/InStock\"},\n\n          {\"@type\": \"Offer\", \"name\": \"Growth Plan\", \"price\": \"49\", \"priceCurrency\": \"USD\", \"priceValidUntil\": \"2026-12-31\", \"availability\": \"https:\/\/schema.org\/InStock\"}\n\n        ]\n\n      },\n\n      \"aggregateRating\": {\n\n        \"@type\": \"AggregateRating\",\n\n        \"ratingValue\": \"4.5\",\n\n        \"reviewCount\": \"1\",\n\n        \"bestRating\": \"5\",\n\n        \"worstRating\": \"1\"\n\n      },\n\n      \"featureList\": \"AI Web Hosting, AI Sales and Marketing Funnel Builder, SEO Content Tools, Free AI Code Generator, AI Writing Tools, Drag and Drop Website Builder, Landing Page Builder, Project Manager, Template Builder\"\n\n    },\n\n    {\n\n      \"@type\": \"FAQPage\",\n\n      \"@id\": \"https:\/\/www.fahimai.com\/how-to-use-codedesign-ai\/#faq\",\n\n      \"mainEntity\": [\n\n        {\"@type\": \"Question\", \"name\": \"Is CodeDesign AI free?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Yes, CodeDesign AI has a free plan that lets you build up to 3 projects. You get 6 AI design regenerations and access to core features. Paid plans start at $15\/month for more pages and AI power.\"}},\n\n        {\"@type\": \"Question\", \"name\": \"Who is the founder of CodeDesign AI?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"CodeDesign AI was founded by Sai Krishna. The company is based in Lewes, Delaware, USA. It has grown to serve over 350,000 users who have built more than 4 million sites on the platform.\"}},\n\n        {\"@type\": \"Question\", \"name\": \"Can I use my own domain with CodeDesign AI?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Yes, you can connect a custom domain to any CodeDesign AI project. The platform also lets you buy domains directly from the dashboard. Free plans include a CodeDesign subdomain by default.\"}},\n\n        {\"@type\": \"Question\", \"name\": \"What is the best AI platform for coding websites?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"CodeDesign AI is one of the top picks for AI-powered website building. It generates full websites from text prompts and lets you export clean code.\"}},\n\n        {\"@type\": \"Question\", \"name\": \"Are AI website builders worth it?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Yes, if you need a professional website fast without hiring a developer. AI builders like CodeDesign AI can create a full site in under a minute. They work best for small businesses, freelancers, and startups.\"}}\n\n      ]\n\n    },\n\n    {\n\n      \"@type\": \"BreadcrumbList\",\n\n      \"itemListElement\": [\n\n        {\"@type\": \"ListItem\", \"position\": 1, \"name\": \"Home\", \"item\": \"https:\/\/fahimai.com\"},\n\n        {\"@type\": \"ListItem\", \"position\": 2, \"name\": \"Website Builder\", \"item\": \"https:\/\/www.fahimai.com\/category\/ai\/website-builder\/\"},\n\n        {\"@type\": \"ListItem\", \"position\": 3, \"name\": \"How to Use CodeDesign AI\"}\n\n      ]\n\n    }\n\n  ]\n\n}\n\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Quick Start This guide covers every CodeDesign AI feature: Time needed: 5 minutes per feature Also in this guide: Pro Tips | Common Mistakes | Troubleshooting | Pricing | Alternatives Why Trust This Guide I have used CodeDesign AI for over 6 months and tested every feature covered here. This how to use codedesign ai [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":77259,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_et_pb_use_builder":"off","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[595],"tags":[932,1182],"class_list":["post-77258","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codedesign","tag-autolink","tag-how-to"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/posts\/77258","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/comments?post=77258"}],"version-history":[{"count":0,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/posts\/77258\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/media\/77259"}],"wp:attachment":[{"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/media?parent=77258"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/categories?post=77258"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fahimai.com\/de\/wp-json\/wp\/v2\/tags?post=77258"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}