I am trying to show an SVG image based on Forum language. I would like to know the best way to complete this.
I have tried putting the SVG content in custom text. I would also like to know if this can be showen by using the language api check.
In the meantime i will try to just upload the svg files as images and try based on custom text that way.
One possible solution would be going the CSS skin styling route and rely on the lang attribute on the root <html> object, e.g.
html[lang="de"] .lia-button-searchForm-action {
background-image: url(/html/assets/icon_search-german.svg);
}or even encode the SVG inline
html[lang="fr"] .SearchForm.lia-form-inline .lia-button-searchForm-action {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.4 21'%3E%3Cg fill=' %23000 ' fill-rule='evenodd' stroke=' %23000 '%3E%3Ccircle cx='8' cy='8' r='7.5' fill='none' /%3E%3Cpath d='M14.24 13.15l6.85 6.17c.38.35.4.94.05 1.34-.34.4-.94.43-1.33.07l-6.9-6.2c.48-.4.92-.85 1.32-1.38z'/%3E%3C/g%3E%3C/svg%3E");
}
If you want to build it in a Freemarker component you should be able to obtain the current user's profile language via:
<#assign userLanguage = rest("/users/id/${user.id}/settings/name/profile.language").value>
