How to make your slider have multilingual support using qtranslate

If you have a multilingual site with slider which uses the featured images for slider images and you want to make it support different slide images depending on the language you might want to follow these simple steps (or you can hack it your way).

Problem one: WordPress doesn’t support multiple featured images.

Solution

  1. Get and install this plugin
  2. Add the following code to your theme (functions.php would be okay)
if (class_exists('MultiPostThumbnails')) {
  $type = 'slides_options';

  $thumb = new MultiPostThumbnails(array(
    'label' => 'Secondary Image',
    'id' => 'secondary-image',
    'post_type' => $type
    )
  );
}
add_image_size('nivo-secondary-image-thumbnail', 960, $nivo_h, true );

Here slides_options is the Custom Post Type which we use for the slider. If you’re not using custom post type for this you can simply change it to ‘post’.

Congrats! Your theme now supports multiple featured images. Hooray!

Now we have to make WordPress display the relevant image for the specific language.

For this purpose we use a function which determines if the default language of qtranslate is used or not and depending on this shows the featured or the secondary image.

function qtranslate_slide() {

 global $post, $q_config;

 $image_id = get_post_thumbnail_id();
 $language = qtrans_getLanguage();
 $upload_dir = wp_upload_dir();
 $image_data = wp_get_attachment_metadata($image_id);
 if ($q_config['default_language'] != $language) {
 if (class_exists('MultiPostThumbnails') && MultiPostThumbnails::has_post_thumbnail('slides_options', 'secondary-image')) :
 MultiPostThumbnails::the_post_thumbnail('slides_options', 'secondary-image', NULL, 'nivo-secondary-image-thumbnail');
 endif;
 }
 else {
   if (file_exists($upload_dir['basedir'].'/'.$image_data['file'])) {
   $image_url = wp_get_attachment_image_src($image_id,'full', true);
   return $image_url;
  }
 }
}

Now we have to change in our code where we display the images for the slider

$thumbnail = wp_get_attachment_image_src(some, arguments, here);

with our function

$thumbnail = qtranslate_slide();

And from now on we can use $thumbnail[0] as url for the relevant language, depending on the chosen language

Simple as this! Good luck!

P.S.: feel free to ask me something about that on twitter – 

!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

8 comments

  1. Could you tell me where i can find this line – $thumbnail = wp_get_attachment_image_src(some, arguments, here);

    ?

    Thanx

    1. This should be found in the template where you display the slider. Usually in header.php or index.php / home.php.

  2. Any tips on what I could do with a slider that has a custom field slider text with the image? Really having issues getting that custom field to translate.

    1. If the content of the custom field is something like this:

      <!--:en-->EN Link<!--:--><!--:bg-->BG Link<!--:--><!--:de-->DE Link<!--:-->


      $link_text = get_post_meta(get_the_ID(), "link-text", true);
      _e($link_text); //This will output the corresponding language.

      Other option is to use different custom field for each language and to request the corresponding. (so link-text-en for en and so on).

      Good luck!

  3. Any idea why I always get another slide without the caption text but with the image name? The default language is okay, but the second one (English) is messed up…

    if (class_exists(‘MultiPostThumbnails’)) {
    new MultiPostThumbnails(
    array(
    ‘label’ => ‘English Slider’,
    ‘id’ => ‘secondary-image’,
    ‘post_type’ => ‘slider’
    )
    );
    }

    function qtranslate_slide() {

    global $post, $q_config;

    $image_id = get_post_thumbnail_id();
    $language = qtrans_getLanguage();
    $upload_dir = wp_upload_dir();
    $image_data = wp_get_attachment_metadata($image_id);
    if ($q_config[‘default_language’] != $language) {
    if (class_exists(‘MultiPostThumbnails’) && MultiPostThumbnails::has_post_thumbnail(‘slider’, ‘secondary-image’)) :
    MultiPostThumbnails::the_post_thumbnail(‘slider’, ‘secondary-image’, NULL, ‘nivo-secondary-image-thumbnail’);
    endif;
    }
    else {
    if (file_exists($upload_dir[‘basedir’].’/’.$image_data[‘file’])) {
    $image_url = wp_get_attachment_image_src($image_id,’full’, true);
    return $image_url;
    }
    }
    }

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.