Simple languages switcher study (finger responsive and accessible) for a Textpattern CMS website.


  <div aria-describedby="language-choice" class="lang-outer">
	<h4 class="readers" id="language-choice">Language selector:</h4>
	<ul role="listbox" aria-label="Languages" aria-haspopup="true" tabindex="0" class="langs">
		<li role="img" aria-label="<txp:text item="toggle_all_selected" />">🌍</li>
		<txp:section_list sort="name asc" active_class="active" break=""><txp:evaluate query='string-length("<txp:section />") < 3'>	<li role="option"<txp:if_section name='<txp:section />'> class="active"</txp:if_section>><a href="<txp:site_url /><txp:section />" aria-label="<txp:section />" <txp:if_section name='<txp:section />'> aria-current="true"</txp:if_section> lang="<txp:section />"><txp:section /></a></li>
	</txp:evaluate></txp:section_list></ul>
</div>

Languages switcher:

- DE
- EN
- FR