Skip to content

component

Language Icon Toggle

By Mikiko Niwa

Details

Summary

SEO-ready toggle for multi-language site

Description

About this Component A compact language switcher that reveals a text-based selector when you click or hover the globe icon. Each language links to its own page — no auto-translation, full control, and SEO-friendly by design. Key Features Globe icon expands a text-based language selector on click or hover Supports up to 5 languages (A & B always visible; C–E optional) Choose between click or hover trigger "Close on select" option available Smooth expand/collapse and indicator slide animation Link each language to its own page URL Keyboard and screen reader accessible Event callback for connecting with other components Customization Light mode / Dark mode colors configurable separately (auto-switches with data-framer-theme) Globe size, gap, border width, and font adjustable from the property panel 30 language presets + custom language code input SEO-Friendly Multilingual Structure This component does not dynamically switch text within a single page. Instead, each language is managed as a separate page, which makes it well-suited for: Country- and language-specific SEO Proper search engine indexing Clear and scalable multilingual site structures This approach is especially effective for SEO-conscious multilingual websites. Important Note This component does not include any translation functionality. It is designed purely as a toggle UI for switching between language-specific pages , not for translating content automatically.

Introduction

SEO-ready toggle for multi-language site

Rank history

Daily rank per list, from the first snapshot — lower is better.

110012001300131188/148/228/309/79/15
  • All · #2853