Move Language Selector to top-right corner

[Pan_Kamil]

I need to move Language selector from Top-Left corner to Top-Right corner

[Made4uo-Ribe]

Hi @Pan_Kamil ,

Would you mind to share your URL website? with password if its protected. Thanks!

[Pan_Kamil]

Sure.

https://n-hype.com/

[dmwwebartisan]

@Pan_Kamil

Please share your sections/header.liquid file code.

Thanks!

[Pan_Kamil]

{%- comment -%}
In Prestige, the header is quite complex due to the very high number of possible combinations. If you have to edit it, please
make sure to duplicate the theme first so you can revert your changes in case any issue is introduced.
{%- endcomment -%}

{%- comment -%}

USEFUL VARIABLES

{%- endcomment -%}

{%- assign use_transparent_header = false -%}

{%- if template == ‘index’ and section.settings.enable_transparent_header -%}
{%- assign use_transparent_header = true -%}
{%- endif -%}

{%- if template.name == ‘collection’ and section.settings.enable_transparent_header_collection and collection.image and collection.all_products_count > 0 and collection.template_suffix != ‘no-image’ -%}
{%- assign use_transparent_header = true -%}
{%- endif -%}

{%- if section.settings.navigation_style != ‘sidebar’ -%}
{%- assign use_sidebar_menu = false -%}
{%- else -%}
{%- assign use_sidebar_menu = true -%}
{%- endif -%}

{%- comment -%}

CURRENCY AND LANGUAGE SELECTORS

{%- endcomment -%}

{%- if section.settings.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 locale_selector or country_selector -%}
{%- capture localization_form -%}
{%- form ‘localization’, id: ‘localization_form_header’, class: ‘Header__LocalizationForm hidden-pocket hidden-lap’ -%}

{%- if country_selector -%}

{{ 'header.general.country' | t }} {{- localization.country.name }} ({{ localization.country.currency.iso_code }} {% if localization.country.currency.symbol %}{{ localization.country.currency.symbol }}{%- endif -%}) {%- render 'icon', icon: 'select-arrow' -%}

{% render 'icon' with 'close' %} {{ 'header.general.country' | t }}

{%- for country in localization.available_countries -%} {{- country.name }} ({{ country.currency.iso_code }} {% if country.currency.symbol %}{{ country.currency.symbol }}{%- endif -%}) {%- endfor -%}

{%- endif -%}

{%- if locale_selector -%}

{{ 'header.general.locale' | t }} {{- localization.language.endonym_name | capitalize -}} {%- render 'icon', icon: 'select-arrow' -%}

{% render 'icon' with 'close' %} {{ 'header.general.locale' | t }}

{%- for language in localization.available_languages -%} {{- language.endonym_name | capitalize -}} {%- endfor -%}

{%- endif -%}

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

{%- comment -%}

SEARCH FORM (implemented as a modal)

Implementation note: make sure that the Search div is always just before the Header element, as the CSS uses
this assumption

{%- endcomment -%}

{%- render 'icon' with 'search' -%} {%- render 'icon' with 'search-desktop' -%}

{% render ‘icon’ with ‘close’ %}

{%- if settings.search_mode != 'product' -%}

{%- endif -%}

{%- comment -%}

HEADER CONTENT

{%- endcomment -%}

{%- capture section_settings -%}
{
“navigationStyle”: {{ section.settings.navigation_style | json }},
“hasTransparentHeader”: {% if use_transparent_header %}true{% else %}false{% endif %},
“isSticky”: {% if section.settings.use_sticky_header %}true{% else %}false{% endif %}
}
{%- endcapture -%}

{%- render 'icon' with 'nav' -%} {%- render 'icon' with 'nav-desktop' -%}

{%- comment -%}

DESKTOP NAVIGATION (if not using the sidebar mode)

{%- endcomment -%}

{%- unless use_sidebar_menu -%}
{%- assign main_menu_handle = section.settings.navigation_menu | default: ‘main-menu’ -%}
{%- assign main_menu = linklists[main_menu_handle] -%}

