Ir al contenido principal

Biblioteca de plantillas para Landing Page

Actualizado esta semana

Elige de nuestra colección de plantillas HTML/CSS preconstruidas para crear Landing Pages de Ambassadors impresionantes y profesionales. Cada plantilla está diseñada para secciones específicas y puede personalizarse con el contenido de tu marca usando herramientas de IA.

Plantilla 1: Proceso vertical “Cómo funciona”

  • Ideal para: Explicación paso a paso con íconos visuales

  • Ejemplo: Cherry Pumpkin Ambassador Program

  • Características:

    • Diseño centrado con progresión clara de pasos

    • Espacios para íconos en cada paso

    • Flujo vertical limpio, perfecto para visualización móvil

    • Ideal para procesos de 3 a 5 pasos

Plantilla con código personalizado (HTML y CSS)

<div style="font-family: Arial, sans-serif; line-height: 1.6; margin: 0 auto; max-width: 800px; padding: 20px; color: #333; text-align: center;">
    <section style="margin-bottom: 30px;">
        <div style="font-size: 28px; font-weight: bold; margin-bottom: 20px;">
            How Does it Work?
        </div>
        <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736160312/Screenshot%202025-01-06%20at%2011.44.36.png" alt="Description of the image" style="height: 65px; border-radius: 10px;">
        <div style="margin-bottom: 30px;">
            <div style="margin-bottom: 15px;">
                <strong style="font-size: 20px;">Apply</strong>
                <p style="font-size: 16px;">
                    Simply fill out the form by clicking &#34;Register Your Interest Today&#34;. You&#39;ll provide basic details, such as your personal information and social media account.
                </p>
            </div>
            <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736160441/Screenshot%202025-01-06%20at%2011.47.12.png" style="height: 55px; border-radius: 10px;">
            <div style="margin-bottom: 15px;">
                <strong style="font-size: 20px;">Seamless Onboarding</strong>
                <p style="font-size: 16px;">
                    Once accepted, one of our teammates will reach out and guide you through the onboarding process. You&#39;ll receive a personalized discount code, a sharing link, and a creative brief to help you start promoting right away.
                </p>
            </div>
            <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736161231/Screenshot%202025-01-06%20at%2011.59.50.png" style="height: 65px; border-radius: 10px;">
            <div style="margin-bottom: 15px;">
                <strong style="font-size: 20px;">Get Free Products</strong>
                <p style="font-size: 16px;">
                  Enjoy an exclusive Cherry &amp; Pumpkin gift kit at your choice and share your Cherry &amp; Pumpkin favourites with your TikTok or Instagram community
                </p>
            </div>
            <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736161350/Screenshot%202025-01-06%20at%2012.01.19.png" style="height: 65px; border-radius: 10px;">
            <div style="margin-bottom: 15px;">
                <strong style="font-size: 20px;">Earn Money</strong>
                <p style="font-size: 16px;">
                    Earn up to 20% commission for every follower who uses your code to make a purchase.
                </p>
            </div>
        </div>
</div>

Plantilla 2: Tarjetas horizontales “Cómo funciona”

  • Ideal para: Diseño moderno basado en tarjetas que muestra múltiples pasos

  • Ejemplo: eSalon Ambassador Program

  • Características:

    • Diseño de tarjetas responsivo

    • Íconos emoji para mayor atractivo visual

    • Diseño Flexbox que se adapta al tamaño de la pantalla

    • Perfecto para 4 a 6 pasos

Plantilla con código personalizado (HTML y CSS)

