pwired Posted January 3, 2016 Share Posted January 3, 2016 Hi, A page that I am working on will have to look like the screenshot I made of it below. As you can see it has a lot of text parts all around a picture. All these text parts have to become multi-language. What is the best way of doing this ? Making fields for every text part ? That would be cumbersome. And how would I position all these text parts ? Position absolute ? I wish this was possible directly in CKEditor but so far I would not know how. Maybe setup a table in CKEditor and put all the text parts in table cells ? Link to comment Share on other sites More sharing options...
BitPoet Posted January 4, 2016 Share Posted January 4, 2016 Wow, that's quite the task you've picked for yourself there. For translations, I'd probably go the way of an include and translate the contained strings in the backend. Positioning will have to be absolute. I've done something a bit like that two years ago (adding detailed, multi-language legends to automatically generated test charts with dynamic scales), though not in PW. Allowing users to edit that on the fly was a rather involved thing, and in the end, I had to implement my own wysiwyg editor with canvas rendering, text measuring in javascript and manual wrapping... went way above the time budget I had estimated. It's really a question of how dynamic you need it to be and if you need the text as real text at all. Is manual creating of the images (and just including the correct image for the language) an option? If not and it's just translations, I'd create an individual template and edit that outside PW, then just pull the translations (perhaps with a text formatter that pulls the real text from placeholders to keep the template concise). A repeater with a column for the placeholder and a language text field could let others edit the texts while you only have to see about the layout. If you need it more dynamic, you could also use the repeater (no need for placeholders then) and also save text coordinates and arrow placements, then use JS for the arrows in the frontend and generate the markup with positioning in the template. That will, of course, mean for you to determine and type in all the coordinates. It might be okay if you're the only one doing it. I think I saw a discussion somewhere in the forums a few weeks ago where a table-like (repeater?) input locked some fields for non-superusers. Worth a thought. If there's really a huge and dynamic variety of images to illustrate and the budget's there, a custom fieldtype + inputfield with point-and-click type functionaly may be an option. But then you're at the point where I was, building your custom wysiwyg editor in JS... 1 Link to comment Share on other sites More sharing options...
pwired Posted January 4, 2016 Author Share Posted January 4, 2016 Is manual creating of the images (and just including the correct image for the language) an option? Yes I will go for that option. Just make different pictures for different languages with the text language part of the picture. Link to comment Share on other sites More sharing options...
pwired Posted January 4, 2016 Author Share Posted January 4, 2016 After some forum digging I found this post about "children as areas" from Diogo: https://processwire.com/talk/topic/4487-homepage-with-multiple-content-areas/ I will give this a try as well. Link to comment Share on other sites More sharing options...
clsource Posted January 5, 2016 Share Posted January 5, 2016 That looks like and iPad app. Are you using some framework like Ionic? Link to comment Share on other sites More sharing options...
Recommended Posts