Shopify пользовательский раздел, кнопка не рендерится / ведет себя как нужно

Question

Я работаю над страницей, где мне нужно было выровнять два изображения «героев» по ​​горизонтали, а затем в центре каждого изображения должна быть размещена кнопка со ссылкой. Через разделы Cutom мне удалось создать горизонтально выровненные изображения и также включить ссылку на кнопку.

Теперь единственная проблема заключается в том, что в панели настройки мне не разрешено назначать различные атрибуты для каждой кнопки ( Мне нужна правая кнопка, чтобы указать на страницу интернет-магазина, и мне нужна левая кнопка, чтобы указать на страницу «о».) Всякий раз, когда я набираю что-то в «Текст кнопки» на панели настройки - это дублируется на другую кнопку Кроме того, то же самое относится и к «ссылке».

Также мне нужно стилизовать кнопку так, чтобы она оставалась центрированной на изображениях, независимо от того, просматривается ли она на экране телефона / планшета и т. п. c. Кто-нибудь знает, как лучше всего это сделать?

Спасибо!

{% for block in section.blocks %}
    {% case block.type %}
        {{ block.settings.content }}
    {% when 'image' %}
        <div class="row">
            <div class="column">
                <img src="{{block.settings.image | img_url: 'master' }}" />
                <hr>
            <div id="section-cta">
                <h3> {{ section.settings.text-box }} </h3>
                <a href="{{ section.settings.link }}" class="button">{{ section.settings.linktext }}</a>
            </div>
            <hr>
        </div>
    {% endcase %}
{% endfor %}
{% schema %}
{
    "name":"Two Hero Images",
    "settings":[
       {
          "id":"text-box",
          "type":"text",
          "label":"Heading",
          "default":"Title"
       },
       {
          "id":"link",
          "type":"url",
          "label":"Button link"
       },
       {
          "id":"linktext",
          "type":"text",
          "label":"Button text",
          "default":"Click Here"
       }
    ],
    "blocks":[
       {
          "type":"image",
          "name":"image block",
          "settings":[
             {
                "type":"image_picker",
                "label":"your image",
                "id":"image"
             }
          ]
       }
    ]
 }
{% endschema %}