<div style="text-align:center; padding:40px 20px; max-width:1100px; margin:0 auto;">
  <h2 style="font-size:28px; font-weight:bold; margin-bottom:30px; color:#333;">How It Works</h2>
  <div style="display:flex; flex-wrap:wrap; justify-content:center; gap:25px;">
    
    <div style="background:#f8f9fa; border-radius:12px; padding:20px; flex:1 1 160px; max-width:180px; box-shadow:0 3px 8px rgba(0,0,0,0.08);">
      <div style="font-size:36px; margin-bottom:10px; color:#00bcd4;">📝</div>
      <h3 style="font-size:18px; margin-bottom:8px; color:#0077b6;">Apply</h3>
      <p style="font-size:14px; color:#555; line-height:1.4;">Fill out our quick application to join the program.</p>
    </div>

    <div style="background:#f8f9fa; border-radius:12px; padding:20px; flex:1 1 160px; max-width:180px; box-shadow:0 3px 8px rgba(0,0,0,0.08);">
      <div style="font-size:36px; margin-bottom:10px; color:#00bcd4;">🤝</div>
      <h3 style="font-size:18px; margin-bottom:8px; color:#0077b6;">Get Paired</h3>
      <p style="font-size:14px; color:#555; line-height:1.4;">We’ll match you with a campaign that fits your audience.</p>
    </div>

    <div style="background:#f8f9fa; border-radius:12px; padding:20px; flex:1 1 160px; max-width:180px; box-shadow:0 3px 8px rgba(0,0,0,0.08);">
      <div style="font-size:36px; margin-bottom:10px; color:#00bcd4;">📦</div>
      <h3 style="font-size:18px; margin-bottom:8px; color:#0077b6;">Receive Product</h3>
      <p style="font-size:14px; color:#555; line-height:1.4;">We’ll ship your free product straight to your door.</p>
    </div>

    <div style="background:#f8f9fa; border-radius:12px; padding:20px; flex:1 1 160px; max-width:180px; box-shadow:0 3px 8px rgba(0,0,0,0.08);">
      <div style="font-size:36px; margin-bottom:10px; color:#00bcd4;">✍️</div>
      <h3 style="font-size:18px; margin-bottom:8px; color:#0077b6;">Submit Draft</h3>
      <p style="font-size:14px; color:#555; line-height:1.4;">Create your content and share your draft for review.</p>
    </div>

    <div style="background:#f8f9fa; border-radius:12px; padding:20px; flex:1 1 160px; max-width:180px; box-shadow:0 3px 8px rgba(0,0,0,0.08);">
      <div style="font-size:36px; margin-bottom:10px; color:#00bcd4;">💵</div>
      <h3 style="font-size:18px; margin-bottom:8px; color:#0077b6;">Get Paid</h3>
      <p style="font-size:14px; color:#555; line-height:1.4;">Once approved, publish your post and receive payment.</p>
    </div>

  </div>
</div>

Plantilla 3: Sección de FAQ expandible

  • Ideal para: FAQ completa con respuestas plegables

  • Ejemplo: eSalon FAQ Section

  • Características:

    • Preguntas expandibles estilo acordeón

    • Estilo moderno con animaciones suaves

    • Tipografía y espaciado limpio

    • Diseño responsivo para móviles

Plantilla con código personalizado (HTML y CSS)

