Shopify themes, liquid, logos, and UX
Hello
I am wanting to move the payment details to a new line in the middle of the footer. I am not sure how to edit this with codes if you could help me out I would greatly appreciate it!
My store url is https://www.nextlevelsupps.com.au
Thank you
Solved! Go to the solution
This is an accepted solution.
Hi @jakelemon
have to modify the sections/footer.liquid file
move this block of code to element below
Here is the new code:
<footer class="site-footer small--text-center" role="contentinfo" data-section-id="{{ section.id }}" data-section-type="footer-section">
<div class="wrapper">
<div class="grid-uniform">
{% comment %}
Default to 1 footer column (copyright/powered_by/payment_types)
{% endcomment %}
{% assign num_footer_columns = 1 %}
{% comment %}
Create an extra menu column if link list has more than 5 links
{% endcomment %}
{% if linklists[section.settings.footer_link_list].links.size > 0 %}
{% comment %}
We have a Footer menu that isn't empty, we will need another column
{% endcomment %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% assign extra_footer_linklist_column = false %}
{% assign footer_linklist_count = linklists[section.settings.footer_link_list].links.size %}
{% if footer_linklist_count > 5 %}
{% assign extra_footer_linklist_column = true %}
{% comment %}
We split the links so we'll need another column
{% endcomment %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% endif %}
{% comment %}
If we have an odd amount of links, we need to show 1 more link in 1st column
{% endcomment %}
{% assign extra_link = footer_linklist_count | modulo: 2 %}
{% comment %}
We start with a 2nd column after first column is filled up.
{% endcomment %}
{% assign footer_linklist_split = footer_linklist_count | divided_by: 2 | plus: extra_link | plus: 1 %}
{% endif %}
{% comment %}
Determine whether there are social links
{% endcomment %}
{% assign footer_social_enable = false %}
{% if
settings.social_twitter_link != blank
or settings.social_facebook_link != blank
or settings.social_pinterest_link != blank
or settings.social_google_plus_link != blank
or settings.social_instagram_link != blank
or settings.social_tumblr_link != blank
or settings.social_youtube_link != blank
or settings.social_vimeo_link != blank
or settings.social_fancy_link != blank
or settings.social_snapchat_link != blank
%}
{% assign footer_social_enable = true %}
{% endif %}
{% comment %}
Determine whether to show selectors
{% endcomment %}
{%- assign show_country_selector = section.settings.show_currency_selector -%}
{%- assign country_selector = false -%}
{%- if show_country_selector and localization.available_countries.size > 1 -%}
{%- assign country_selector = true -%}
{%- endif -%}
{%- assign locale_selector = false -%}
{%- if section.settings.show_locale_selector and localization.available_languages.size > 1 -%}
{%- assign locale_selector = true -%}
{%- endif -%}
{% comment %}
Calculate the number of footer columns shown. Default to 1.
{% endcomment %}
{% if footer_social_enable %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% endif %}
{% case num_footer_columns %}
{% when 0 %}
{% when 1 %}
{% assign footer_column_width = '' %}
{% when 2 %}
{% assign footer_column_width = 'one-half small--one-whole' %}
{% when 3 %}
{% assign footer_column_width = 'one-third small--one-whole' %}
{% when 4 %}
{% assign footer_column_width = 'large--one-quarter medium--one-half' %}
{% endcase %}
{% if linklists[section.settings.footer_link_list].links.size > 0 %}
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets site-footer__linklist">
{% for link in linklists[section.settings.footer_link_list].links %}
{% comment %}
Create a second column
{% endcomment %}
{% if extra_footer_linklist_column and forloop.index == footer_linklist_split %}
</ul>
</div>
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets site-footer__linklist">
{% endif %}
<li><a href="{{ link.url }}">{{ link.title }}</a></li>
{% endfor %}
</ul>
</div>
{% endif %}
{% if footer_social_enable %}
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets social-icons">
{% if settings.social_facebook_link != blank %}
<li>
<a href="{{ settings.social_facebook_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Facebook' }}">
<span class="icon icon-facebook" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_twitter_link != blank %}
<li>
<a href="{{ settings.social_twitter_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Twitter' }}">
<span class="icon icon-twitter" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_pinterest_link != blank %}
<li>
<a href="{{ settings.social_pinterest_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Pinterest' }}">
<span class="icon icon-pinterest" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_instagram_link != blank %}
<li>
<a href="{{ settings.social_instagram_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Instagram' }}">
<span class="icon icon-instagram" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_snapchat_link != blank %}
<li>
<a href="{{ settings.social_snapchat_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Snapchat' }}">
<span class="icon icon-snapchat" aria-hidden="true"></span>
Snapchat
</a>
</li>
{% endif %}
{% if settings.social_google_plus_link != blank %}
<li>
<a href="{{ settings.social_google_plus_link | escape }}" rel="publisher" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Google Plus' }}">
<span class="icon icon-google_plus" aria-hidden="true"></span>
Google Plus
</a>
</li>
{% endif %}
{% if settings.social_tumblr_link != blank %}
<li>
<a href="{{ settings.social_tumblr_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Tumblr' }}">
<span class="icon icon-tumblr" aria-hidden="true"></span>
Tumblr
</a>
</li>
{% endif %}
{% if settings.social_youtube_link != blank %}
<li>
<a href="{{ settings.social_youtube_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'YouTube' }}">
<span class="icon icon-youtube" aria-hidden="true"></span>
YouTube
</a>
</li>
{% endif %}
{% if settings.social_vimeo_link != blank %}
<li>
<a href="{{ settings.social_vimeo_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Vimeo' }}">
<span class="icon icon-vimeo" aria-hidden="true"></span>
Vimeo
</a>
</li>
{% endif %}
{% if settings.social_fancy_link != blank %}
<li>
<a href="{{ settings.social_fancy_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Fancy' }}">
<span class="icon icon-fancy" aria-hidden="true"></span>
Fancy
</a>
</li>
{% endif %}
</ul>
</div>
{% endif %}
{%- liquid
assign selectors_form_class = "selectors-form"
if num_footer_columns == 1
assign selectors_form_class = "selectors-form selectors-form--single-column"
endif
-%}
<div class="grid__item {{ footer_column_width }} {% if num_footer_columns == 1 %}text-center{% else %}large--text-right{% endif %}">
{%- form 'localization', class: selectors_form_class -%}
{%- if country_selector -%}
<div class="selectors-form__item">
<h2 class="visually-hidden" id="country-heading">
{{ 'general.country.dropdown_label' | t }}
</h2>
{%- assign current_currency_symbol = localization.country.currency.symbol -%}
{%- assign current_currency_iso_code = localization.country.currency.iso_code -%}
<div class="disclosure" data-disclosure-country>
<button type="button" class="disclosure__toggle" aria-expanded="false" aria-controls="country-list" aria-describedby="country-heading" data-disclosure-toggle>
{%- if current_currency_symbol -%}
{{ localization.country.name }} ({{ current_currency_iso_code }} {{ current_currency_symbol }})
{%- else -%}
{{ localization.country.name }} ({{ current_currency_iso_code }})
{%- endif -%}
</button>
<ul id="country-list" class="disclosure-list" data-disclosure-list>
{% for country in localization.available_countries %}
{%- assign currency_symbol = country.currency.symbol -%}
{%- assign currency_iso_code = country.currency.iso_code -%}
<li class="disclosure-list__item {% if country.iso_code == localization.country.iso_code %}disclosure-list__item--current{% endif %}">
<a class="disclosure-list__option" href="#" {% if country.iso_code == localization.country.iso_code %}aria-current="true"{% endif %} data-value="{{ country.iso_code }}" data-disclosure-option>
{%- if currency_symbol -%}
{{ country.name }} ({{ currency_iso_code }} {{ currency_symbol }})
{%- else -%}
{{ country.name }} ({{ currency_iso_code }})
{%- endif -%}
</a>
</li>
{%- endfor -%}
</ul>
<input type="hidden" name="country_code" id="CountrySelector" value="{{ localization.country.iso_code }}" data-disclosure-input/>
</div>
</div>
{%- endif -%}
{%- if locale_selector -%}
<div class="selectors-form__item">
<h2 class="visually-hidden" id="lang-heading">
{{ 'general.language.dropdown_label' | t }}
</h2>
<div class="disclosure" data-disclosure-locale>
<button type="button" class="disclosure__toggle" aria-expanded="false" aria-controls="lang-list" aria-describedby="lang-heading" data-disclosure-toggle>
{{ localization.language.endonym_name }}
</button>
<ul id="lang-list" class="disclosure-list" data-disclosure-list>
{%- for language in localization.available_languages -%}
<li class="disclosure-list__item {% if language.iso_code == localization.language.iso_code %}disclosure-list__item--current{% endif %}">
<a class="disclosure-list__option" href="#" lang="{{ language.iso_code }}" {% if language.iso_code == localization.language.iso_code %}aria-current="true"{% endif %} data-value="{{ language.iso_code }}" data-disclosure-option>
{{ language.endonym_name }}
</a>
</li>
{%- endfor -%}
</ul>
<input type="hidden" name="locale_code" id="LocaleSelector" value="{{ localization.language.iso_code }}" data-disclosure-input/>
</div>
</div>
{%- endif -%}
{%- endform -%}
</div>
</div>
<div class="grid-uniform">
<div class="grid__item one-whole text-center">
<p class="site-footer__copyright-content">© {{ 'now' | date: '%Y' }}, {{ shop.name | link_to: routes.root_url }}<br>{{ powered_by_link }}</p>
{%- if section.settings.show_payment_icons -%}
{%- unless shop.enabled_payment_types == empty -%}
<span class="visually-hidden">{{ 'general.payment.method' | t }}</span>
<ul class="inline-list payment-icons site-footer__payment-icons">
{%- for type in shop.enabled_payment_types -%}
<li>
{{ type | payment_type_svg_tag: class: 'icon' }}
</li>
{%- endfor -%}
</ul>
{%- endunless -%}
{%- endif -%}
</div>
</div>
</div>
</footer>
{% schema %}
{
"name": {
"cs": "Zápatí",
"da": "Sidefod",
"de": "Fußzeile",
"en": "Footer",
"es": "Pie de página",
"fi": "Alatunniste",
"fr": "Pied de page",
"it": "Footer",
"ja": "フッター",
"ko": "바닥글",
"nb": "Footer",
"nl": "Voettekst",
"pl": "Stopka",
"pt-BR": "Rodapé",
"pt-PT": "Rodapé",
"sv": "Sidfot",
"th": "ส่วนท้าย",
"tr": "Altbilgi",
"vi": "Chân trang",
"zh-CN": "页脚",
"zh-TW": "頁尾"
},
"settings": [
{
"type": "header",
"content": {
"cs": "Platební metody",
"da": "Betalingsmetoder",
"de": "Zahlungsmethoden",
"en": "Payment methods",
"es": "Métodos de pago",
"fi": "Maksutavat",
"fr": "Moyens de paiement",
"it": "Metodi di pagamento",
"ja": "決済方法",
"ko": "결제 방법",
"nb": "Betalingsmetoder",
"nl": "Betaalmethoden",
"pl": "Metody płatności",
"pt-BR": "Formas de pagamento",
"pt-PT": "Métodos de Pagamento",
"sv": "Betalningsmetoder",
"th": "วิธีการชำระเงิน",
"tr": "Ödeme yöntemleri",
"vi": "Phương thức thanh toán",
"zh-CN": "支付方式",
"zh-TW": "付款方式"
}
},
{
"type": "checkbox",
"id": "show_payment_icons",
"label": {
"cs": "Zobrazit ikony plateb",
"da": "Vis betalingsikoner",
"de": "Zahlungssymbole anzeigen",
"en": "Show payment icons",
"es": "Mostrar iconos de pago",
"fi": "Näytä maksukuvakkeet",
"fr": "Afficher les icônes de paiement",
"it": "Mostra le icone di pagamento",
"ja": "支払いアイコンを表示する",
"ko": "결제 아이콘 표시",
"nb": "Vis betalingsikoner",
"nl": "Betalingspictogrammen weergeven",
"pl": "Pokaż ikony płatności",
"pt-BR": "Exibir ícones de pagamento",
"pt-PT": "Mostrar ícones de pagamento",
"sv": "Visa betalningsikoner",
"th": "แสดงไอคอนการชำระเงิน",
"tr": "Ödeme simgelerini göster",
"vi": "Hiển thị biểu tượng thanh toán",
"zh-CN": "显示付款图标",
"zh-TW": "顯示付款圖示"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Selektor země/oblasti",
"da": "Land/område-vælger",
"de": "Auswahl für Land/Region",
"en": "Country/region Selector",
"es": "Selector de país/región",
"fi": "Maa-/aluevalitsin",
"fr": "Sélecteur de pays/région",
"it": "Selettore paese/area geografica",
"ja": "国/地域セレクター",
"ko": "국가/지역 선택기",
"nb": "Land-/regionvelger",
"nl": "Kiezer voor land/regio",
"pl": "Selektor kraju/regionu",
"pt-BR": "Seletor de país/região",
"pt-PT": "Seletor de país/região",
"sv": "Land/region-väljare",
"th": "ตัวเลือกประเทศ/ภูมิภาค",
"tr": "Ülke/Bölge Seçici",
"vi": "Hộp chọn quốc gia/vùng",
"zh-CN": "国家/地区选择器",
"zh-TW": "國家/地區選擇器"
},
"info": {
"cs": "Pokud chcete přidat zemi nebo oblast, přejděte na [nastavení plateb.](/admin/settings/payments)",
"da": "For at tilføje et land/område skal du gå til dine [betalingsindstillinger.](/admin/settings/payments)",
"de": "Gehe zu deinen [Zahlungseinstellungen](/admin/settings/payments), um ein Land/eine Region hinzuzufügen.",
"en": "To add a country/region, go to your [payment settings.](/admin/settings/payments)",
"es": "Para agregar un país/región, ve a tu [configuración de pago.](/admin/settings/payments)",
"fi": "Lisää maa/alue siirtymällä omiin [maksuasetuksiisi.](/admin/settings/payments)",
"fr": "Pour ajouter un pays/une région, allez dans vos [paramètres de paiement.](/admin/settings/payments)",
"it": "Per aggiungere un paese/area geografica, vai a [impostazioni pagamento.](/admin/settings/payments)",
"ja": "国/地域を追加するには、[決済設定](/admin/settings/payments) に移動します。",
"ko": "국가/지역을 추가하려면 [결제 설정](/admin/settings/payments)(으)로 이동하십시오.",
"nb": "For å legge til et land/region må du gå til [betalingsinnstillingene.](/admin/settings/payments)",
"nl": "Ga naar je [betaalinstellingen.](/admin/settings/payments) om een land/regio toe te voegen.",
"pl": "Aby dodać kraj/region, przejdź do swoich [ustawień płatności.](/admin/settings/payments)",
"pt-BR": "Para adicionar um país/região, acesse as [Configurações de pagamento.](/admin/settings/payments)",
"pt-PT": "Para adicionar um país/região, aceda às [definições de pagamento.](/admin/settings/payments)",
"sv": "För att lägga till land/region går du till dina [betalningsinställningar.](/admin/settings/payments)",
"th": "หากต้องการเพิ่มประเทศ/ภูมิภาค ให้ไปที่ [การตั้งค่าการชำระเงิน](/admin/settings/payments)",
"tr": "Ülke/bölge eklemek için [ödeme ayarlarınıza](/admin/settings/payments) gidin.",
"vi": "Để thêm quốc gia/vùng, vào [cài đặt thanh toán.](/admin/settings/payments)",
"zh-CN": "若要添加国家/地区,请转到 [支付设置。](/admin/settings/payments)",
"zh-TW": "若要新增國家/地區,請前往 [付款設定。](/admin/settings/payments)"
}
},
{
"type": "checkbox",
"id": "show_currency_selector",
"label": {
"cs": "Zobrazit selektor země/oblasti",
"da": "Vis land/område-vælger",
"de": "Auswahl für Land/Region anzeigen",
"en": "Show country/region selector",
"es": "Mostrar selector de país/región",
"fi": "Näytä maa-/aluevalitsin",
"fr": "Afficher le sélecteur de pays/région",
"it": "Mostra selettore paese/area geografica",
"ja": "国/地域セレクターを表示する",
"ko": "국가/지역 선택기 표시",
"nb": "Vis land-/regionvelger",
"nl": "Kiezer voor land/regio weergeven",
"pl": "Pokaż selektor kraju/regionu",
"pt-BR": "Exibir seletor de país/região",
"pt-PT": "Mostrar seletor de país/região",
"sv": "Visa land/region-väljare",
"th": "แสดงตัวเลือกประเทศ/ภูมิภาค",
"tr": "Ülke/bölge seçiciyi göster",
"vi": "Hiển thị hộp chọn quốc gia/vùng",
"zh-CN": "显示国家/地区选择器",
"zh-TW": "顯示國家/地區選擇器"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Selektor jazyka",
"da": "Sprogvælger",
"de": "Sprachauswahl",
"en": "Language Selector",
"es": "Selector de idioma",
"fi": "Kielenvalitsin",
"fr": "Sélecteur de langue",
"it": "Selettore lingua",
"ja": "言語セレクター",
"ko": "언어 선택기",
"nb": "Språkvelger",
"nl": "Taalkiezer",
"pl": "Selektor języka",
"pt-BR": "Seletor de idiomas",
"pt-PT": "Seletor de Idioma",
"sv": "Språkväljare",
"th": "ตัวเลือกภาษา",
"tr": "Dil Seçici",
"vi": "Hộp chọn ngôn ngữ",
"zh-CN": "语言选择器",
"zh-TW": "語言選擇器"
},
"info": {
"cs": "Pokud chcete přidat jazyk, přejděte na [jazykové nastavení.](/admin/settings/languages)",
"da": "Du kan tilføje et sprog ved at gå til dine [sprogindstillinger.](/admin/settings/languages)",
"de": "Geh zu deinen [Spracheinstellungen](/admin/settings/languages), um eine Sprache hinzuzufügen.",
"en": "To add a language, go to your [language settings.](/admin/settings/languages)",
"es": "Para agregar un idioma, ve a tu[configuración de idioma](/admin/settings/languages)",
"fi": "Lisää kieli siirtymällä [kieliasetuksiin.](/admin/settings/languages)",
"fr": "Pour ajouter une langue, allez dans vos [paramètres de langue.](/admin/settings/languages).",
"it": "Per aggiungere una lingua, vai su [impostazioni della lingua.](/admin/settings/languages)",
"ja": "言語を追加するには、[言語設定](/admin/settings/languages) に移動します。",
"ko": "언어를 추가하려면 [언어 설정.](/admin/settings/languages)(으)로 이동하십시오.",
"nb": "For å legge til et språk, går du til dine [språkinnstillinger.](/admin/settings/languages)",
"nl": "Ga naar je [taalinstellingen.](/admin/settings/languages) om een taal toe te voegen.",
"pl": "Aby dodać język, przejdź do swoich [ustawień języka.](/admin/settings/languages)",
"pt-BR": "Para adicionar um idioma, acesse suas [configurações de idioma. ](/admin/settings/languages)",
"pt-PT": "Para adicionar um idioma, aceda a [definições de idioma.](/admin/settings/languages)",
"sv": "För att lägga till ett språk, gå till dina [språkinställningar.](/admin/settings/languages)",
"th": "หากต้องการเพิ่มภาษา ให้ไปที่ [การตั้งค่าภาษา ](/admin/settings/languages) ของคุณ",
"tr": "Dil eklemek için [dil ayarları](/admin/settings/languages) bölümünüze gidin.",
"vi": "Để thêm ngôn ngữ, mở [cài đặt ngôn ngữ.](/admin/settings/languages)",
"zh-CN": "若要添加语言,请转到您的 [语言设置。](/admin/settings/languages)",
"zh-TW": "若要新增語言,請前往 [語言設定。](/admin/settings/languages)"
}
},
{
"type": "checkbox",
"id": "show_locale_selector",
"label": {
"cs": "Zobrazit selektor jazyka",
"da": "Vis sprogvælger",
"de": "Sprachauswahl anzeigen",
"en": "Show language selector",
"es": "Mostrar el selector de idioma",
"fi": "Näytä kielenvalitsin",
"fr": "Afficher le sélecteur de langue",
"it": "Mostra selettore lingua",
"ja": "言語セレクターを表示する",
"ko": "언어 선택기 표시",
"nb": "Vis språkvelger",
"nl": "Taalkiezer weergeven",
"pl": "Pokaż selektor języka",
"pt-BR": "Exibir seletor de idioma",
"pt-PT": "Mostrar seletor de idioma",
"sv": "Visa språkväljare",
"th": "แสดงตัวเลือกภาษา",
"tr": "Dil seçiciyi göster",
"vi": "Hiển thị hộp chọn ngôn ngữ",
"zh-CN": "显示语言选择器",
"zh-TW": "顯示語言選擇器"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Nabídka",
"da": "Menu",
"de": "Menü",
"en": "Menu",
"es": "Menú",
"fi": "Valikko",
"fr": "Menu",
"it": "Menu",
"ja": "メニュー",
"ko": "메뉴",
"nb": "Meny",
"nl": "Menu",
"pl": "Menu",
"pt-BR": "Menu",
"pt-PT": "Menu",
"sv": "Meny",
"th": "เมนู",
"tr": "Menü",
"vi": "Menu",
"zh-CN": "菜单",
"zh-TW": "選單"
}
},
{
"type": "link_list",
"id": "footer_link_list",
"label": {
"cs": "Nabídka v zápatí",
"da": "Sidefodsmenu",
"de": "Fußzeilenmenü",
"en": "Footer menu",
"es": "Menú inferior",
"fi": "Alatunniste-valikko",
"fr": "Menu pied de page",
"it": "Menu footer",
"ja": "フッターメニュー",
"ko": "바닥글 메뉴",
"nb": "Bunntekstmeny",
"nl": "Voettekstmenu",
"pl": "Menu stopki",
"pt-BR": "Menu de rodapé",
"pt-PT": "Menu do rodapé",
"sv": "Sidfotsmeny",
"th": "เมนูส่วนท้าย",
"tr": "Altbilgi menüsü",
"vi": "Menu chân trang",
"zh-CN": "页脚菜单",
"zh-TW": "頁尾選單"
},
"default": "footer"
}
]
}
{% endschema %}
yes please check theme setting its allow
Hi @jakelemon
this is not possible from theme editor , it would require actual code changes in your theme. Please dm me your store myshopify url so that I can send you a collaborator access request.
This is an accepted solution.
Hi @jakelemon
have to modify the sections/footer.liquid file
move this block of code to element below
Here is the new code:
<footer class="site-footer small--text-center" role="contentinfo" data-section-id="{{ section.id }}" data-section-type="footer-section">
<div class="wrapper">
<div class="grid-uniform">
{% comment %}
Default to 1 footer column (copyright/powered_by/payment_types)
{% endcomment %}
{% assign num_footer_columns = 1 %}
{% comment %}
Create an extra menu column if link list has more than 5 links
{% endcomment %}
{% if linklists[section.settings.footer_link_list].links.size > 0 %}
{% comment %}
We have a Footer menu that isn't empty, we will need another column
{% endcomment %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% assign extra_footer_linklist_column = false %}
{% assign footer_linklist_count = linklists[section.settings.footer_link_list].links.size %}
{% if footer_linklist_count > 5 %}
{% assign extra_footer_linklist_column = true %}
{% comment %}
We split the links so we'll need another column
{% endcomment %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% endif %}
{% comment %}
If we have an odd amount of links, we need to show 1 more link in 1st column
{% endcomment %}
{% assign extra_link = footer_linklist_count | modulo: 2 %}
{% comment %}
We start with a 2nd column after first column is filled up.
{% endcomment %}
{% assign footer_linklist_split = footer_linklist_count | divided_by: 2 | plus: extra_link | plus: 1 %}
{% endif %}
{% comment %}
Determine whether there are social links
{% endcomment %}
{% assign footer_social_enable = false %}
{% if
settings.social_twitter_link != blank
or settings.social_facebook_link != blank
or settings.social_pinterest_link != blank
or settings.social_google_plus_link != blank
or settings.social_instagram_link != blank
or settings.social_tumblr_link != blank
or settings.social_youtube_link != blank
or settings.social_vimeo_link != blank
or settings.social_fancy_link != blank
or settings.social_snapchat_link != blank
%}
{% assign footer_social_enable = true %}
{% endif %}
{% comment %}
Determine whether to show selectors
{% endcomment %}
{%- assign show_country_selector = section.settings.show_currency_selector -%}
{%- assign country_selector = false -%}
{%- if show_country_selector and localization.available_countries.size > 1 -%}
{%- assign country_selector = true -%}
{%- endif -%}
{%- assign locale_selector = false -%}
{%- if section.settings.show_locale_selector and localization.available_languages.size > 1 -%}
{%- assign locale_selector = true -%}
{%- endif -%}
{% comment %}
Calculate the number of footer columns shown. Default to 1.
{% endcomment %}
{% if footer_social_enable %}
{% assign num_footer_columns = num_footer_columns | plus: 1 %}
{% endif %}
{% case num_footer_columns %}
{% when 0 %}
{% when 1 %}
{% assign footer_column_width = '' %}
{% when 2 %}
{% assign footer_column_width = 'one-half small--one-whole' %}
{% when 3 %}
{% assign footer_column_width = 'one-third small--one-whole' %}
{% when 4 %}
{% assign footer_column_width = 'large--one-quarter medium--one-half' %}
{% endcase %}
{% if linklists[section.settings.footer_link_list].links.size > 0 %}
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets site-footer__linklist">
{% for link in linklists[section.settings.footer_link_list].links %}
{% comment %}
Create a second column
{% endcomment %}
{% if extra_footer_linklist_column and forloop.index == footer_linklist_split %}
</ul>
</div>
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets site-footer__linklist">
{% endif %}
<li><a href="{{ link.url }}">{{ link.title }}</a></li>
{% endfor %}
</ul>
</div>
{% endif %}
{% if footer_social_enable %}
<div class="grid__item {{ footer_column_width }}">
<ul class="no-bullets social-icons">
{% if settings.social_facebook_link != blank %}
<li>
<a href="{{ settings.social_facebook_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Facebook' }}">
<span class="icon icon-facebook" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_twitter_link != blank %}
<li>
<a href="{{ settings.social_twitter_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Twitter' }}">
<span class="icon icon-twitter" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_pinterest_link != blank %}
<li>
<a href="{{ settings.social_pinterest_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Pinterest' }}">
<span class="icon icon-pinterest" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_instagram_link != blank %}
<li>
<a href="{{ settings.social_instagram_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Instagram' }}">
<span class="icon icon-instagram" aria-hidden="true"></span>
</a>
</li>
{% endif %}
{% if settings.social_snapchat_link != blank %}
<li>
<a href="{{ settings.social_snapchat_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Snapchat' }}">
<span class="icon icon-snapchat" aria-hidden="true"></span>
Snapchat
</a>
</li>
{% endif %}
{% if settings.social_google_plus_link != blank %}
<li>
<a href="{{ settings.social_google_plus_link | escape }}" rel="publisher" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Google Plus' }}">
<span class="icon icon-google_plus" aria-hidden="true"></span>
Google Plus
</a>
</li>
{% endif %}
{% if settings.social_tumblr_link != blank %}
<li>
<a href="{{ settings.social_tumblr_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Tumblr' }}">
<span class="icon icon-tumblr" aria-hidden="true"></span>
Tumblr
</a>
</li>
{% endif %}
{% if settings.social_youtube_link != blank %}
<li>
<a href="{{ settings.social_youtube_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'YouTube' }}">
<span class="icon icon-youtube" aria-hidden="true"></span>
YouTube
</a>
</li>
{% endif %}
{% if settings.social_vimeo_link != blank %}
<li>
<a href="{{ settings.social_vimeo_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Vimeo' }}">
<span class="icon icon-vimeo" aria-hidden="true"></span>
Vimeo
</a>
</li>
{% endif %}
{% if settings.social_fancy_link != blank %}
<li>
<a href="{{ settings.social_fancy_link | escape }}" title="{{ 'layout.footer.social_platform' | t: name: shop.name, platform: 'Fancy' }}">
<span class="icon icon-fancy" aria-hidden="true"></span>
Fancy
</a>
</li>
{% endif %}
</ul>
</div>
{% endif %}
{%- liquid
assign selectors_form_class = "selectors-form"
if num_footer_columns == 1
assign selectors_form_class = "selectors-form selectors-form--single-column"
endif
-%}
<div class="grid__item {{ footer_column_width }} {% if num_footer_columns == 1 %}text-center{% else %}large--text-right{% endif %}">
{%- form 'localization', class: selectors_form_class -%}
{%- if country_selector -%}
<div class="selectors-form__item">
<h2 class="visually-hidden" id="country-heading">
{{ 'general.country.dropdown_label' | t }}
</h2>
{%- assign current_currency_symbol = localization.country.currency.symbol -%}
{%- assign current_currency_iso_code = localization.country.currency.iso_code -%}
<div class="disclosure" data-disclosure-country>
<button type="button" class="disclosure__toggle" aria-expanded="false" aria-controls="country-list" aria-describedby="country-heading" data-disclosure-toggle>
{%- if current_currency_symbol -%}
{{ localization.country.name }} ({{ current_currency_iso_code }} {{ current_currency_symbol }})
{%- else -%}
{{ localization.country.name }} ({{ current_currency_iso_code }})
{%- endif -%}
</button>
<ul id="country-list" class="disclosure-list" data-disclosure-list>
{% for country in localization.available_countries %}
{%- assign currency_symbol = country.currency.symbol -%}
{%- assign currency_iso_code = country.currency.iso_code -%}
<li class="disclosure-list__item {% if country.iso_code == localization.country.iso_code %}disclosure-list__item--current{% endif %}">
<a class="disclosure-list__option" href="#" {% if country.iso_code == localization.country.iso_code %}aria-current="true"{% endif %} data-value="{{ country.iso_code }}" data-disclosure-option>
{%- if currency_symbol -%}
{{ country.name }} ({{ currency_iso_code }} {{ currency_symbol }})
{%- else -%}
{{ country.name }} ({{ currency_iso_code }})
{%- endif -%}
</a>
</li>
{%- endfor -%}
</ul>
<input type="hidden" name="country_code" id="CountrySelector" value="{{ localization.country.iso_code }}" data-disclosure-input/>
</div>
</div>
{%- endif -%}
{%- if locale_selector -%}
<div class="selectors-form__item">
<h2 class="visually-hidden" id="lang-heading">
{{ 'general.language.dropdown_label' | t }}
</h2>
<div class="disclosure" data-disclosure-locale>
<button type="button" class="disclosure__toggle" aria-expanded="false" aria-controls="lang-list" aria-describedby="lang-heading" data-disclosure-toggle>
{{ localization.language.endonym_name }}
</button>
<ul id="lang-list" class="disclosure-list" data-disclosure-list>
{%- for language in localization.available_languages -%}
<li class="disclosure-list__item {% if language.iso_code == localization.language.iso_code %}disclosure-list__item--current{% endif %}">
<a class="disclosure-list__option" href="#" lang="{{ language.iso_code }}" {% if language.iso_code == localization.language.iso_code %}aria-current="true"{% endif %} data-value="{{ language.iso_code }}" data-disclosure-option>
{{ language.endonym_name }}
</a>
</li>
{%- endfor -%}
</ul>
<input type="hidden" name="locale_code" id="LocaleSelector" value="{{ localization.language.iso_code }}" data-disclosure-input/>
</div>
</div>
{%- endif -%}
{%- endform -%}
</div>
</div>
<div class="grid-uniform">
<div class="grid__item one-whole text-center">
<p class="site-footer__copyright-content">© {{ 'now' | date: '%Y' }}, {{ shop.name | link_to: routes.root_url }}<br>{{ powered_by_link }}</p>
{%- if section.settings.show_payment_icons -%}
{%- unless shop.enabled_payment_types == empty -%}
<span class="visually-hidden">{{ 'general.payment.method' | t }}</span>
<ul class="inline-list payment-icons site-footer__payment-icons">
{%- for type in shop.enabled_payment_types -%}
<li>
{{ type | payment_type_svg_tag: class: 'icon' }}
</li>
{%- endfor -%}
</ul>
{%- endunless -%}
{%- endif -%}
</div>
</div>
</div>
</footer>
{% schema %}
{
"name": {
"cs": "Zápatí",
"da": "Sidefod",
"de": "Fußzeile",
"en": "Footer",
"es": "Pie de página",
"fi": "Alatunniste",
"fr": "Pied de page",
"it": "Footer",
"ja": "フッター",
"ko": "바닥글",
"nb": "Footer",
"nl": "Voettekst",
"pl": "Stopka",
"pt-BR": "Rodapé",
"pt-PT": "Rodapé",
"sv": "Sidfot",
"th": "ส่วนท้าย",
"tr": "Altbilgi",
"vi": "Chân trang",
"zh-CN": "页脚",
"zh-TW": "頁尾"
},
"settings": [
{
"type": "header",
"content": {
"cs": "Platební metody",
"da": "Betalingsmetoder",
"de": "Zahlungsmethoden",
"en": "Payment methods",
"es": "Métodos de pago",
"fi": "Maksutavat",
"fr": "Moyens de paiement",
"it": "Metodi di pagamento",
"ja": "決済方法",
"ko": "결제 방법",
"nb": "Betalingsmetoder",
"nl": "Betaalmethoden",
"pl": "Metody płatności",
"pt-BR": "Formas de pagamento",
"pt-PT": "Métodos de Pagamento",
"sv": "Betalningsmetoder",
"th": "วิธีการชำระเงิน",
"tr": "Ödeme yöntemleri",
"vi": "Phương thức thanh toán",
"zh-CN": "支付方式",
"zh-TW": "付款方式"
}
},
{
"type": "checkbox",
"id": "show_payment_icons",
"label": {
"cs": "Zobrazit ikony plateb",
"da": "Vis betalingsikoner",
"de": "Zahlungssymbole anzeigen",
"en": "Show payment icons",
"es": "Mostrar iconos de pago",
"fi": "Näytä maksukuvakkeet",
"fr": "Afficher les icônes de paiement",
"it": "Mostra le icone di pagamento",
"ja": "支払いアイコンを表示する",
"ko": "결제 아이콘 표시",
"nb": "Vis betalingsikoner",
"nl": "Betalingspictogrammen weergeven",
"pl": "Pokaż ikony płatności",
"pt-BR": "Exibir ícones de pagamento",
"pt-PT": "Mostrar ícones de pagamento",
"sv": "Visa betalningsikoner",
"th": "แสดงไอคอนการชำระเงิน",
"tr": "Ödeme simgelerini göster",
"vi": "Hiển thị biểu tượng thanh toán",
"zh-CN": "显示付款图标",
"zh-TW": "顯示付款圖示"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Selektor země/oblasti",
"da": "Land/område-vælger",
"de": "Auswahl für Land/Region",
"en": "Country/region Selector",
"es": "Selector de país/región",
"fi": "Maa-/aluevalitsin",
"fr": "Sélecteur de pays/région",
"it": "Selettore paese/area geografica",
"ja": "国/地域セレクター",
"ko": "국가/지역 선택기",
"nb": "Land-/regionvelger",
"nl": "Kiezer voor land/regio",
"pl": "Selektor kraju/regionu",
"pt-BR": "Seletor de país/região",
"pt-PT": "Seletor de país/região",
"sv": "Land/region-väljare",
"th": "ตัวเลือกประเทศ/ภูมิภาค",
"tr": "Ülke/Bölge Seçici",
"vi": "Hộp chọn quốc gia/vùng",
"zh-CN": "国家/地区选择器",
"zh-TW": "國家/地區選擇器"
},
"info": {
"cs": "Pokud chcete přidat zemi nebo oblast, přejděte na [nastavení plateb.](/admin/settings/payments)",
"da": "For at tilføje et land/område skal du gå til dine [betalingsindstillinger.](/admin/settings/payments)",
"de": "Gehe zu deinen [Zahlungseinstellungen](/admin/settings/payments), um ein Land/eine Region hinzuzufügen.",
"en": "To add a country/region, go to your [payment settings.](/admin/settings/payments)",
"es": "Para agregar un país/región, ve a tu [configuración de pago.](/admin/settings/payments)",
"fi": "Lisää maa/alue siirtymällä omiin [maksuasetuksiisi.](/admin/settings/payments)",
"fr": "Pour ajouter un pays/une région, allez dans vos [paramètres de paiement.](/admin/settings/payments)",
"it": "Per aggiungere un paese/area geografica, vai a [impostazioni pagamento.](/admin/settings/payments)",
"ja": "国/地域を追加するには、[決済設定](/admin/settings/payments) に移動します。",
"ko": "국가/지역을 추가하려면 [결제 설정](/admin/settings/payments)(으)로 이동하십시오.",
"nb": "For å legge til et land/region må du gå til [betalingsinnstillingene.](/admin/settings/payments)",
"nl": "Ga naar je [betaalinstellingen.](/admin/settings/payments) om een land/regio toe te voegen.",
"pl": "Aby dodać kraj/region, przejdź do swoich [ustawień płatności.](/admin/settings/payments)",
"pt-BR": "Para adicionar um país/região, acesse as [Configurações de pagamento.](/admin/settings/payments)",
"pt-PT": "Para adicionar um país/região, aceda às [definições de pagamento.](/admin/settings/payments)",
"sv": "För att lägga till land/region går du till dina [betalningsinställningar.](/admin/settings/payments)",
"th": "หากต้องการเพิ่มประเทศ/ภูมิภาค ให้ไปที่ [การตั้งค่าการชำระเงิน](/admin/settings/payments)",
"tr": "Ülke/bölge eklemek için [ödeme ayarlarınıza](/admin/settings/payments) gidin.",
"vi": "Để thêm quốc gia/vùng, vào [cài đặt thanh toán.](/admin/settings/payments)",
"zh-CN": "若要添加国家/地区,请转到 [支付设置。](/admin/settings/payments)",
"zh-TW": "若要新增國家/地區,請前往 [付款設定。](/admin/settings/payments)"
}
},
{
"type": "checkbox",
"id": "show_currency_selector",
"label": {
"cs": "Zobrazit selektor země/oblasti",
"da": "Vis land/område-vælger",
"de": "Auswahl für Land/Region anzeigen",
"en": "Show country/region selector",
"es": "Mostrar selector de país/región",
"fi": "Näytä maa-/aluevalitsin",
"fr": "Afficher le sélecteur de pays/région",
"it": "Mostra selettore paese/area geografica",
"ja": "国/地域セレクターを表示する",
"ko": "국가/지역 선택기 표시",
"nb": "Vis land-/regionvelger",
"nl": "Kiezer voor land/regio weergeven",
"pl": "Pokaż selektor kraju/regionu",
"pt-BR": "Exibir seletor de país/região",
"pt-PT": "Mostrar seletor de país/região",
"sv": "Visa land/region-väljare",
"th": "แสดงตัวเลือกประเทศ/ภูมิภาค",
"tr": "Ülke/bölge seçiciyi göster",
"vi": "Hiển thị hộp chọn quốc gia/vùng",
"zh-CN": "显示国家/地区选择器",
"zh-TW": "顯示國家/地區選擇器"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Selektor jazyka",
"da": "Sprogvælger",
"de": "Sprachauswahl",
"en": "Language Selector",
"es": "Selector de idioma",
"fi": "Kielenvalitsin",
"fr": "Sélecteur de langue",
"it": "Selettore lingua",
"ja": "言語セレクター",
"ko": "언어 선택기",
"nb": "Språkvelger",
"nl": "Taalkiezer",
"pl": "Selektor języka",
"pt-BR": "Seletor de idiomas",
"pt-PT": "Seletor de Idioma",
"sv": "Språkväljare",
"th": "ตัวเลือกภาษา",
"tr": "Dil Seçici",
"vi": "Hộp chọn ngôn ngữ",
"zh-CN": "语言选择器",
"zh-TW": "語言選擇器"
},
"info": {
"cs": "Pokud chcete přidat jazyk, přejděte na [jazykové nastavení.](/admin/settings/languages)",
"da": "Du kan tilføje et sprog ved at gå til dine [sprogindstillinger.](/admin/settings/languages)",
"de": "Geh zu deinen [Spracheinstellungen](/admin/settings/languages), um eine Sprache hinzuzufügen.",
"en": "To add a language, go to your [language settings.](/admin/settings/languages)",
"es": "Para agregar un idioma, ve a tu[configuración de idioma](/admin/settings/languages)",
"fi": "Lisää kieli siirtymällä [kieliasetuksiin.](/admin/settings/languages)",
"fr": "Pour ajouter une langue, allez dans vos [paramètres de langue.](/admin/settings/languages).",
"it": "Per aggiungere una lingua, vai su [impostazioni della lingua.](/admin/settings/languages)",
"ja": "言語を追加するには、[言語設定](/admin/settings/languages) に移動します。",
"ko": "언어를 추가하려면 [언어 설정.](/admin/settings/languages)(으)로 이동하십시오.",
"nb": "For å legge til et språk, går du til dine [språkinnstillinger.](/admin/settings/languages)",
"nl": "Ga naar je [taalinstellingen.](/admin/settings/languages) om een taal toe te voegen.",
"pl": "Aby dodać język, przejdź do swoich [ustawień języka.](/admin/settings/languages)",
"pt-BR": "Para adicionar um idioma, acesse suas [configurações de idioma. ](/admin/settings/languages)",
"pt-PT": "Para adicionar um idioma, aceda a [definições de idioma.](/admin/settings/languages)",
"sv": "För att lägga till ett språk, gå till dina [språkinställningar.](/admin/settings/languages)",
"th": "หากต้องการเพิ่มภาษา ให้ไปที่ [การตั้งค่าภาษา ](/admin/settings/languages) ของคุณ",
"tr": "Dil eklemek için [dil ayarları](/admin/settings/languages) bölümünüze gidin.",
"vi": "Để thêm ngôn ngữ, mở [cài đặt ngôn ngữ.](/admin/settings/languages)",
"zh-CN": "若要添加语言,请转到您的 [语言设置。](/admin/settings/languages)",
"zh-TW": "若要新增語言,請前往 [語言設定。](/admin/settings/languages)"
}
},
{
"type": "checkbox",
"id": "show_locale_selector",
"label": {
"cs": "Zobrazit selektor jazyka",
"da": "Vis sprogvælger",
"de": "Sprachauswahl anzeigen",
"en": "Show language selector",
"es": "Mostrar el selector de idioma",
"fi": "Näytä kielenvalitsin",
"fr": "Afficher le sélecteur de langue",
"it": "Mostra selettore lingua",
"ja": "言語セレクターを表示する",
"ko": "언어 선택기 표시",
"nb": "Vis språkvelger",
"nl": "Taalkiezer weergeven",
"pl": "Pokaż selektor języka",
"pt-BR": "Exibir seletor de idioma",
"pt-PT": "Mostrar seletor de idioma",
"sv": "Visa språkväljare",
"th": "แสดงตัวเลือกภาษา",
"tr": "Dil seçiciyi göster",
"vi": "Hiển thị hộp chọn ngôn ngữ",
"zh-CN": "显示语言选择器",
"zh-TW": "顯示語言選擇器"
},
"default": true
},
{
"type": "header",
"content": {
"cs": "Nabídka",
"da": "Menu",
"de": "Menü",
"en": "Menu",
"es": "Menú",
"fi": "Valikko",
"fr": "Menu",
"it": "Menu",
"ja": "メニュー",
"ko": "메뉴",
"nb": "Meny",
"nl": "Menu",
"pl": "Menu",
"pt-BR": "Menu",
"pt-PT": "Menu",
"sv": "Meny",
"th": "เมนู",
"tr": "Menü",
"vi": "Menu",
"zh-CN": "菜单",
"zh-TW": "選單"
}
},
{
"type": "link_list",
"id": "footer_link_list",
"label": {
"cs": "Nabídka v zápatí",
"da": "Sidefodsmenu",
"de": "Fußzeilenmenü",
"en": "Footer menu",
"es": "Menú inferior",
"fi": "Alatunniste-valikko",
"fr": "Menu pied de page",
"it": "Menu footer",
"ja": "フッターメニュー",
"ko": "바닥글 메뉴",
"nb": "Bunntekstmeny",
"nl": "Voettekstmenu",
"pl": "Menu stopki",
"pt-BR": "Menu de rodapé",
"pt-PT": "Menu do rodapé",
"sv": "Sidfotsmeny",
"th": "เมนูส่วนท้าย",
"tr": "Altbilgi menüsü",
"vi": "Menu chân trang",
"zh-CN": "页脚菜单",
"zh-TW": "頁尾選單"
},
"default": "footer"
}
]
}
{% endschema %}
Np @jakelemon
Happy to help 😊
Follow Step :
1. Edit theme code
2. click on footer.liquid file
3. find payment icon code by class name : "payment-icons "
4. cut this code and paste after 'grid-uniform' div end
more check in screen short
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