Brooklyn theme social media icons to show horizontal instead of vertical please
Hey @lslelegance ,
Welcome to the Shopify community!
Please share your store URL.
So that I will check and let you know the exact solution here.
Raman
Hi @lslelegance , add this to your css (this will apply for mobile):
@media only screen and (max-width: 749px) {
.no-bullets .social-icons{
display:flex;
justify-content:center;
}
}
If you find my answer helpful, please mark resolved or like.
hi thanks but unfortunately didn’t change anything
HI @lslelegance I’m not sure what do you mean, since this is what I can see now
Hi there thanks for help, the issue is in the menu not footer on desktop version only. On phone is perfectly fine as show in the picture above
Hey @lslelegance ,
You can try below code, this will only apply in desktop view.
@media only screen and (min-width: 900px) {
.site-footer .social-icons {
display: flex;
justify-content: center;
}
}
Thanks
Oh @lslelegance , sorry, here it is:
- Find this in your theme.css file ‘ul.no-bullets.social-icons’ and add:
ul.no-bullets.social-icons{
display: flex;
text-align: center;
justify-content: center;
}
If you find my answer helpful, please mark resolved or like.
@lslelegance it’s clear, please try the code above ![]()
thank you so much ! worked ! can I ask for more assistance please ?
Sure @lslelegance ![]()
@lslelegance
Find this element (footer.liquid)
-
-
-
-
Cut it from there, and find this section that contains newsletter form, and include just above
-
-
-
-
That should solve it! ![]()
to be honest I didn’t understand well sorry is it possible to have the full footer.liquid that I can copy delete and copy all directly thanks so much? I am not that good in html unfortunately
No problem, can you share your footer.liquid file here ![]()
{% comment %}
Default to 1 footer column
{% 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 %}
-
{% 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 %}
-
{% endif %}
- {{ link.title }}
{% endfor %}
{% if footer_social_enable %}
-
{% if settings.social_facebook_link != blank %}
- Snapchat {% endif %} {% if settings.social_google_plus_link != blank %}
- Google Plus {% endif %} {% if settings.social_tumblr_link != blank %}
- Tumblr {% endif %} {% if settings.social_youtube_link != blank %}
- YouTube {% endif %} {% if settings.social_vimeo_link != blank %}
- Vimeo {% endif %} {% if settings.social_fancy_link != blank %}
- Fancy {% endif %}
© {{ shop.name | link_to: routes.root_url }}
{%- if section.settings.show_payment_icons -%}
{%- unless shop.enabled_payment_types == empty -%}
{{ ‘general.payment.method’ | t }}
-
{%- for type in shop.enabled_payment_types -%}
- {{ type | payment_type_svg_tag: class: 'icon' }} {%- endfor -%}
{%- liquid
assign selectors_form_class = “selectors-form”
if num_footer_columns == 1
assign selectors_form_class = “selectors-form selectors-form–single-column”
endif
-%}
{{ 'general.country.dropdown_label' | t }}
{%- assign current_currency_symbol = localization.country.currency.symbol -%} {%- assign current_currency_iso_code = localization.country.currency.iso_code -%}-
{% for country in localization.available_countries %}
{%- assign currency_symbol = country.currency.symbol -%}
{%- assign currency_iso_code = country.currency.iso_code -%}
- {%- if currency_symbol -%} {{ country.name }} ({{ currency_iso_code }} {{ currency_symbol }}) {%- else -%} {{ country.name }} ({{ currency_iso_code }}) {%- endif -%} {%- endfor -%}
{%- if locale_selector -%}
{{ 'general.language.dropdown_label' | t }}
-
{%- for language in localization.available_languages -%}
- {{ language.endonym_name }} {%- endfor -%}
{% form ‘customer’ %}
{{ form.errors | default_errors }}
{% if form.posted_successfully? %}
{% 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.”,
“da”: “For at tilføje et land/område skal du gå til dine betalingsindstillinger.”,
“de”: “Gehe zu deinen Zahlungseinstellungen, um ein Land/eine Region hinzuzufügen.”,
“en”: “To add a country/region, go to your payment settings.”,
“es”: “Para agregar un país/región, ve a tu configuración de pago.”,
“fi”: “Lisää maa/alue siirtymällä omiin maksuasetuksiisi.”,
“fr”: “Pour ajouter un pays/une région, allez dans vos paramètres de paiement.”,
“it”: “Per aggiungere un paese/area geografica, vai a impostazioni pagamento.”,
“ja”: “国/地域を追加するには、決済設定 に移動します。”,
“ko”: “국가/지역을 추가하려면 결제 설정(으)로 이동하십시오.”,
“nb”: “For å legge til et land/region må du gå til betalingsinnstillingene.”,
“nl”: “Ga naar je betaalinstellingen. om een land/regio toe te voegen.”,
“pl”: “Aby dodać kraj/region, przejdź do swoich ustawień płatności.”,
“pt-BR”: “Para adicionar um país/região, acesse as Configurações de pagamento.”,
“pt-PT”: “Para adicionar um país/região, aceda às definições de pagamento.”,
“sv”: “För att lägga till land/region går du till dina betalningsinställningar.”,
“th”: “หากต้องการเพิ่มประเทศ/ภูมิภาค ให้ไปที่ การตั้งค่าการชำระเงิน”,
“tr”: “Ülke/bölge eklemek için ödeme ayarlarınıza gidin.”,
“vi”: “Để thêm quốc gia/vùng, vào cài đặt thanh toán.”,
“zh-CN”: “若要添加国家/地区,请转到 支付设置。”,
“zh-TW”: “若要新增國家/地區,請前往 付款設定。”
}
},
{
“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í.”,
“da”: “Du kan tilføje et sprog ved at gå til dine sprogindstillinger.”,
“de”: “Geh zu deinen Spracheinstellungen, um eine Sprache hinzuzufügen.”,
“en”: “To add a language, go to your language settings.”,
“es”: “Para agregar un idioma, ve a tuconfiguración de idioma”,
“fi”: “Lisää kieli siirtymällä kieliasetuksiin.”,
“fr”: “Pour ajouter une langue, allez dans vos paramètres de langue..”,
“it”: “Per aggiungere una lingua, vai su impostazioni della lingua.”,
“ja”: “言語を追加するには、言語設定 に移動します。”,
“ko”: “언어를 추가하려면 언어 설정.(으)로 이동하십시오.”,
“nb”: “For å legge til et språk, går du til dine språkinnstillinger.”,
“nl”: “Ga naar je taalinstellingen. om een taal toe te voegen.”,
“pl”: “Aby dodać język, przejdź do swoich ustawień języka.”,
“pt-BR”: "Para adicionar um idioma, acesse suas configurações de idioma. ",
“pt-PT”: “Para adicionar um idioma, aceda a definições de idioma.”,
“sv”: “För att lägga till ett språk, gå till dina språkinställningar.”,
“th”: “หากต้องการเพิ่มภาษา ให้ไปที่ การตั้งค่าภาษา ของคุณ”,
“tr”: “Dil eklemek için dil ayarları bölümünüze gidin.”,
“vi”: “Để thêm ngôn ngữ, mở cài đặt ngôn ngữ.”,
“zh-CN”: “若要添加语言,请转到您的 语言设置。”,
“zh-TW”: “若要新增語言,請前往 語言設定。”
}
},
{
“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 %}
Thanks can u include also your solution to the title u gave me in the other thread please ? thanks



