I had a big trouble to enable Right-to Left support for masonry scripts that come from Visual Composer Page Builder plugin for WordPress. If you have a multilingual website that switches from LTR to RTL it becomes a really big problem.
On a one language website you can edit scripts and remember that on update, it’s probably to hard to change inner scripts of Composer. But now we’ll have a script that works well, when you switch from LTR masonry to RTL.
Put it in functions.php of your WordPress theme.
// masonry for rtl
function rtl_masonry_switch(){
if ( is_rtl() && is_plugin_active( 'js_composer/js_composer.php' ) ) {
?>
<script type="text/javascript">
jQuery(window).load(function() {
if (jQuery.fn.masonry) {
window.setTimeout(function() {
if (jQuery(window).width() > 767) {
jQuery('.vc_masonry_media_grid .vc_pageable-slide-wrapper').masonry({
isOriginLeft: false,
});
}
},1000);
}
jQuery(window).resize(function() {
if (jQuery.fn.masonry) {
if (jQuery(window).width() > 767) {
jQuery('.vc_masonry_media_grid .vc_pageable-slide-wrapper').masonry({
isOriginLeft: false,
});
}
}
}).trigger('resize');
});
</script>
<?php
}
}
add_action('wp_footer', 'rtl_masonry_switch');
This code will add script to the footer of your theme to modify masonry gallery of Visual Composer for Right-to-Left languages.
It may be used for masonry post grids as well, but you’ll need to change container classes. Also you may need to align text to the right with CSS inside grid items, + you probably should have columns grid adjusted to RTL too, like float:right for the columns.
The script is not ideal, it’s dependent on page loading speed etc., but could you suggest a better one? I guess this issue with masonry switch should somehow be resolved with the use of wp_localize_script… But since it’s hidden somewhere in Visual Composer, don’t know how to access it.
