Help with moving embed mailchimp form

Tourist
8 0 2

Hi,

 

I want to move the mailchimp embed form from above the footer to within it (and smaller in width). Below is the footer code, and where I want the embed form is to the left of everything in the footer. Will this be possible? Thank you.

 

1.jpg

 

<section class="page-footer {% if section.settings.sticky_footer %}page-footer--with-sticky-footer{% endif %}" data-section-id="{{ section.id }}" data-section-type="footer">
    
   <!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#f5f5f5; clear:left; color: #272727; font:12px Roboto, Helvetica,Arial,sans-serif;}
  
  #mc_embed_signup h2 {
    font-size: 12px;
    color: #272727;
}
  
  #mc_embed_signup .mc-field-group {
    padding: 0px 0;
}
  #mc_embed_signup  input {
    width: 100px;
}
  #mc_embed_signup .button {
    background-color: #fff;
    color: #272727;
    margin: 10px;
    border-radius: 0px;
    border-color: #272727;
    font: 14px Roboto;
}
 
/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
  
<div id="mc_embed_signup">
<form action="https://shopontheedge.us18.list-manage.com/subscribe/post?u=4bf4d4e5ec089092130172617&amp;id=0e04418..." method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate="">
    <div id="mc_embed_signup_scroll">
<h2>SUBSCRIBE TO OUR NEWSLETTER</h2>
 
<div class="mc-field-group">
 
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" placeholder="Email Address">
</div>
<div class="mc-field-group input-group">
    <strong>What would you like to hear about? </strong>
    <ul>
<li>
<input type="checkbox" value="1" name="group[3093][1]" id="mce-group[3093]-3093-0"><label for="mce-group[3093]-3093-0">Women's</label>
</li>
<li>
<input type="checkbox" value="2" name="group[3093][2]" id="mce-group[3093]-3093-1"><label for="mce-group[3093]-3093-1">Men's</label>
</li>
<li>
<input type="checkbox" value="4" name="group[3093][4]" id="mce-group[3093]-3093-2"><label for="mce-group[3093]-3093-2">Kids'</label>
</li>
  </ul>
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_4bf4d4e5ec089092130172617_0e04418bf2" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="SIGN ME UP!" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
  
  
</div>
  
 
<!--End mc_embed_signup-->
  
  
  <div class="page-footer__inner {% if section.settings.sticky_footer %}sticky-footer{% endif %}">
    <div class="container">
      <div class="page-width">
        
        {% if section.settings.show_subscribe_form %}
          <div class="subscribe-form">
            {% form 'customer' %}
              {% if form.posted_successfully? %}
                <div class="subscribe-form__response subscribe-form__response--success">
                  <h4>{{ 'layout.footer.subscribe_success' | t }}</h4>
                </div>
              {% else %}
                {% if form.errors %}
                  <div class="subscribe-form__response">
                    {% for field in form.errors %}
                    <p class="error-message">{{ field | capitalize }} - {{ form.errors.messages[field] }}</p>
                    {% endfor %}
                  </div>
                {% endif %}
                <input type="hidden" id="contact_tags" name="contact[tags]" value="prospect,newsletter"/>
                <div class="subscribe-form__inputs grid">
                  <div class="grid__item one-quarter small-down--one-whole subscribe-form__side-heading">{{ section.settings.subscribe_title }}</div>
                  <div class="grid__item two-quarters small-down--one-whole">
                    <div class="input-wrapper">
                      <label class="subscribe-form__label" for="mailinglist_email">{{ section.settings.subscribe_label }}</label>
                      <input type="email" required class="subscribe-form__email required" value="" id="mailinglist_email" name="contact[email]" />
                    </div>
                  </div>
                  <div class="grid__item one-quarter small-down--one-whole">
                    <button class="btn btn--secondary subscribe-form__submit" type="submit">{{ section.settings.subscribe_button }}</button>
                  </div>
                </div>
                {% if section.settings.subscribe_description != blank %}
                <div class="rte small-text">{{ section.settings.subscribe_description }}</div>
                {% endif %}
              {% endif %}
            {% endform %}
          </div>
        {% endif %}
 
        <nav class="footer-navigation {% if section.settings.show_social_icons == true %}grid{% endif %}">
          {%- assign footer_linklist = section.settings.footer_linklist -%}
          {% if linklists[footer_linklist].links.size > 0 %}
            <div class="{% if section.settings.show_social_icons %}grid__item three-quarters small-down--one-whole{% endif %}">
              {%- assign has_dropdowns = false -%}
              {%- for link in linklists[footer_linklist].links -%}
                {%- if link.links != empty -%}
                  {%- assign has_dropdowns = true -%}
                {%- endif -%}
              {%- endfor -%}
              <ul class="nav footer-nav footer-nav--{% if has_dropdowns %}dropdowns grid{% else %}inline{% endif %}">
                {% for link in linklists[footer_linklist].links %}
                  {%- assign child_list_handle = link.title | handleize -%}
                  {% if menus[child_list_handle].links != blank %}
                    <li class="nav__item footer-nav__item footer-nav--has-submenu {% if link.active %}footer-nav--active{% endif %} grid__item small-down--one-whole {% if section.settings.show_social_icons == true %} one-third{% else %} one-quarter{% endif %}">
                      <a href="{{ link.url }}" class="nav__link footer-nav__link footer-nav__link--top">
                        {{ link.title }}
                      </a>
                      <ul class="footer-nav__submenu">
                        {% for childlink in menus[child_list_handle].links %}
                          <li {% if childlink.active %}class="footer-nav--active"{% endif %}>
                            <a href="{{ childlink.url }}" class=" nav__link footer-nav__link footer-nav__link--sub">{{ childlink.title | escape }}</a>
                          </li>
                        {% endfor %}
                      </ul>
                    </li>
                  {% else %}
                    <li class="nav__item footer-nav__item {% if link.active %}footer-nav--active{% endif %} {% if has_dropdowns %}grid__item small-down--one-whole {% if section.settings.show_social_icons == true %} one-third{% else %} one-quarter{% endif %}{% endif %}">
                      <a href="{{ link.url }}" class="nav__link footer-nav__link footer-nav__link--top">{{ link.title }}</a>
                    </li>
                  {% endif %}
                {% endfor %}
              </ul>
            </div>
 
            {% if section.settings.show_social_icons %}
              <div class="footer-social-icons grid__item small-down--one-whole one-quarter">
                <p class="footer-social-icons__title">{{ 'layout.footer.social_title' | t }}</p>
                {% include 'social-icons' %}
              </div>
            {% endif %}
          {% endif %}
        </nav>
 
 
        <footer>
          
          
          <div>
            {%- assign small_linklist = section.settings.small_linklist -%}
            {% if linklists[small_linklist].links.size > 0 %}
              <ul class="small-nav">
                {% for link in linklists[small_linklist].links %}
                  <li class="small-nav__item">
                    <a class="small-nav__link" href="{{ link.url }}">{{ link.title }}</a>
                  </li>
                {% endfor %}
              </ul>
            {% endif %}
 
            <small class="copyright-text">
 
              {{ 'layout.footer.copyright' | t }} &copy; {{ 'now' | date: "%Y" }} {{ shop.name | link_to: '/' }}.
 
              {{ 'layout.footer.theme_by_html' | t }}
 
           
 
            </small>
          </div>
          {% if section.settings.show_payment_icons %}
            {% unless shop.enabled_payment_types == empty %}
              <span class="visually-hidden">{{ 'layout.footer.payment_methods' | t }}</span>
              <ul class="payment-icons">
                {% for type in shop.enabled_payment_types %}
                  <li class="payment-icon">
                    {{ type | payment_type_svg_tag: class: 'payment-icon-svg' }}
                  </li>
                {% endfor %}
              </ul>
            {% endunless %}
          {% endif %}
        </footer>
      </div>
    </div>
  </div>