{%- assign mega_menu_names = ‘’ -%}

{%- for block in section.blocks -%}
{%- if block.type == ‘mega_menu’ -%}
{%- assign trim_mega_menu_name = block.settings.navigation_mega_menu | strip -%}
{%- assign mega_menu_names = mega_menu_names | append: trim_mega_menu_name | append: ‘,’ -%}
{%- endif -%}
{%- endfor -%}

{%- assign mega_menu_names = mega_menu_names | downcase | split: ‘,’ | compact -%}

{%- for link in main_menu.links -%} {%- assign downcased_link_title = link.title | downcase | strip -%} {%- assign use_mega_menu = false -%}

{%- capture menu_item_dropdown -%}
{%- if mega_menu_names contains downcased_link_title -%}
{%- for block in section.blocks -%}
{%- assign downcased_mega_menu_name = block.settings.navigation_mega_menu | downcase -%}

{%- if downcased_mega_menu_name != downcased_link_title -%}
{%- continue -%}
{%- endif -%}

{%- assign use_mega_menu = true -%}
{%- assign push_image_count = 0 -%}

{%- if block.settings.push_1_image -%}
{%- assign push_image_count = push_image_count | plus: 1 -%}
{%- endif -%}

{%- if block.settings.push_2_image -%}
{%- assign push_image_count = push_image_count | plus: 1 -%}
{%- endif -%}

{%- assign should_space_evenly = false -%}

{%- if push_image_count == 0 and link.links.size <= 3 -%}
{%- assign should_space_evenly = true -%}
{%- endif -%}

{%- if push_image_count == 1 and link.links.size == 1 -%}
{%- assign should_space_evenly = true -%}
{%- endif -%}

{%- if push_image_count == 2 and link.links.size == 1 -%}
{%- assign should_space_evenly = true -%}
{%- endif -%}

{%- for sub_link in link.links -%}
{{ sub_link.title | title }}
{%- if sub_link.links != blank -%}
{%- for sub_sub_link in sub_link.links -%}
• {{ sub_sub_link.title | escape }}
{%- endfor -%}
{%- endif -%}
{%- endfor -%}
{%- if push_image_count > 0 -%}
{%- if block.settings.push_1_image -%}
{%- if block.settings.push_1_url != blank -%} {%- endif -%}
{%- assign max_width = 370 | at_most: block.settings.push_1_image.width -%}
{%- if block.settings.push_1_heading != blank -%}
{{ block.settings.push_1_heading | escape }}
{%- endif -%}
{%- if block.settings.push_1_subheading != blank -%}
{{ block.settings.push_1_subheading | escape }}
{%- endif -%}
{%- if block.settings.push_1_url != blank -%}

{%- endif -%}
{%- endif -%}
{%- if block.settings.push_2_image -%}
{%- if block.settings.push_2_url != blank -%} {%- endif -%}
{%- assign max_width = 370 | at_most: block.settings.push_2_image.width -%}
{%- if block.settings.push_2_heading != blank -%}
{{ block.settings.push_2_heading | escape }}
{%- endif -%}
{%- if block.settings.push_2_subheading != blank -%}
{{ block.settings.push_2_subheading | escape }}
{%- endif -%}
{%- if block.settings.push_2_url != blank -%}

{%- endif -%}
{%- endif -%}
{%- endif -%}
{%- endfor -%} {%- elsif link.links != blank -%}
{%- for sub_link in link.links -%}
• {{ sub_link.title | escape }} {% if sub_link.links != blank %}{% render 'icon' with 'select-arrow-right' %}{% endif %}

  {%- if sub_link.links != blank -%}

  {%- for sub_sub_link in sub_link.links -%}
  • {{ sub_sub_link.title | escape }}
  {%- endfor -%}
  {%- endif -%}
{%- endfor -%}
{%- endif -%} {%- endcapture -%}
• {{- link.title | escape -}}

  {%- if use_mega_menu or menu_item_dropdown == blank -%}
  {{ link.title | escape }}
  {%- endif -%}
  

  {{- menu_item_dropdown -}}

