Add Conversio newsletter form as a section [Shopify]

conversio-newsletter.liquid

{% comment %}
** Conversio Newsletter - homepage partial **
- Draggable section
{% endcomment %}

{% assign image = section.settings.image %}
{% assign newsletter_section_text_align = section.settings.newsletter_section_text_align %}


<style>
  
  .rf-subscription-form-container{
    float:none !important;
  }

  .rf-form{
    float:none !important;
  }


  .rf-form button{
    float:none !important;
    padding:10px;
  }

  .newsletter_section{

    width: 100%;
    padding: 20px;
    box-sizing: border-box;

  }


  .newsletter_section .container
  {
    max-width:1180px;
    display:block;
    margin:0 auto;
  }
  
  .conversio-container.center{
  	text-align:center;
  }
  
   .conversio-container.right{
  	text-align:right;
  }



  .newsletter_section .container .rf-header h4 {
    padding: 0;
    margin: 0;
    font-size: 40px;
    color: #FFF;
    font-weight: 400;
  }

  .rf-preamble p {
    margin: 0 0 0 0;
    font-size: 1em;
    color: #FFF;
  }

  input.rf-input {
    margin-bottom: 10px;
  }
  
  .rf-form button{
  	background:#4a4545 !important;
  }

  .rf-subscribed {
    color: #FFF;
    font-weight: bold;
  }



</style>

<div class="newsletter_section" {% if image != nil %}style="background-image: url(https:{{ image | img_url: '1600x'}})"{% endif %}>


  <div class="container">
    <div class="conversio-container {% if newsletter_section_text_align == "center" %}center{% elsif newsletter_section_text_align == "right" %} right{% endif %}">

      {% include 'conversiowidget' with 'Website-Sign-ups-0' %}

    </div> <!-- end conversio-container -->
  </div><!-- end container -->

</div> <!-- end newsletter_section -->
 

{% schema %}

{
  "name": "Conversio Newsletter",
  "class": "newsletter-section",
  "settings": [
    {
      "type": "select",
      "id": "newsletter_section_text_align",
      "label": "Text alignment",
      "options": [
         {
          "value": "left",
          "label": "Left"
        },
        {
          "value": "center",
          "label": "Center"
        },
        {
          "value": "right",
          "label": "Right"
        }
     ],
      "default": "center"
    },
    {
      "type": "image_picker",
      "id": "image",
      "label": "Upload banner background image",
      "info":"1600 x 300px recommended"
    }
  ],
  "presets": [{
    "name": "Conversio Newsletter",
    "category": "Promotional",
    "settings": {
    }
  }]
}

{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}