Call to Action

Last updated: Feb 21, 2019

Call-to-action buttons allow merchants to drive visitor engagement to specific products, or carry out a specific activity, such as creating an account or accessing content. This section will allow merchants to optionally add a call-to-action (CTA) button to the homepage using the theme editor.

Create a new file within the sections folder of your theme, and paste the code below into this file. Save file as call-to-action.liquid.
Navigate to the Theme Editor and select "Add section". Within the Promotional category there will be an option for "Call to Action". A heading, link, and link text can be assigned in this section.

<div>
  <h2>{{ section.settings.text-box }}</h2>

  <a href="{{ section.settings.link }}">
    {{ section.settings.linktext }}
  </a>
</div>

{% schema %}
{
  "name": "Call to action",
  "settings": [
    {
      "id": "text-box",
      "type": "text",
      "label": "Heading",
      "default": "Title"
    },
    {
      "id": "link",
      "type": "url",
      "label": "Link URL"
    },
    {
      "id": "linktext",
      "type": "text",
      "label": "Link text",
      "default": "Click here"
    }
  ]
  ,
  "presets": [
    {
      "name": "Call to Action",
      "category": "Promotional"
    }
  ]
}
{% endschema %}

Please note: We have intentionally limited CSS and JavaScript, and removed translation strings in order to keep these examples compatible with any theme. Any CSS we have included is for accessibility or rendering purposes.