{%- endfor -%}

{{- localization_form -}}
{%- endunless -%}

{%- capture header_logo -%}

{%- if section.settings.logo != blank -%}
{%- capture image_size -%}{{ section.settings.logo_max_width }}x{%- endcapture -%}

{%- if use_transparent_header and section.settings.transparent_logo != blank -%}

{%- endif -%}
{%- else -%}
{{ shop.name }}
{%- endif -%}

{%- endcapture -%}

{%- if template == 'index' -%}

{{ header_logo }}

{%- else -%}

{{ header_logo }}

{%- endif -%}

{% if page.handle ==‘n-hype-studio’ %}

{% elsif page.handle =='n-hype-studio-coming-soon' %}

{% else %}

{% endif %}

{%- unless section.settings.show_icons or use_sidebar_menu -%}

{%- if localization_form != blank and section.settings.navigation_style == 'inline' or section.settings.navigation_style == 'logoLeft' -%}
• {{ localization_form }}
{%- endif -%}

{%- if shop.customer_accounts_enabled -%}

• {{- 'header.navigation.account' | t -}}
{%- endif -%}
• {{ 'header.navigation.search' | t }}
• {{ 'header.navigation.cart' | t }} ({{ cart.item_count }})

{%- elsif localization_form != blank -%}

• {{ localization_form }}

{%- endunless -%} {%- if shop.customer_accounts_enabled and section.settings.show_icons or use_sidebar_menu -%} {%- render 'icon' with 'account' -%} {%- endif -%} {%- render 'icon' with 'search' -%} {%- render 'icon' with 'search-desktop' -%}

<a href=“{{ routes.cart_url }}” class=“Header__Icon Icon-Wrapper Icon-Wrapper–clickable {% unless section.settings.show_icons or use_sidebar_menu %}hidden-desk{% endunless %}” {% if settings.cart_type == ‘drawer’ %}data-action=“open-drawer” data-drawer-id=“sidebar-cart” aria-expanded=“false” aria-label=“{{ ‘header.navigation.open_cart’ | t }}”{% endif %}>
{%- render ‘icon’ with ‘cart’ -%}
{%- render ‘icon’ with ‘cart-desktop’ -%}

{%- if section.settings.use_sticky_header -%} :root { --use-sticky-header: 1; --use-unsticky-header: 0; } .shopify-section--header { position: -webkit-sticky; position: sticky; } {%- else -%} :root { --use-sticky-header: 0; --use-unsticky-header: 1; } {%- endif -%} {%- if section.settings.logo -%} .Header__LogoImage { max-width: {{ section.settings.logo_max_width }}px; } @media screen and (max-width: 640px) { .Header__LogoImage { max-width: {{ section.settings.mobile_logo_max_width }}px; } } {%- endif -%} {%- if use_transparent_header -%} :root { --header-is-not-transparent: 0; --header-is-transparent: 1; } .shopify-section--header { margin-bottom: calc(-1 * var(--header-height)); } .supports-sticky .Search[aria-hidden="true"] + .Header--transparent { {%- if section.settings.show_transparent_header_border -%} box-shadow: 0 -1px {{ section.settings.transparent_text_color | color_modify: 'alpha', 0.25 }} inset; {%- else -%} box-shadow: none; {%- endif -%} color: {{ section.settings.transparent_text_color }}; } {%- else -%} :root { --header-is-not-transparent: 1; --header-is-transparent: 0; } {%- endif -%}

