Debut theme footer menu same line as payment icons and copyright text

Store Design
1

Hello.

How to put footer menu in same line as payment icons and copyright text?

Untitled.png
Untitled.png1920×379 9.15 KB

Here is site link - Flynovastore.com

1 Like
2

Hi there @jonis ,

The links and the icons are in different sections. To properly place the text you’ll need to move the code from the backend (I can’t help with this without looking at the backend of your theme code).

But if you want the quick fix (May not appear right on different screen sizes) then add the following code to your theme.css or theme.scss file (In Assets folder)

#shopify-section-footer .site-footer__item-inner--link_list {
    position: absolute;
    bottom: 60px;
}

Hope it helps

1 Like
3

Will work for start now. :slightly_smiling_face:

4

Here is code

{%- assign social_icons = false -%}
{%- assign inline_list = false -%}
{%- assign locale_selector = false -%}
{%- assign country_selector = false -%}
{%- assign show_payment_icons = false -%}
{%- assign show_selectors = false -%}

{%- assign show_country_selector = section.settings.show_currency_selector  -%}
{%- if show_country_selector and localization.available_countries.size > 1 -%}
  {%- assign country_selector = true -%}
{%- endif -%}

{%- if section.settings.show_locale_selector and localization.available_languages.size > 1 -%}
  {%- assign locale_selector = true -%}
{%- endif -%}

{%- if section.settings.show_payment_icons -%}
  {%- unless shop.enabled_payment_types == empty -%}
    {%- assign show_payment_icons = true -%}
  {%- endunless -%}
{%- endif -%}

{%- if country_selector or locale_selector -%}
  {%- assign show_selectors = true -%}
{%- endif -%}

{%- if
  settings.social_twitter_link != blank
  or settings.social_facebook_link != blank
  or settings.social_pinterest_link != blank
  or settings.social_instagram_link != blank
  or settings.social_tumblr_link != blank
  or settings.social_snapchat_link != blank
  or settings.social_youtube_link != blank
  or settings.social_vimeo_link != blank
  or request.page_type == 'article'
  or request.page_type == 'blog'
-%}
  {%- assign social_icons = true -%}
{%- endif -%}

{%- assign payment_width_class = "one-half" -%}
{%- if show_selectors -%}
  {%- unless social_icons -%}
    {%- assign payment_width_class = "" -%}
  {%- endunless -%}
{%- endif -%}

{%- assign copyright_show_class = "medium-up--hide" -%}
{%- if social_icons -%}
  {%- unless show_selectors -%}
    {%- assign copyright_show_class = "" -%}
  {%- endunless -%}
{%- endif -%}

{%- case section.blocks.size -%}
  {%- when 1 -%}
    {%- assign footer_item = 'site-footer__item--full-width' -%}
    {%- assign inline_list = true -%}
  {%- when 2 -%}
    {%- assign footer_item = 'site-footer__item--one-half' -%}
    {%- assign inline_list = true -%}
  {%- when 3 -%}
    {%- assign footer_item = 'site-footer__item--one-third' -%}
    {%- for block in section.blocks -%}
      {%- if block.type == 'newsletter' -%}
        {%- assign footer_item = 'site-footer__item--one-quarter' -%}
        {%- break -%}
      {%- endif -%}
    {%- endfor -%}
  {%- when 4 -%}
    {%- assign footer_item = 'site-footer__item--one-quarter' -%}
  {%- when 5 -%}
    {%- assign footer_item = 'site-footer__item--one-fifth' -%}
{%- endcase -%}

{% comment %} Create an appropriate hover color based on text color and brightness {% endcomment %}
{%- assign footer_text_color = section.settings.color_footer_text -%}
{%- assign footer_text_color_brightness = section.settings.color_footer_text | color_brightness -%}
{%- if footer_text_color_brightness <= 26 -%}
  {%- assign footer_text_color_hover = footer_text_color | color_lighten: 25 -%}
{%- elsif footer_text_color_brightness <= 65 -%}
  {%- assign footer_text_color_hover = footer_text_color | color_lighten: 15 -%}
{%- else -%}
  {%- assign footer_text_color_hover = footer_text_color | color_darken: 10 -%}
{%- endif -%}

{%- capture payment_icon_markup -%}
  {%- if show_payment_icons -%}
    
      {{ 'general.payment.method' | t }}
      

        {%- for type in shop.enabled_payment_types -%}
          - {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
          
        {%- endfor -%}
      

    

  {%- endif -%}
{%- endcapture -%}