</section>
 
{% schema %}
  {
    "name": "Footer",
    "settings": [
      {
        "type": "link_list",
        "id": "footer_linklist",
        "label": "Primary menu",
        "default": "footer",
        "info": "This menu shows dropdown items in columns"
      },
      {
        "type": "link_list",
        "id": "small_linklist",
        "label": "Secondary menu",
        "info": "This menu won't show dropdown items"
      },
      {
        "type": "checkbox",
        "id": "show_social_icons",
        "label": "Show social media icons",
        "default": true
      },
      {
        "type": "checkbox",
        "id": "show_payment_icons",
        "label": "Show payment icons",
        "default": true
      },
      {
        "type": "checkbox",
        "id": "sticky_footer",
        "label": "Enable scroll-reveal effect",
        "default": false,
        "info": "Only shown on desktop screens"
      },
      {
        "type": "header",
        "content": "Newsletter"
      },
      {
        "type": "checkbox",
        "id": "show_subscribe_form",
        "label": "Show newsletter signup",
        "default": true
      },
      {
        "type": "text",
        "id": "subscribe_title",
        "label": "Heading",
        "default": "Get updates"
      },
      {
        "type": "text",
        "id": "subscribe_label",
        "label": "Label",
        "default": "Email address"
      },
      {
        "type": "text",
        "id": "subscribe_button",
        "label": "Submit button text",
        "default": "Sign up"
      },
      {
        "type": "richtext",
        "id": "subscribe_description",
        "label": "Subheading"
      }
    ]
  }
 
{% endschema %}
0 Likes
Highlighted
Trailblazer
233 27 29

if you can add me to your shopify then I can do it

you are welcome to contact / donate small amount to me.
My email - suyash.patankar@gmail.com

paypal.me/suyashpatankar
0 Likes