{% schema %}
{
“name”: “Header”,
“class”: “shopify-section–header”,
“settings”: [
{
“type”: “checkbox”,
“id”: “use_sticky_header”,
“label”: “Use sticky header”,
“default”: true
},
{
“type”: “header”,
“content”: “Logo”
},
{
“type”: “image_picker”,
“id”: “logo”,
“label”: “Image”,
“info”: “200 x 60px .png recommended”
},
{
“type”: “range”,
“id”: “logo_max_width”,
“min”: 50,
“max”: 350,
“step”: 5,
“unit”: “px”,
“label”: “Image width”,
“default”: 140
},
{
“type”: “range”,
“id”: “mobile_logo_max_width”,
“min”: 50,
“max”: 200,
“step”: 5,
“unit”: “px”,
“label”: “Mobile image width”,
“default”: 90
},
{
“type”: “header”,
“content”: “Country/region selector”,
“info”: “To add a country/region, go to your currency settings.”
},
{
“type”: “checkbox”,
“id”: “show_country_selector”,
“label”: “Show country/region selector”,
“default”: false
},
{
“type”: “header”,
“content”: “Language selector”,
“info”: “To add a language, go to your language settings.”
},
{
“type”: “checkbox”,
“id”: “show_locale_selector”,
“label”: “Show language selector”,
“default”: true
},
{
“type”: “header”,
“content”: “Navigation”
},
{
“type”: “link_list”,
“id”: “navigation_menu”,
“label”: “Menu”,
“default”: “main-menu”
},
{
“type”: “select”,
“id”: “navigation_style”,
“label”: “Navigation style”,
“info”: “Setting will default to center style if screen width cannot fit all the links.”,
“options”: [
{
“value”: “sidebar”,
“label”: “Sidebar”
},
{
“value”: “inline”,
“label”: “Inline”
},
{
“value”: “center”,
“label”: “Center”
},
{
“value”: “logoLeft”,
“label”: “Logo left”
}
],
“default”: “inline”
},
{
“type”: “checkbox”,
“id”: “show_icons”,
“label”: “Show icons”,
“info”: “Text for account, search and cart are replaced by icons on desktop.”,
“default”: false
},
{
“type”: “header”,
“content”: “Transparent header”
},
{
“type”: “checkbox”,
“id”: “enable_transparent_header”,
“label”: “Enable on homepage”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “enable_transparent_header_collection”,
“label”: “Enable on collection pages”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “show_transparent_header_border”,
“label”: “Show separation border”,
“default”: true
},
{
“type”: “color”,
“id”: “transparent_text_color”,
“label”: “Text/icon color”,
“default”: “#ffffff”
},
{
“type”: “image_picker”,
“id”: “transparent_logo”,
“label”: “Logo image”,
“info”: “200 x 60px .png recommended”
}
],
“blocks”: [
{
“type”: “mega_menu”,
“name”: “Mega menu”,
“settings”: [
{
“type”: “text”,
“id”: “navigation_mega_menu”,
“label”: “Menu item”,
“info”: “Enter menu item to apply a mega menu dropdown. Learn more.”
},
{
“type”: “header”,
“content”: “Image push 1”
},
{
“type”: “image_picker”,
“id”: “push_1_image”,
“label”: “Image”,
“info”: “740 x 460 px .jpg recommended”
},
{
“type”: “text”,
“id”: “push_1_heading”,
“label”: “Heading”,
“default”: “Example heading”
},
{
“type”: “text”,
“id”: “push_1_subheading”,
“label”: “Sub-heading”,
“default”: “Example sub-heading”
},
{
“type”: “url”,
“id”: “push_1_url”,
“label”: “Link”
},
{
“type”: “header”,
“content”: “Image push 2”
},
{
“type”: “image_picker”,
“id”: “push_2_image”,
“label”: “Image”,
“info”: “740 x 460 px .jpg recommended”
},
{
“type”: “text”,
“id”: “push_2_heading”,
“label”: “Heading”,
“default”: “Example heading”
},
{
“type”: “text”,
“id”: “push_2_subheading”,
“label”: “Sub-heading”,
“default”: “Example sub-heading”
},
{
“type”: “url”,
“id”: “push_2_url”,
“label”: “Link”
}
]
}
]
}
{% endschema %}

[Made4uo-Ribe]

Thank you for the information. You can try this.

1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
3. In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

button.SelectButton.Link.Link--primary.u-h8 {
    position: absolute;
    left: 80%;
}

Result:

I hope it help.

[Pan_Kamil]

Thank you so much, it helped!