Liquid, JavaScript, themes, sales channels
hi - what is the most efficient way to get the newsletter subscribe section on debut theme to be all on one line? I don't mean the default one in the footer, I mean the standalone default newsletter section
Solved! Go to the solution
This is an accepted solution.
Hi @danielh1 @JHKCreate, glad to help you with your question. I’m sure, my given answer will help to solve your problem as adding the given code below in the section
Go to Online Store > Actions > Edit Code > Sections > newsletter.liquid
And replace your code with this code.
<div class="newsletter-section{% if section.settings.show_background %} index-section--newsletter-background{% endif %}">
<div class="page-width text-center">
{% if section.settings.section_title != blank %}
<label for="Email" class="h2">{{ section.settings.section_title | escape }}</label>
{% endif %}
{% if section.settings.subheading != blank %}
<p>{{ section.settings.subheading | escape }}</p>
{% endif %}
{% form 'customer' %}
{{ form.errors | default_errors }}
{% if form.posted_successfully? %}
<p class="form--success">{{ 'general.newsletter_form.confirmation' | t }}</p>
{% else %}
<div class="input-group password__input-group">
<input type="hidden" name="contact[tags]" value="newsletter">
<input type="email"
name="contact[email]"
id="Email"
class="input-group__field newsletter__input"
value="{% if customer %}{{ customer.email }}{% endif %}"
placeholder="{{ 'general.newsletter_form.email_placeholder' | t }}"
autocorrect="off"
autocapitalize="off">
<span class="input-group__btn">
<button type="submit" class="btn newsletter__submit" name="commit" id="Subscribe">
<span class="newsletter__submit-text--large">{{ 'general.newsletter_form.submit' | t }}</span>
</button>
</span>
</div>
{% endif %}
{% endform %}
</div>
</div>
{% schema %}
{
"name": "Newsletter",
"class": "index-section index-section--flush",
"settings": [
{
"type": "text",
"id": "section_title",
"label": "Heading",
"default": "Subscribe to our newsletter"
},
{
"type": "text",
"id": "subheading",
"label": "Subheading",
"default": "text"
},
{
"id": "show_background",
"type": "checkbox",
"label": "Show background",
"default": true
},
{
"type": "paragraph",
"content": "Text"
}
],
"presets": [{
"name": "Newsletter",
"category": "Promotional"
}]
}
{% endschema %}
Hopefully, that solves your problem. If not, please let me know if you're seeing any other issues
Hi @danielh1
Would you mind sharing your store's URL? We'll see if there's a solution and get back to you here!
sure it's
https://cumbrianbooks.co.uk or
https://cumbrianteststore.myshopify.com/
I'm not sure which one you prefer
This is an accepted solution.
Hi @danielh1 @JHKCreate, glad to help you with your question. I’m sure, my given answer will help to solve your problem as adding the given code below in the section
Go to Online Store > Actions > Edit Code > Sections > newsletter.liquid
And replace your code with this code.
<div class="newsletter-section{% if section.settings.show_background %} index-section--newsletter-background{% endif %}">
<div class="page-width text-center">
{% if section.settings.section_title != blank %}
<label for="Email" class="h2">{{ section.settings.section_title | escape }}</label>
{% endif %}
{% if section.settings.subheading != blank %}
<p>{{ section.settings.subheading | escape }}</p>
{% endif %}
{% form 'customer' %}
{{ form.errors | default_errors }}
{% if form.posted_successfully? %}
<p class="form--success">{{ 'general.newsletter_form.confirmation' | t }}</p>
{% else %}
<div class="input-group password__input-group">
<input type="hidden" name="contact[tags]" value="newsletter">
<input type="email"
name="contact[email]"
id="Email"
class="input-group__field newsletter__input"
value="{% if customer %}{{ customer.email }}{% endif %}"
placeholder="{{ 'general.newsletter_form.email_placeholder' | t }}"
autocorrect="off"
autocapitalize="off">
<span class="input-group__btn">
<button type="submit" class="btn newsletter__submit" name="commit" id="Subscribe">
<span class="newsletter__submit-text--large">{{ 'general.newsletter_form.submit' | t }}</span>
</button>
</span>
</div>
{% endif %}
{% endform %}
</div>
</div>
{% schema %}
{
"name": "Newsletter",
"class": "index-section index-section--flush",
"settings": [
{
"type": "text",
"id": "section_title",
"label": "Heading",
"default": "Subscribe to our newsletter"
},
{
"type": "text",
"id": "subheading",
"label": "Subheading",
"default": "text"
},
{
"id": "show_background",
"type": "checkbox",
"label": "Show background",
"default": true
},
{
"type": "paragraph",
"content": "Text"
}
],
"presets": [{
"name": "Newsletter",
"category": "Promotional"
}]
}
{% endschema %}
Hopefully, that solves your problem. If not, please let me know if you're seeing any other issues
yes! thank you so much, it worked perfectly!! best, d
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024