Disable Automatic Translation of WordPress Theme Elements

How to stop automatic translation on wordpressDisable translation for specific wordpress elementsPrevent google translate on wordpress siteExclude parts of wordpress site from translationStop automatic translation of wordpress theme elementsHow to prevent browser translation on wordpressWordpress disable translation for certain contentHow to exclude wordpress pages from translationPrevent automatic translation on wordpressWordpress stop google translate from activating

Explanation

If you want to stop certain parts of your WordPress site from being automatically translated by services like Google Translate, this code snippet is your friend. It adds a special class called notranslate to specific elements, telling translation services to skip them.

Here's how it works:

Custom CSS: The code hooks into the wp_head action to add a bit of CSS that tells browsers not to translate anything with the notranslate class.
Content: It uses the the_content filter to automatically add the notranslate class to all paragraph tags (<p>) in your posts and pages.
Menus: The wp_nav_menu_items filter is used to add the notranslate class to all menu items, ensuring your navigation stays as you intended.
Widgets: By using the widget_text filter, the code wraps all widget text in a div with the notranslate class, keeping your sidebar content untouched by translation.

This approach is handy if you have specific content that should remain in its original language, like brand names or technical terms. Just pop this code into your theme's functions.php file, and you're good to go!

Code
<?php
/**
 * Prevent automatic translation for specific WordPress elements.
 * This snippet adds a 'notranslate' class to specified elements to stop translation services like Google Translate.
 */

// Hook into 'wp_head' to add custom CSS for disabling translation
add_action('wp_head', 'wp_dudecom_add_no_translate_css');

function wp_dudecom_add_no_translate_css() {
    echo '<style>
        .notranslate {
            translate: no;
        }
    </style>';
}

// Add 'notranslate' class to specific elements using 'the_content' filter
add_filter('the_content', 'wp_dudecom_add_no_translate_class_to_content');

function wp_dudecom_add_no_translate_class_to_content($content) {
    // Example: Add 'notranslate' class to all <p> tags
    $content = preg_replace('/<p>/', '<p class="notranslate">', $content);
    return $content;
}

// Add 'notranslate' class to specific elements using 'wp_nav_menu_items' filter
add_filter('wp_nav_menu_items', 'wp_dudecom_add_no_translate_class_to_menu_items', 10, 2);

function wp_dudecom_add_no_translate_class_to_menu_items($items, $args) {
    // Example: Add 'notranslate' class to all menu items
    $items = preg_replace('/<li/', '<li class="notranslate"', $items);
    return $items;
}

// Add 'notranslate' class to specific widgets using 'widget_text' filter
add_filter('widget_text', 'wp_dudecom_add_no_translate_class_to_widgets');

function wp_dudecom_add_no_translate_class_to_widgets($text) {
    // Example: Add 'notranslate' class to all widget text
    $text = '<div class="notranslate">' . $text . '</div>';
    return $text;
}
?>

Instructions

File Location: Add the code to your theme's functions.php file.

Prerequisites: None required.

Implementation Steps:

Access your WordPress admin dashboard.
Navigate to Appearance > Theme Editor. If you see a warning about editing files directly, proceed with caution.
In the right sidebar, locate and click on functions.php to open it for editing.
Scroll to the bottom of the functions.php file and paste the provided code snippet.
Click the Update File button to save your changes.
Visit your website to ensure that the specified elements are no longer automatically translated.

If you encounter any issues or need further assistance with this implementation or more advanced functionality, consider reaching out to wp-dude.com for expert help.