Below, you’ll find a detailed guide on how to add the Translate WordPress with GTranslate Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Translate WordPress with GTranslate Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Translate WordPress with GTranslate Plugin and the shortcodes it provides:
"Translate WordPress with GTranslate is a powerful plugin that effortlessly translates your WordPress site into multiple languages, making it more accessible to a global audience."
- [GTranslate]
- [gt-link]
Translate WordPress with GTranslate [GTranslate] Shortcode
The GTranslate shortcode is a tool that enables inline translation on your website. It uses the ‘GTranslate’ function to render the shortcode. The function ‘render_shortcode’ takes attributes and sets the position to ‘inline’. It also specifies the wrapper selector as ‘.gtranslate_wrapper’. It then returns the widget code with these attributes. This allows for seamless translation integration.
Shortcode: [GTranslate]
Parameters
Here is a list of all possible GTranslate shortcode parameters and attributes:
position– determines the placement of the GTranslate widget on the pagewrapper_selector– specifies the CSS class of the GTranslate widget wrapper
Examples and Usage
Basic example – The GTranslate shortcode is used to render a translation widget on your website. The basic usage of this shortcode does not require any parameters.
[GTranslate /]Advanced examples
1. Defining the position of the GTranslate widget. You can set the position to ‘inline’ to display the widget within your content. This is achieved by adding the ‘position’ attribute to the shortcode and setting its value to ‘inline’.
[GTranslate position="inline" /]2. Specifying a CSS selector for the GTranslate widget wrapper. If you want to apply custom styles to the widget, you can define a CSS selector for its wrapper. This is done by adding the ‘wrapper_selector’ attribute to the shortcode and setting its value to your desired CSS selector.
[GTranslate wrapper_selector=".gtranslate_wrapper" /]3. Using multiple parameters with the shortcode. You can combine multiple attributes in a single shortcode to customize the GTranslate widget according to your needs. Below is an example where both ‘position’ and ‘wrapper_selector’ attributes are used.
[GTranslate position="inline" wrapper_selector=".gtranslate_wrapper" /]PHP Function Code
In case you have difficulties debugging what causing issues with [GTranslate] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('GTranslate', array('GTranslate', 'render_shortcode'));Shortcode PHP function:
function render_shortcode($atts) {
if(!is_array($atts)) $atts = array();
$atts['position'] = 'inline';
$atts['wrapper_selector'] = '.gtranslate_wrapper';
return self::get_widget_code($atts);
}
Code file location:
gtranslate/gtranslate/gtranslate.phpTranslate WordPress with GTranslate [gt-link] Shortcode
The GTranslate plugin shortcode enables dynamic language selection on your website. It renders a single language item, allowing users to switch languages instantly. The shortcode uses the ‘render_single_item’ function, which checks the attributes passed and generates the appropriate language link based on the user’s selection. It supports different widget looks, including language names, codes, and flags. The shortcode also ensures optimal performance by loading necessary scripts only once. In summary, this shortcode enhances your website’s multilingual capabilities, providing a seamless user experience.
Shortcode: [gt-link]
Parameters
Here is a list of all possible gt-link shortcode parameters and attributes:
lang– defines the language to be used for translationlabel– sets the text label for the languagewidget_look– determines the appearance of the translation widgetcurrent_wrapper– adds a specific CSS class to the current language
Examples and Usage
Basic Example – The shortcode displays a link to translate the website into a specified language.
[gt-link lang="fr" /]Advanced Examples
Displaying a translation link with a custom label:
[gt-link lang="de" label="Deutsch" /]Specifying the look of the widget to be ‘flags_name’, which will display both the flag and the name of the language:
[gt-link lang="es" widget_look="flags_name" /]Setting a custom class for the current language:
[gt-link lang="it" current_wrapper="custom-class" /]Using the shortcode to display a translation link with a custom label and a specific widget look. The link will translate the website into the specified language and the widget will display the flag and the language name:
[gt-link lang="jp" label="日本語" widget_look="flags_name" /]PHP Function Code
In case you have difficulties debugging what causing issues with [gt-link] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('gt-link', array('GTranslate', 'render_single_item'));Shortcode PHP function:
function render_single_item($atts) {
if(!is_array($atts) or !isset($atts['lang']))
return;
$data = get_option('GTranslate');
self::load_defaults($data);
$lang_code = $atts['lang'];
if(!isset($atts['label'])) {
$lang_array = $data['native_language_names'] ? json_decode(GTranslate::$lang_array_native_json, true) : GTranslate::$lang_array;
$label = $lang_array[$lang_code];
} else {
$label = $atts['label'];
}
$widget_look = isset($atts['widget_look']) ? $atts['widget_look'] : $data['widget_look'];
if(!in_array($widget_look, array('flags', 'flags_code', 'flags_name', 'lang_codes', 'lang_names')))
$widget_look = 'flags_name';
$flag_size = $data['flag_size'];
$flag_src = self::get_flag_src($lang_code);
if(isset($atts['current_wrapper']))
$add_class = $lang_code == $data['default_language'] ? ' class="gt-current-wrapper"' : '';
else
$add_class = $lang_code == $data['default_language'] ? ' class="gt-current-lang"' : '';
switch($widget_look) {
case 'lang_names': $el_code = '<a href="#" data-gt-lang="' . esc_attr($lang_code) . '"' . $add_class . '>' . esc_html($label) . '</a>'; break;
case 'lang_codes': $el_code = '<a href="#" data-gt-lang="' . esc_attr($lang_code) . '"' . $add_class . '>' . esc_html(strtoupper($lang_code)) . '</a>'; break;
case 'flags': $el_code = '<a href="#" data-gt-lang="' . esc_attr($lang_code) . '"' . $add_class . '><img src="' . esc_attr($flag_src) . '" width="' . esc_attr($flag_size) . '" height="' . esc_attr($flag_size) . '" alt="' . esc_attr($lang_code) . '" loading="lazy"></a>'; break;
case 'flags_name': $el_code = '<a href="#" data-gt-lang="' . esc_attr($lang_code) . '"' . $add_class . '><img src="' . esc_attr($flag_src) . '" width="' . esc_attr($flag_size) . '" height="' . esc_attr($flag_size) . '" alt="' . esc_attr($lang_code) . '" loading="lazy"> <span>' . esc_html($label) . '</span></a>'; break;
case 'flags_code': $el_code = '<a href="#" data-gt-lang="' . esc_attr($lang_code) . '"' . $add_class . '><img src="' . esc_attr($flag_src) . '" width="' . esc_attr($flag_size) . '" height="' . esc_attr($flag_size) . '" alt="' . esc_attr($lang_code) . '" loading="lazy"> <span>' . esc_html(strtoupper($lang_code)) . '</span></a>'; break;
}
global $gt_base_loaded;
if(!$gt_base_loaded) {
$gt_base_loaded = true;
$gt_settings = self::load_settings($data);
$unique_id = wp_rand(10000000, 88888888);
// remove excess settings based on widget_look to keep front-end code small
$old_settings = $gt_settings;
$gt_settings = array();
$keep_keys = array('default_language', 'languages', 'url_structure', 'native_language_names', 'detect_browser_language', 'flag_style', 'flag_size', 'alt_flags', 'custom_domains', 'custom_css');
foreach($keep_keys as $key)
if(isset($old_settings[$key]) and $old_settings[$key] !== '')
$gt_settings[$key] = $old_settings[$key];
if($data['enable_cdn']) {
wp_enqueue_script('gt_widget_script_' . $unique_id, 'https://cdn.gtranslate.net/widgets/latest/base.js', array(), '', true);
} else {
$base_path = plugins_url('', __FILE__);
$gt_settings['flags_location'] = wp_make_link_relative($base_path) . '/flags/';
wp_enqueue_script('gt_widget_script_' . $unique_id, $base_path . '/js/base.js', array(), '', true);
}
wp_add_inline_script('gt_widget_script_' . $unique_id, "window.gtranslateSettings = /* document.write */ window.gtranslateSettings || {};window.gtranslateSettings['" . $unique_id . "'] = " . json_encode($gt_settings) . ";", 'before');
}
return $el_code;
}
Code file location:
gtranslate/gtranslate/gtranslate.phpConclusion
Now that you’ve learned how to embed the Translate WordPress with GTranslate Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply