Hiding Google Translate bar?

 To hide the Google Translate bar in a blog, you can use CSS to target and hide the specific elements associated with the translation bar. Here's an example of how you can achieve this:

Identify the elements: Inspect the Google Translate bar on your blog using your web browser's developer tools. Look for the specific HTML elements that make up the translation bar. Typically, it consists of a wrapper div and an iframe.

Hiding Google Translate bar

Add custom CSS: Once you have identified the elements, you can add custom CSS styles to hide them. Open your blog's CSS file or theme editor and add the following CSS rules:

  body {
     top: 0px !important;

    body > .skiptranslate > iframe.skiptranslate {
     display: none !important;
     visibility: hidden !important;
or try this Code
/* Hide the Google Translate wrapper div */
.google-translate-wrapper {
  display: none !important;

/* Hide the Google Translate iframe */
.goog-te-banner-frame {
  display: none !important;

Save and update your blog: Save the changes to your CSS file or theme editor and update your blog. The Google Translate bar should now be hidden.

Please note that the specific class names used in the CSS example may vary depending on the implementation of the translation bar on your blog. You may need to inspect the elements on your blog and update the CSS selectors accordingly.

It's important to keep in mind that hiding the Google Translate bar may violate the terms of service of the Google Translate service. Make sure to review the terms and conditions of the service before hiding or modifying any elements related to it on your blog.

Post a Comment

Previous Post Next Post