<style>
    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      font-family: 'Helvetica Neue', sans-serif;
      background-color: #f2f2f2;
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      padding: 2rem;
      color: #333;
    }

    .faq-section {
      background: #fff;
      padding: 3rem 4rem;
      border-radius: 16px;
      box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
      max-width: 900px;
      width: 100%;
    }

   .faq-section h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  font-size: 2.8rem;
  margin-bottom: 2.5rem;
  color: #222;
}


    details {
      margin-bottom: 1.8rem;
      border-bottom: 1px solid #e0e0e0;
      padding-bottom: 1rem;
    }

    summary {
      font-size: 1.5rem;
      font-weight: 600;
      cursor: pointer;
      position: relative;
      padding-right: 2rem;
      list-style: none;
    }

    summary::marker {
      display: none;
    }

    summary::after {
      content: "➕";
      position: absolute;
      right: 0;
      font-size: 1.2rem;
      color: #999;
      transition: transform 0.3s ease;
    }

    details[open] summary::after {
      content: "➖";
      color: #333;
    }

    details p {
      font-size: 1.25rem;
      margin-top: 0.8rem;
      line-height: 1.8;
      color: #555;
      padding-right: 2rem;
    }

    @media (max-width: 768px) {
      .faq-section {
        padding: 2rem;
      }

      .faq-section h2 {
        font-size: 2.2rem;
      }

      summary {
        font-size: 1.3rem;
      }

      details p {
        font-size: 1.1rem;
      }
    }
  </style>


  <section>
  <h2>Frequently Asked Questions</h2>

    <details>
      <summary>Who should partner with Cherry &amp; Pumpkin?</summary>
      <p>If you’re passionate about fashion and lifestyle-related content—we should partner.</p>
    </details>

    <details>
      <summary>How do I start?</summary>
      <p>Apply to our program here. Applications can take 1–3 days to be processed. Once accepted into the program, you can grab trackable links that will earn you money for every use.</p>
    </details>

    <details>
      <summary>How does affiliate work?</summary>
      <p>Once you&#39;re accepted, grabbing your Cherry &amp; Pumpkin promo codes is easy. Just drop them into your content and start earning every time someone uses it when check out.</p>
    </details>

    <details>
      <summary>What kind of content can I create with Cherry &amp; Pumpkin?</summary>
      <p>Share Cherry &amp; Pumpkin in a way that fits your style, whether it’s your workflow, your tracks, or how you use it. Drop your tracking links in Tiktok videos, Instagram stories—wherever it makes sense for you.</p>
    </details>

    <details>
      <summary>How long will the approval process take?</summary>
      <p>Usually, it takes 1–3 business days. If it takes longer, don’t sweat it. We haven’t forgotten about you—we’re just manually reviewing each application.</p>
    </details>

    <details>
      <summary>Can I be a Cherry &amp; Pumpkin ambassador from outside the U.S.?</summary>
      <p>Yes, you can be a Cherry &amp; Pumpkin ambassador from anywhere.</p>
    </details>

    <details>
      <summary>How do I get paid?</summary>
      <p>Payments are processed and paid out via Upfluence Pay (Stripe) at the end of each month.</p>
    </details>
  </section>

Plantilla 4: Combinado “Cómo funciona” + FAQ

  • Ideal para: Landing page completa con secciones de proceso y FAQ

  • Ejemplo: Cherry Pumpkin Combined

  • Características:

    • Sistema de diseño unificado

    • Fondo moderno con degradado

    • Estilo coherente en todas las secciones

Plantilla con código personalizado (HTML y CSS)

