Theme elements do not scale on translated string size

[nunomps]

Hi,

I’m having a big challenge on a showstopper feature that is a “must”. We’ve integrated a translation feature on the website. When opening a link (such as http://margaridamoreira.com/about/) and we view it, all elements look accordingly to the Swift Page Builder (specifically speaking of the spacings in this case). Then when selected another language, the strings are correctly changed but the elements do not adapt to the new size of each string. How can we fix this? Maybe having it recalculating the elements (like, refreshing)?

Examples:
https://trello-attachments.s3.amazonaws.com/54e9b69a78ffeaccd58940aa/1366×643/3f4b98a35b5744dd1e5d100d75ad55f1/pt_cortado.png

https://trello-attachments.s3.amazonaws.com/54e9b69a78ffeaccd58940aa/893×604/723c3401203ac636ff8d28139f5059f9/elemento_pt_cortado.png

Best,
Nuno

[Kyle – SUPPORT]

Hi

I’m afraid this is the plugin, it would have to be coded in the plugin to refresh the page when changing language, there’s nothing we can do about that

– Kyle

[nunomps]

This reply has been marked as private.

[Kyle – SUPPORT]

I will forward this to the developer for you

– Kyle

[Swift Ideas – Ed]

@nunomps – as far as I’m concerned, it should be their job to trigger the global window resize function as soon as the plugin has changed the text.

If you check the theme by resizing the browser after swapping language, the theme adapts just fine.

– Ed

[nunomps]

Hi there Ed,

I pushed him further on this. He asked me to convey this to you, for a fast solution:

Hello,

you should understand the theme you’re using is not fluid. When the page loads, it runs some script to adjust the positions of the posts. For instance, a post is dynamically styled like this:

opacity: 1; position: absolute; left: 0px; top: 3066px;

Is impossible for me to know what script is running, and I’m not going to spend trying to figure out something that doesn’t belong to the translation plugin.

I don’t really understand why the theme author doesn’t simply tell you what’s the name of script that is running to adjust this. It’s really simply. Then it has to be used in the way I told you before.

Do you understand this is a theme thing? The theme is not fluid, it uses a script to dynamically adjust the position. All themes are built differently, correctly, they are fluid, it means, doesn’t matter if you write more than 2 lines, the layout will just expand by itself, it doesn’t need a hack.

Contact them again, and tell them to tell you the name of the script that adjust the position of the posts. Is that simple.

Cheers,
Fred

Any chance you could help me on the script he named? I really just want to fix this fast……

Best,
Nuno

[Swift Ideas – Ed]

We could argue for days about this. The plugin is changing content. It is therefore the plugins responsibility to trigger a window resize trigger as it is altering the content of the page. The theme sets the height of the asset for a reason, not just willy nilly, and it’s ridiculous to suggest that it would be the theme’s responsibility to somehow predict this. The script used by the theme that he is referring to is jQuery Isotope, arguably the most popular masonry plugins on the internet. Not being funny, but I’m unsure how he doesn’t see this as a responsibility of his plugin – it’s naive in assuming the content will always be contained within fluid containers. With the huge amount of other plugins out there that you could possibly be using, a simple window resize trigger, one line of code, is all it needs on the translation complete callback.

If you turn off the vertical entering option in the rows on your about page, then this issue will go away. It doesn’t look like you need it in this case, but there isn’t anything you can do to adjust the blog asset – other than not use masonry.

– Ed

[nunomps]

Hey,

We use Trello for project management. Right now this issue is our only showstopper-ticket there and too much time consuming up until now, we’re archiving it for now and leaving this like it is since neither way we have support to solve this – until some latter time when we have a much higher traffic. Out of respect for both teams, I’m showing you here the last reply.

Hello,

that’s all very nice.

…a simple window resize trigger, one line of code, is all it needs on the translation complete callback.

Once again, tell them to tell you what’s that simple line of javascript code. That’s all we need, not hundreds of lines of words saying nothing useful.

Thank you for your kind time replying and attempting to see through our issue though, we appreciate it.

Best,
Nuno

[Swift Ideas – Ed]

Hi Nuno,

They seem like nice people… ha.

Here is the line of code.. Pretty common knowledge:

$(window).trigger('resize');

Would have been found within a few seconds with a quick google on their part.

– Ed

[nunomps]

Heyo!

I forwarded him (he asked me very much not to let it die), here’s the reply:

Hello,

as said before, that code should be placed in:

Advanced > General > Javascript callbacks > On complete callback

So it looks like this:

function(filtered_elements, translation, source, from, to, options, restore) {
jQuery(window).trigger(‘resize’);
}

I’m using jQuery instead of $, because $ doesn’t exist in your website for some reason.

You should also know that this won’t work. The line of code they gave you doesn’t trigger the script to adjust the content. I tried it in both Firefox and Chrome.

So whatever code they have to adjust the position, it doesn’t get triggered by the line of code they gave you. In order to test it they don’t need the translation plugin in any way. Just tell them to use any DOM inspector, to modify the article’s footer “p” node to add more text, and then to run that line from the console.

Sorry, but this isn’t over. They should be able to provide that line of code that actually works.

Cheers,
Fred

We really don’t understand much about programming, we just want our website to work good 🙂

Best,
Nuno, Ivo & Maggie

[Swift Ideas – Ed]

Hi @nunomps

Really sorry for the delay in my reply.

I tested that function before I provided it to you, and it worked 100%.

Just tested your site, and it seems to work now? Have you sorted it?

– Ed