Update 12/12/14: the steps below also work for WordPress 4.0 and 4.0.1 (latest at time of writing). Checkout Step 5 for more details
One thing that many of us wish WordPress could do better out-the-box is decent multilingual support for manual language translation. There are many options for multi-lingual WordPress sites: translations within a single post, one post for each language, multi-site install etc. Decent WordPress plugin availability seems sparse and limited to a handful of free and paid-for translation plugins.
I was drawn to the popular and highly rated qTranslate by Qian Qin for a recent multilingual WordPress project due to its ability to easily switch between languages within a single post, integration with other plugins and because it is free.
The latest version of qTranslate (2.5.39) however is broken under the latest WordPress (3.9.1 at the time of writing). The majority of the issues with qTranslate seem to have occurred since 3.9, when the updated TinyMCE visual editor was introduced which qTranslate is closely integrated. Solutions to fixing qTranslate are scattered, and I ended up using fixes from a variety of sources before everything fully worked for me.
Here’s the steps I took to fix qTranslate for WordPress which will hopefully save others time. The fixes have been tested with custom post types, posts and pages along with the Advanced Custom Fields ACF plugin for field management. I am unsure how other plugins that may have previously worked with qTranslate have been affected.
It’s a good idea (as always) to backup your WordPress database. Also disable automatic updating of WordPress until you can verify qTranslate is compatible – either in a test environment or until the plugin has been updated to a stable version that has been verified by the community.
Thanks to all those that have done the leg work, all I’ve done here is collate the fixes 🙂
First thing you might notice when installing the latest qTranslate is the following error message, which appears 3-4 times on posts and pages.
This is a quick fix; just edit qtranslate.php and update:
define('QT_SUPPORTED_WP_VERSION', '3.8.1');
to the current version of WordPress, i.e.
define('QT_SUPPORTED_WP_VERSION', '4.0.1');
or even better, we can get qTranslate to use the latest version of WordPress automatically
define('QT_SUPPORTED_WP_VERSION', $wp_version);
This fix however just hides the error message and doesn’t deal with the other underlying issues.
The next thing that was immediately apparent were a number of issues with the TinyMCE text editor when editing pages, posts or custom post types. These include:
To fix these problems, copy and paste the code given on the below link into the 3 corresponding qtranslate plugin files: qtranslate_hooks.php, qtranslate_javascript.php, qtranslate_wphacks.php
https://gist.github.com/warenhaus/10990386/
Kudos to Warenhaus who provided these fixes.
If you are using the ACF plugin for field management along with the corresponding acf-qtranslate plugin, you may soon notice a problem with ACF text areas and editor fields overwriting the content in the main visual editor. This is caused by a JavaScript issue that incorrectly grabs and writes the content from other text areas into the main editor when working within the ‘Visual’ editing mode.
For this fix, check out Maximbelov’s comment on this thread. Line numbers might differ slightly but the search and replace on the 2 lines of code mentioned within qtranslate_javascript.php fixes the overwriting issue.
If you find TinyMCE doesn’t have enough depth, you can change the height to an arbitrary value using the following function in functions.php
function wptiny($initArray){ $initArray['height'] = '300px'; return $initArray; } add_filter('tiny_mce_before_init', 'wptiny');
Since the WordPress 4.0 release, an additional piece of code is required to fix a conflict with the editor expand feature and the ‘add media’ button. Thanks to Guillaume for this solution!
// Deregister editor-expand as it breaks CKEditor integration function custom_deregister_editor_expand() { wp_deregister_script('editor-expand'); } add_action( 'admin_init', 'custom_deregister_editor_expand' );
Big thx guys. Good information in one place! Keep up grouping.
I forgot to describe the system. I use:
WP 3.9.1
qTranslate 2.5.39
Problem:
Version incompatibility
Visual editor tab in CMS
Editor height.
Conclusions:
Corrected 3 files that are listed in this article, problems have been resolved.
Thank you! Your tutorial help me so much. 🙂
thank you very much!!!!!!!!!!!!!!!!!!!!!!
Tanks for this hacks!
Dear Tom thanks for your great help -as non profit art gallery the hole staff only works pro bonus and our website is elemantary for our work. best heike
Thx for this!
This one used to work till 3.9.x but for the new 4.0 does not work. Do you know any fix?
With WordPress 4.0 there is a problem:
– When clicking to Add media object nothing happens. Also, featured image doesnt work as lightbox its like an usual link.
Any help?
Thanks!
Did you ever find a solution for this?
Also waiting for its solution.
Anyone a solution for the “Add media” not working bottom issue?
Thanks!
Add this to your function.php file 🙂
// Deregister editor-expand as it breaks CKEditor integration
function custom_deregister_editor_expand() {
wp_deregister_script(‘editor-expand’);
}
add_action( ‘admin_init’, ‘custom_deregister_editor_expand’ );
Hi,
In regards to step number 5 can you tell me where exactly in the php file of qtranslate do I add that function. Sorry, I don’t know where it goes… also having problems with my add media button. Thanks!
Thanks a lot! Really fine solution.
Thank you very much! You saved lots of time.
Hi guys,
Copied the before mentioned code in the functions.php but its still not working.
Has anybody experienced this?
Thanks! Really fine solution.
Yes indeed – thanks a lot for this. It has saved a lot of heartache after an Italian agriturismo owner I know tried a manual update and broke his site.
thank you so much my friend
Hi ! thanks for all the tips !
i try to fix the media button problem with @Guillaum ‘s solution but it doesn’t work !
i added in functions.php :
Add this to your function.php file 🙂
// Deregister editor-expand as it breaks CKEditor integration
function custom_deregister_editor_expand() {
wp_deregister_script(‘editor-expand’);
}
add_action( ‘admin_init’, ‘custom_deregister_editor_expand’ );
but not working !
If you have any solution for qtranslate and media button, i will be glad ! thanks
Thank you!
Thanks, thanks, thanks…
I thought I would go crazy with no solution for the editor dissapearing, you have made my day 😉
To fix language switchers position in text-editor, place:
echo “.wp-switch-editor { float:right !important}”; in qtranslate_hooks.php
Thank you so much (thumb)
Hi TOM,
Thank you so much. I am using qtranslate with WP 4.2.2. & I thought I need to rollback to old version. But You saved my lots of work. Thank you so much.
About last (5th) Step: It was not needed for me. As media button was working fine after doing first two steps
Thanks! Saved me a lot of work.
Still have to figure out why the flags aren’t showing anymore (selectors). Any solution to that too?
Thanks!
Very good article!!! It saved lots of time.
Though, I am having 1 issue with TinyMCE Editor height. WordPress 4.2.1 have autoscroll property and when content height is more than TinyMCE area.
How to resolve this issue?
thanks in advance.
Does this wok for qtranslate-x? anyone have an idea?
Hi ! After your steps visual editor dont work anymore in wordpress 4.3.1
I am having problems with visual editor to (WordPress 4.3.1).
Me too….
Same problem: visual button in 4.3.1 doesn’t work (to be honest: didn’t work before these steps after wordpress upgrade, either), regardless if qTranslate is enabled or not.
Also having a problem with the visual editor (wysiwyg mode cant be enabled)
btw: is qtranslate-x the new qtranslate??
Hello, same problem here.. Have anyone found a solution?
Thanks, regards,
Did somebody find a fix for 4.3.1 ???
hi all i install qtranlate-x ,but when i add menu it not working, i using wordpress 4.4.2
Thank you!