SIA Web Design Library

Signup or follow: Light background

No notes defined.

<div class='r-signup-or-follow'>
    <section class='c-cta c-cta--blend-in 
            c-cta--newsletter
    '>
        <div class='c-cta__content-wrapper'>

            <h1 class='c-heading c-heading--blocky c-cta__heading'>
                Signup for Spark
            </h1>

            <p>The only newsletter that truly captures the energy and excitement of social entrepreneurs around the world.</p>

            <div class='c-newsletter-form c-newsletter-form--blend-in'>
                <form method="post" action="https://socialimpactaward.us16.list-manage.com/subscribe/post?u=76d31e6c87e88b1483ae9284d&amp;id=1d299537c9&amp;SIGNUP=Int-Website-Footer">
                    <div class='form-row'>
                        <div class='form-group'>
                            <label for='EMAIL'>
                                <span class='form-field__label'>Email</span>
                                <input type='text' id='EMAIL' name='EMAIL' class='form-input form-input--email' type='email' placeholder='e.g. you@example.com' required='required' />
                            </label>
                            <input type='submit' name='subscribe' value='Subscribe' />
                        </div>
                    </div>
                    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input tabindex="-1" name="b_76d31e6c87e88b1483ae9284d_1d299537c9" type="text" value=""></div>
                </form>
            </div>
        </div>
    </section>
    <section class='c-cta c-cta--blend-in 
            c-cta--sharing
    '>
        <div class='c-cta__content-wrapper'>

            <div class='c-social-links c-social-links--blend-in'>
                <ul class='c-social-links__items u-list--unstyled u-list--inline'>
                    <li class='c-social-links__items__item'>
                        <a class='c-link c-link--with-icon c-link--icon-only c-link--tiktok c-social-links__link ' href="https://www.tiktok.com/@sia_global" itemprop="item" itemid="https://www.tiktok.com/@sia_global" title="tiktok"><span itemprop="name">Tiktok</span></a>
                    </li>
                    <li class='c-social-links__items__item'>
                        <a class='c-link c-link--with-icon c-link--icon-only c-link--facebook c-social-links__link ' href="https://www.facebook.com/socialimpactaward" itemprop="item" itemid="https://www.facebook.com/socialimpactaward" title="Share on Facebook"><span itemprop="name">Facebook</span></a>
                    </li>
                    <li class='c-social-links__items__item'>
                        <a class='c-link c-link--with-icon c-link--icon-only c-link--instagram c-social-links__link ' href="#" itemprop="item" itemid="#"><span itemprop="name">Instagram</span></a>
                    </li>
                    <li class='c-social-links__items__item'>
                        <a class='c-link c-link--with-icon c-link--icon-only c-link--linkedin c-social-links__link ' href="https://www.linkedin.com/company/socialimpactaward/" itemprop="item" itemid="https://www.linkedin.com/company/socialimpactaward/"><span itemprop="name">Linkedin</span></a>
                    </li>
                    <li class='c-social-links__items__item'>
                        <a class='c-link c-link--with-icon c-link--icon-only c-link--twitter c-social-links__link ' href="http://twitter.com/SIAtweets" itemprop="item" itemid="http://twitter.com/SIAtweets"><span itemprop="name">Twitter</span></a>
                    </li>
                </ul>
            </div>
        </div>
    </section>
</div>
 
<div class='{{ get_component_class( 'signup-or-follow', display, 'r' ) }}' {% if dir %} dir='{{ dir }}' {% endif %}>
    {% if signup %}
        {% include get_template( 'cta', 'unit' ) with signup|merge( { display: { modifiers: [ 'blend-in' ] } } ) %}
    {% endif %}
    {% if follow %}
        {% include get_template( 'cta', 'unit' ) with follow|merge( { display: { modifiers: [ 'blend-in' ] } } ) %}
    {% endif %}
</div>
 
{
  "follow": {
    "type": "sharing",
    "socialLinks": {
      "items": {
        "tiktok": {
          "title": "tiktok",
          "text": "Tiktok",
          "href": "https://www.tiktok.com/@sia_global"
        },
        "facebook": {
          "title": "Share on Facebook",
          "text": "Facebook",
          "href": "https://www.facebook.com/socialimpactaward"
        },
        "instagram": {
          "text": "Instagram",
          "href": "#"
        },
        "linkedin": {
          "text": "Linkedin",
          "href": "https://www.linkedin.com/company/socialimpactaward/"
        },
        "twitter": {
          "text": "Twitter",
          "href": "http://twitter.com/SIAtweets"
        }
      }
    }
  },
  "signup": {
    "type": "newsletter",
    "heading": {
      "text": "Signup for Spark"
    },
    "text": "The only newsletter that truly captures the energy and excitement of social entrepreneurs around the world.",
    "formTemplate": "newsletter-form",
    "action": "https://socialimpactaward.us16.list-manage.com/subscribe/post?u=76d31e6c87e88b1483ae9284d&amp;id=1d299537c9&amp;SIGNUP=Int-Website-Footer",
    "policyLink": {
      "text": "privacy policy page",
      "href": "https://socialimpactaward.net/privacy-policy/"
    }
  }
}