<style>
    :root{
      --bg:#ffffff;
      --card:#f9f9f9;
      --muted:#6b7380;
      --text:#333333;
      --accent:#7c5cff;
      --accent-2:#00d4ff;
      --ring:rgba(124,92,255,.4);
      --radius:18px;
      --shadow:0 10px 25px rgba(0,0,0,.08), 0 2px 10px rgba(0,0,0,.05);
      --heading-color:#1F1C39;

      --faq-pad-x:22px;
      --faq-pad-y:20px;
      --faq-gap:16px;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
      color:var(--text);
      background:
        radial-gradient(1200px 600px at 10% -10%, rgba(124,92,255,.05), transparent 60%),
        radial-gradient(900px 600px at 110% 10%, rgba(0,212,255,.05), transparent 60%),
        var(--bg);
      line-height:1.6;
    }

    #uf-landing .wrap{max-width:920px;margin-inline:auto;padding:clamp(20px,4vw,56px)}

    /* FAQ */
    #uf-landing .faq-heading{
      font-size:clamp(36px,5vw,54px);
      color:var(--heading-color);
      text-align:center;
      margin:0 0 48px;
    }

    #uf-landing .faq-list{display:block}
    #uf-landing .faq-list > details + details{margin-top:var(--faq-gap)}

    #uf-landing details{
      background:var(--card);
      border:1px solid rgba(0,0,0,.05);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      overflow:hidden;
    }
    #uf-landing details[open]{border-color:rgba(124,92,255,.35);outline:2px solid var(--ring);outline-offset:0}

    #uf-landing summary{
      list-style:none; cursor:pointer;
      display:flex; align-items:center; gap:16px;
      padding:var(--faq-pad-y) var(--faq-pad-x);
      font-weight:600; letter-spacing:.2px; font-size:1.05rem;
    }
    #uf-landing summary::-webkit-details-marker{display:none}
    #uf-landing summary::after{
      content:""; width:11px; height:11px;
      border-right:2px solid var(--text); border-bottom:2px solid var(--text);
      margin-left:auto; transform:rotate(-45deg);
      transition:transform .2s ease;
    }
    #uf-landing details[open] summary::after{transform:rotate(45deg)}

    #uf-landing .answer{
      padding:12px var(--faq-pad-x) calc(var(--faq-pad-y) - 2px);
      color:var(--muted); font-size:1rem; line-height:1.75;
    }
    #uf-landing .answer > *{margin-top:0}
    #uf-landing details[open] .answer{border-top:1px solid rgba(0,0,0,.06)}
  </style>


  <div id="uf-landing">

    
    <div style="font-family: Arial, sans-serif; line-height: 1.6; margin: 0 auto; max-width: 800px; padding: 20px; color: #333; text-align: center;">
      <section style="margin-bottom: 30px;">
        <div style="font-size: 36px; font-weight: bold; margin-bottom: 20px; color: #1F1C39;">
          How Does it Work?
        </div>

        <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736160312/Screenshot%202025-01-06%20at%2011.44.36.png" alt="Apply" style="height: 65px; border-radius: 10px; display:block; margin:0 auto 12px;">
        <div style="margin-bottom: 15px;">
          <strong style="font-size: 18px; color: #1F1C39;">Apply</strong>
          <p style="font-size: 14px;">Fill out the short form with your socials and shipping info.</p>
        </div>

        <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736160441/Screenshot%202025-01-06%20at%2011.47.12.png" alt="Seamless Onboarding" style="height: 55px; border-radius: 10px; display:block; margin:0 auto 12px;">
        <div style="margin-bottom: 15px;">
          <strong style="font-size: 18px; color: #1F1C39;">Seamless Onboarding</strong>
          <p style="font-size: 14px;">We’ll email next steps and your creator brief.</p>
        </div>

        <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1736161231/Screenshot%202025-01-06%20at%2011.59.50.png" alt="Get Free Products" style="height: 65px; border-radius: 10px; display:block; margin:0 auto 12px;">
        <div style="margin-bottom: 15px;">
          <strong style="font-size: 18px; color: #1F1C39;">Get Free Products</strong>
          <p style="font-size: 14px;">Receive best-sellers from our sleep line — on us.</p>
        </div>

        <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1755697244/star_65px.png" alt="Get Featured" style="height: 65px; border-radius: 10px; display:block; margin:0 auto 12px;">
        <div style="margin-bottom: 15px;">
          <strong style="font-size: 18px; color: #1F1C39;">Get Featured</strong>
          <p style="font-size: 14px;">If you post and tag us, we may spotlight your content.</p>
        </div>
      </section>
    </div>

    
    <div>
      <h2>Frequently Asked Questions</h2>

      <div>
        <details>
          <summary>Do I need a large following to apply?</summary>
          <div>
            Not at all. We look for creators who share our passion for wellness and authentic storytelling, no matter the audience size.
          </div>
        </details>

        <details>
          <summary>Is there an age requirement?</summary>
          <div>
            Yes. You must be 18+ to apply and receive the product. By applying, you confirm you’re 18 or older.
          </div>
        </details>

        <details>
          <summary>What products will I receive?</summary>
          <div>
            You pick! Select your favorite from our best-selling vacation collection.
          </div>
        </details>

        <details>
          <summary>Can I apply again if I’m not selected the first time?</summary>
          <div>
            Yes! We review applications regularly, so you’re welcome to reapply.
          </div>
        </details>

        <details>
          <summary>Do I need to live in the U.S.?</summary>
          <div>
            At this time, our program is available to U.S.-based creators only.
          </div>
        </details>

        <details>
          <summary>What happens after I apply?</summary>
          <div>
            If selected, we’ll reach out within 1–2 weeks with next steps and shipping details for your gifting package.
          </div>
        </details>
      </div>
    </div>

  </div>

