Archives
Contributors
Re: "Translating" pictures in website breaks website editor - any workaround?
> Yes! That's exactly that option that made me feel stupid in the back of my > head... > Not optimal in my opinion but better than nothing. under the hood this sets the html lang attribute [1] of the element, that's pretty optimal in the html sense of things in my opinion. I guess you don't want to have users in the editor have to put in all translated img's there? Then I'd suggest to have the users follow a naming scheme for those images, if en_US is the base language, it's /images/en_US/${some_name}.png and in https://github.com/OCA/OCB/blob/17.0/odoo/addons/base/models/ir_qweb.py#L562 you check the current language, if it's not en_US you go and search for //img[starts-with(@src, '/images/en_US/')] and replace that with /images/${language}/${some_name}.png Or do the same thing on the client side with JS. Or generate CSS replacement rules where you hide the en_US image and put the $language image there instead. I assume you've already considered using one SVG and do the text part there where you can also set a lang attribute? Not feasible for a lot of things, but if you generate those images automatically anyways, that might be the way. [1] https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang -- Your partner for the hard Odoo problems https://hunki-enterprises.com
by Holger Brunn - 04:01 - 20 Dec 2023
Reference
-
"Translating" pictures in website breaks website editor - any workaround?
Hello everyone, sorry for non-development question but this is really so specific I cannot imagine anyone besides experts here would be able to answer. A client has a website where on few pages there is a picture that needs to be different for different language version (because it contains embedded text in that language). The way we came out to deal with this is adding something like <t t-set="image_url" t-value="url_of_the_picture_in_default_language"/> before the image itself and then in the image itself something like <img t-att-href="image_url"/> This way the URL value can be translated to other languages. While it works as planned unfortunately it breaks the website editor - some JS error appears and the component palette won't be loaded :-( I have a stupid feeling I am missing some other obvious option. Any ideas please? Best regards Radovan Skolnik
by Radovan Skolnik - 07:15 - 19 Dec 2023