add customer email preferences to bottom of emails

add customer email preferences to bottom of emails

alanrichardtex
Excursionist
44 3 2

Hi, i created a code for my customer registration page that adds selection for customers to choose which type of emails they want. I am trying to figure out how to also add that code to the emails i send out. i am using shopify emails, so it gives the option to add "custom liquid". Can someone please help me adjust the code with the portion needed to make it work on the emails?

this is the current code i use for the customer registration, and the selections are toward the bottom. and below that is am image of how the options show on the registration. i want those same options to show at the bottom of my email by using the custom liquid option. 

Thank you

 

 

{%- liquid
  assign NS = 'customer-form'
  assign cn = '#' | append: NS  
-%}

{% render 'load-css', file: NS %}

<div class="{{ cn }}">
  <h1 class="{{ cn }}-heading heading-font">
    {{ 'customer.register.title' | t }}
  </h1>
  {%- form 'create_customer', novalidate: 'novalidate' -%}
    {%- if form.errors -%}
      <div class="{{ cn }}-alert">
        {%- assign alert_heading = 'templates.contact.form.error_heading' | t -%}
        {%- capture Alert_text -%}
          <ul>
            {%- for field in form.errors -%}
              <li>
                {%- if field == 'form' -%}
                  {{ form.errors.messages[field] }}
                {%- else -%}
                  <a href="#RegisterForm-{{ field }}">
                    {{ form.errors.translated_fields[field] | capitalize }}
                    {{ form.errors.messages[field] }}
                  </a>
                {%- endif -%}
              </li>
            {%- endfor -%}
          </ul>
        {%- endcapture -%}
        {% render 'alert',
          type: 'danger',
          heading: alert_heading,
          text: Alert_text
        %}
      </div>
    {%- endif -%}
    <div class="{{ cn }}-field">
      <input
        class="{{ cn }}-input"
        type="text"
        name="customer[first_name]"
        id="RegisterForm-FirstName"
        {% if form.first_name %}value="{{ form.first_name }}"{% endif %}
        autocomplete="given-name"
        placeholder="{{ 'customer.register.first_name' | t }}"
      >
    </div>
    <div class="{{ cn }}-field">
      <input
        class="{{ cn }}-input"
        type="text"
        name="customer[last_name]"
        id="RegisterForm-LastName"
        {% if form.last_name %}value="{{ form.last_name }}"{% endif %}
        autocomplete="family-name"
        placeholder="{{ 'customer.register.last_name' | t }}"
      >
    </div>
    <div class="{{ cn }}-field">
      <input
        class="{{ cn }}-input"
        type="email"
        name="customer[email]"
        id="RegisterForm-email"
        {% if form.email %} value="{{ form.email }}"{% endif %}
        spellcheck="false"
        autocapitalize="off"
        autocomplete="email"
        aria-required="true"
        {% if form.errors contains 'email' %}
          aria-invalid="true"
          aria-describedby="RegisterForm-email-error"
        {% endif %}
        placeholder="{{ 'customer.register.email' | t }}"
      >
    </div>
    <div class="{{ cn }}-field">
      <input
        class="{{ cn }}-input"
        type="password"
        name="customer[password]"
        id="RegisterForm-password"
        aria-required="true"
        {% if form.errors contains 'password' %}
          aria-invalid="true"
          aria-describedby="RegisterForm-password-error"
        {% endif %}
        placeholder="{{ 'customer.register.password' | t }}"
      >
    </div>

 <!-- Email Signup Options with Dynamic Subscription -->
<label>
  <input type="radio" name="customer[tags]" value="all emails" checked>
  Sign me up for all emails
</label><br>

<label>
  <input type="radio" name="customer[tags]" value="upholstery emails">
  Sign me up for upholstery emails only
</label><br>

<label>
  <input type="radio" name="customer[tags]" value="window treatment emails">
  Sign me up for window treatment emails only
</label><br>

<label>
  <input type="radio" name="customer[tags]" value="unsubscribed">
  No, don't sign me up. I don't want extra discounts
</label><br>

<!-- Hidden field for accepts marketing -->
<input type="hidden" name="customer[accepts_marketing]" id="accepts-marketing" value="true">

<!-- Script to update accepts_marketing based on selected option -->
<script>
  document.querySelectorAll('input[name="customer[tags]"]').forEach((radio) => {
    radio.addEventListener('change', () => {
      if (radio.value === 'unsubscribed') {
        document.getElementById('accepts-marketing').value = 'false';
      } else {
        document.getElementById('accepts-marketing').value = 'true';
      }
    });
  });
</script>


    <div class="{{ cn }}-footer">
      {% render 'button',
        t_text: 'customer.register.submit',
        shadow: true,
        block: true,
        size: 'h4'
      %}
      <a class="{{ cn }}-switch-form" href="{{ routes.account_login_url }}">
        {{ 'customer.login_page.sign_in' | t }}
      </a>
    </div>
  {%- endform -%}
</div>

{% schema %}
{
  "name": "Register"
}
{% endschema %}

 

 

Screenshot 2024-06-17 at 9.00.49 AM.png

Replies 0 (0)