Add an editable text area to subscription term

subscribe.html

{%- macro term_cell(np, loop, term_price) -%}
	{% if term_price.term.enabled %}
		{% set term = term_price.term %}
		{{ cell_div(np, loop.first) }}
 <div class="promo-border">
  <h2 data-barley="term.{{ term.id }}.name" data-barley-editor="simple">
   {{ term.name | safe }}
  </h2>
  <div class="product_image_container" data-barley="term.{{ term.id }}.img" data-barley-editor="image-logo">
   {{ ("images/style2/shaving-box" ~ loop.index ~ ".png") | asset_url | img_tag(css_class="product_image") }}
  </div>
  <p class="sml-promo-text sml-sub-text">
   {{ term.description | safe }}
  </p>
  <p data-barley="term_price.{{ term_price.id }}.price" data-barley-editor="simple">
   {{ term_price.price | currency }}
  </p>
  <span data-barley="term_addtl_{{ term_price.id }}" data-barley-editor="simple">
   Example text
  </span>
  {{ ship_option(product) }}
  <div class="select-button-container">
   <a class="primary-button" href="{{ product | product_subscribe_url(chosen_values, term_price.term) }}">
    Select
   </a>
  </div>
 </div>
</div>
{% endif %}
{%- endmacro -%}

Within subscribe.html look for the macro term_cell (shown above).

You can create editable text areas by adding DOM elements with data-barely and data-barely-editor tags. In the above example I've added a span after the price with the id of term_price.{{ term_price.id }}.new_stuff

It is very important that the barely ids are unique, no duplication.

I've put "Example text" in the new element. This is for two purposes.

• You'll be able to see and style it
• You'll be able to click and select it in the designer to change it