Plantilla 5: Rediseño estilo email

  • Ideal para: Diseño inspirado en email con gran atractivo visual

  • Ejemplo: Cherry Pumpkin Overhaul

  • Características:

    • Diseño basado en tablas para máxima compatibilidad

    • Esquema de colores rico con elementos de marca

    • Apariencia profesional y empresarial

Plantilla con código personalizado (HTML y CSS)

<style>
        /* Reset styles layout to use a three-column table-based design. */
        body, p {
            margin: 0;
            padding: 0;
        }
        table {
            border-spacing: 0;
            border-collapse: collapse;
            mso-table-lspace: 0pt;
            mso-table-rspace: 0pt;
        }
.ambassador .brand-image {
    height: 8px;
    width: 100%;
    border-radius: 10px;
    position: fixed;
z-index:-1;
}

.ambassador .brand-logo {
    max-width: 300px;}
  
        .ReadMsgBody { width: 100%; }
        .ExternalClass { width: 100%; }
        

.upf-btn {
    background-image: none;
    border-radius: var(--border-radius-sm);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    height: 38px;
    padding: 6px 18px;
    font-weight: 600;
    font-size: var(--font-size-lg);
    text-align: center;
    text-decoration: none !important;
    touch-action: manipulation;
    white-space: nowrap;
}
        		 li.text {
    float: left;
    width: 90%;
}

.fx-gap-px-40 {
    gap: 9px;
}
table {
    border-collapse:separate;
  
    border-radius:22px;
}

.content-section {
            padding: 0px;
            display: table;
            width: 100%;
			background-color: #D99D06;
			
        }
 
       
     </style>


    
        
        <table style="background-color:#D99D06; width:100%;">
            <tr>
                <td style="padding: 0px 75px 0px 85px ;"><br>
                   <h1 style="color: #fff; font-size: 38px; margin: 0 0 20px 0; line-height: 1.2; font-family: Arial, sans-serif; text-shadow: 2px 2px 3px #E2D6B9;"> Join the Cherry &amp; Pumpkin <br> Influencer Program</h1>
                  
                </td>
				<td style="margin: 0; border: 0; padding: 0">
                    <img src="https://uploader-upfluence-assets.s3.us-west-2.amazonaws.com/upload-api/anonymous/1756909922/1.jpeg" alt="SogoTrade Logo" style="max-width: 55%;  float:right; padding:0px 0px 20px 0px;">
                </td>
            </tr>
            
            	
			<tr>
                <td colspan="3" style="padding: 20px 20px; font-family: Arial, sans-serif; background-color: #E5C67A; border: 1px solid #c1bebe;  border-radius:22px;  box-shadow: 3px 7px #d1cfcf;">
				
		 <table>
            <tbody>
                <tr>
                    <td>		<p style="text-align:left;line-height:24px; color:#FCFAF3;font-size:17px;">
                       <b>
Are you a content creator passionate about finance, investing, or helping others grow their wealth?</b> <br><br>Partner with Cherry &amp; Pumpkin, a leading online brokerage firm, and turn your influence into opportunity.<br><br>

