Archived topic
CSS for Language Toggle
5 replies · Started by Grant on April 1, 2022
Hello,
I have a multisite and have used a Hook in wp_head to create links to other sub-directories - different languages - in the multisite.
I would like to make them look better with some CSS, including adding in a South African flag to each one. Please can you make some suggestions on how best to do this?
Thanks,
Grant
Hi Grant,
Can you link us to your site so we can see your current settings?
Hi Ying,
Sure you can access it here.
Hi there,
if you're happy using HTML then you could do something like this:
<div class="language-selector">
<div class="grid-container">
<a href="https://iafrika.org/xh/"><img src="isiXhosa-flag.jpg" alt="isiXhosa language" width="40" height="40">isiXhosa</a>
<a href="https://iafrika.org/tn/"><img src="Setswana-flag.jpg" alt="Setswana language" width="40" height="40">Setswana</a>
</div>
</div>the <div> elements are there to provide some containment and a language-selector class if you want for CSS styling.
In each of then <a> you have an <img> tag that you will need to update the image urls and Alt tags for.
Works like a charm! Great support as ever, thank you!
Awesome - glad to be of help!