At Cherry &amp; Pumpkin, we empower self-directed investors with advanced trading platforms and research tools.
We’re not just another online broker; we’re a dedicated partner in financial success. <br>Our mission is simple: to put our clients first, always.
<br>
As a Cherry &amp; Pumpkin Influencer, you’ll earn rewards, access exclusive opportunities, and share a trusted platform with your audience.<br><br>

Ready to grow with us?<br>
Apply now to join theCherry &amp; Pumpkin Influencer Program. <br></p><br><br>
 
                            <p style="text-align:center;;line-height:24px; color:#FCFAF3;font-size:11px;">© 2025 Cherry &amp; Pumpkin, Inc. All rights reserved. Cherry &amp; Pumpkin®, the Cherry &amp; Pumpkin® logo, and all
                                other trademarks, whether registered or unregistered. are the property of Cherry &amp; Pumpkine,
                                Inc. and its affiliates,
                                Cherry &amp; Pumpkin, Inc. is a member of <a title="Template" target="_blank" href="http://www.upfluence.com" rel="nofollow noopener">Template</a> of <a title="Upfluence Support" target="_blank" href="http://www.upfluence.com" rel="nofollow noopener">Upfluence Support</a>.<br></p>
      </td></tr><tbody></table>  
      
		
		</td>
            </tr>

Plantilla 6: "¿Por qué unirse?” con combinación de FAQ

  • Ideal para: Landing page enfocada en beneficios con sección de FAQ

  • Ejemplo: Cherry Pumpkin Why Join FAQs

  • Características:

    • Mensajes enfocados en beneficios

    • Esquema de colores personalizado

    • Diseño orientado a la comunidad

Plantilla con código personalizado (HTML y CSS)

<style>
    body {
      margin: 0;
      font-family: 'Roboto', sans-serif;
      padding: 2rem;
      color: #333;
    }

    .swig-container {
      max-width: 800px;
      margin: 0 auto;
      background: #ffffff;
      padding: 3rem;
      border-radius: 1.5rem;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    }

    h1 {
      font-size: 2.75rem;
      color: #D99D06;
      text-align: center;
      margin-bottom: 3rem;
    }

    .benefit {
      font-size: 1.8rem;
      margin-bottom: 3rem;
      line-height: 2;
      padding-top: 1rem;
      border-bottom: 1px solid #FCF6E5;
      padding-bottom: 2rem;
    }

    .benefit strong {
      display: block;
      font-size: 2rem;
      color: #D99D06;
      margin-bottom: 0.8rem;
    }

    .faq-section {
      margin-top: 3rem;
    }

    .faq-section h2 {
      color: #D99D06;
      font-size: 2rem;
      margin-bottom: 1.5rem;
      text-align: center;
    }

    details {
      background: #FCF6E5;
      border: 2px solid #D99D06;
      border-radius: 0.8rem;
      padding: 1.2rem 1.5rem;
      margin-bottom: 1rem;
      font-size: 1.3rem;
      transition: background-color 0.3s ease;
    }

    summary {
      cursor: pointer;
      font-weight: bold;
      font-size: 1.5rem;
      color: #D99D06;
    }

    summary::-webkit-details-marker {
      display: none;
    }

    details[open] {
      background: #FCF6E5;
    }

    @media (max-width: 600px) {
      h1 {
        font-size: 2.3rem;
      }

      .benefit {
        font-size: 1.5rem;
        margin-bottom: 2rem;
      }

      .benefit strong {
        font-size: 1.7rem;
      }

      .faq-section h2 {
        font-size: 1.7rem;
      }

      summary {
        font-size: 1.3rem;
      }
    }
  </style>


  <div>
    <h1>✨ Why Join the Cherry &amp; Pumpkin? ✨</h1>

    <div>
      <strong>💸 Monthly Cherry &amp; Pumpkin Commission</strong>
      Stay sippin&#39; on us. Ambassadors get monthly commissons.
    </div>

    <div>
      <strong>🎁 Cherry &amp; Pumpkin PR Package</strong>
      You’ll be eligible for a chance to earn an exclusive Cherry &amp; Pumpkin PR box, packed with goodies you can’t buy in-store.
    </div>

    <div>
      <strong>📸 Get Featured</strong>
      Create cool content? We might just spotlight you on our socials for the whole Cherry &amp; Pumpkin fan to see.
    </div>

    <div>
      <strong>🤝 Join the Community</strong>
      Meet fellow Cherry &amp; Pumpkin, share ootd hacks, and vibe with the coolest crew around.
    </div>

    <div>
      <h2>🙋‍♀️ FAQs</h2>

      <details>
        <summary>Q: Do I need a huge following to apply?</summary>
        <p>Nope! We’re all about personality, not just popularity.</p>
      </details>

      <details>
        <summary>Q: How often do you accept new Cherry &amp; Pumpkin members?</summary>
        <p>We run the Cherry &amp; Pumpkin in 3-month waves! </p>
      </details>

      <details>
        <summary>Q: Is there an age requirement?</summary>
        <p>Yes! You must be at least 16 years old to apply.</p>
      </details>

      <details>
        <summary>Q: What kind of content should I post?</summary>
        <p>Think TikToks, IG Reels, photos and Stories! Anything that’s fun, engaging, and true to your personality.</p>
      </details>

      <details>
        <summary>Q: Can I apply again if I don&#39;t get accepted the first time?</summary>
        <p>Yes! If you don’t make it this time, you’re more than welcome to apply again in the next wave. We’re always looking for new faces to join the community!</p>
      </details>

      <details>
        <summary>Q: Can I be a Cherry &amp; Pumpkin ambassador from outside the U.S.?</summary>
        <p>Yes, you can be a Cherry &amp; Pumpkin ambassador from anywhere!</p>
      </details>

      <details>
        <summary>Q: What happens after I apply?</summary>
        <p>If selected, we’ll send an email with next steps — so keep an eye out!</p>
      </details>
    </div>

    <h2 style="text-align:center; margin-top: 2.5rem; font-size: 2rem; color: #D99D06;">
      🍒 Cherry &amp; Pumpkin is calling — are you in?
    </h2>
  </div>

Plantilla 7: Llamado a la acción con texto en la parte inferior

  • Ideal para: Sección final elegante con mensajes inspiradores

  • Ejemplo: Cherry Pumpkin CTA

  • Características:

    • Tipografía grande y elegante

    • Mensaje inspirador centrado

    • Perfecto como pie de página

    • Diseño minimalista y sofisticado

Plantilla con código personalizado (HTML y CSS)

<div style="
  font-family: &#39;Inter&#39;, sans-serif;
  font-style: italic;
  font-size: 36px;
  text-align: center;
  color: #D99D06;
  line-height: 1.5;
  max-width: 900px;
  margin: 60px auto;
  padding: 0 20px;
">
  Join the Cherry &amp; Pumpkin Ambassador Program and be part of a community that inspires your daily outfit. Get exclusive access to our new season accessories, and collaborate on exciting campaigns designed to make vacation fun and special.
</div>

Cómo usar estas plantillas

  1. Elige tu plantilla: Selecciona la plantilla que mejor se adapte a los objetivos de tu página de destino.

  2. Personaliza con IA: Usa la guía principal de personalización para adaptar el contenido de la plantilla a tu marca.

  3. Reemplaza los marcadores: Actualiza todos los textos, colores y URLs de imágenes con los recursos de tu marca.

  4. Combina plantillas: Mezcla y combina diferentes secciones para crear la página de destino perfecta.

  5. Prueba y optimiza: Previsualiza tu página y realiza los ajustes que sean necesarios.

Artículos relacionados
Cómo crear una Landing Page personalizada con ChatGPT
¿Ha quedado contestada tu pregunta?