How to add Translate button above the main menu or any place of website.

When a visitor comes to a website, the content of the website as well as the design of the website is targeted and when the design of the content of the website is understandable or easily mastered by the visitor, the visitor follows the website and you get a permanent visitor.

Add Custom Google translate

Basically, since websites are written in one language, it is difficult understandable for all visitors from all over the world , and even if they understand a little, they are usually not permanent.

However, Google Translate is an easy way to get permanent visitors to all countries of the world.

If Google Translate is installed on your website, visitors can at any time translate your website in their own language to understand your content.

As a result, the visitor will be interested in visiting your website in the future and will definitely subscribe to your website if your content is useful.

For this reason, just as you get the visitors from all over the world and they also to be permanent.

Let's see, how to install Google Translate button on the website.

Usually Google Translate button we can install in a few places on the website. It can be done in two ways. One of these methods is simple and the other will be a little difficult for the general blogger to do through HTML. Although this method is little difficult, I would suggest those, who have some idea about HTML to adopt this method.

1. First let's talk about the simple method.

In this way we can add Google Translate to the "sidebar" or "footer" of Blogger.

≻ The easiest way is to first open Blogger's admin panel and then go to the "layout" option.

≻ Then you have to click on the "add a Gadget" option in the place where you want to add "Google Translate" in your layout.

≻ You have to select the "translate" from the gadget options.

≻ Now you have to type the "title" of the gadget and select any option you like in "style" and save it.

≻ Now that, you need to "save" the theme.

The first and easiest method is done.

2. Second Method.

Although the second method is a bit difficult than the first method, it will be the best method for those who understand HTML and CSS lightly.

Because if you install Google Translate in this way, you can show it anywhere you want. This is the way, for the visitor easily to see the "Google Translate" option to help to translate it into their own language.

In the video below, I have shown how to install Google Translate by this method in a very simple way. If you can watch the video and put the "coding" below in the right place, you can install "Google Translate."

HTML Code:

Step 1. Copy these code(Use the Copy button below) and paste between <head> and </head> . I placed it above the </head> .

function googleTranslateFunction(){

new google.translate.TranslateElement({pageLanguage:'hi', layout:google.translate.TranslateElement.InlineLayout.SIMPLE},'google_translate_element');

} </script>

//<![CDATA[

(function(){var gtConstEvalStartTime = new Date();/*

SPDX-License-Identifier: Apache-2.0

var h=this||self,l=/^[\w+/_-]+[=]{0,2}$/,m=null;

function n(a){

return(a=a.querySelector&&a.querySelector("script[nonce]"))&&(a=a.nonce||a.getAttribute("nonce"))&&l.test(a)?a:""

}

function p(a,b){

function c(){}c.prototype=b.prototype;

a.i=b.prototype;a.prototype=new c;

a.prototype.constructor=a;

a.h=function(g,f,k){

for(var e=Array(arguments.length-2),d=2;

d<arguments.length;d++)e[d-2]=arguments[d];

return b.prototype[f].apply(g,e)

}

function q(a){return a};

function r(a){

if(Error.captureStackTrace);

else{var b=Error().stack;b&&(this.stack=b)}a&&(this.message=String(a))

}

r.prototype.name="CustomError";

function u(a,b){

a=a.split("%s");

for(var c="",g=a.length-1,f=0;

f<g;f++)c+=a[f]+(f<b.length?b[f]:"%s");

r.call(this,c+a[g])

}

p(u,r);

u.prototype.name="AssertionError";

function v(a,b){

throw new u("Failure"+(a?": "+a:""),Array.prototype.slice.call(arguments,1));

};

var w;

function x(a,b){this.g=b===y?a:""}x.prototype.toString=function(){return this.g+""};var y={};

function z(a){

var b=document.getElementsByTagName("head")[0];b||(b=document.body.parentNode.appendChild(document.createElement("head")));

b.appendChild(a)

}

function _loadJs(a){

var b=document;

var c="SCRIPT";"application/xhtml+xml"===b.contentType&&(c=c.toLowerCase());

c=b.createElement(c);

c.type="text/javascript";

c.charset="UTF-8";

if(void 0===w){b=null;var g=h.trustedTypes;

if(g&&g.createPolicy){

try{b=g.createPolicy("goog#html",{createScriptURL:q})}

catch(t){h.console&&h.console.error(t.message)}w=b}

else w=b

}

a=(b=w)?b.createScriptURL(a):a;a=new x(a,y);a:{

try{

var f=c&&c.ownerDocument,k=f&&(f.defaultView||f.parentWindow);k=k||h;

if(k.Element&&k.Location){var e=k;break a}}

catch(t){}e=null}

if(e&&"undefined"!=typeof e.HTMLScriptElement&&(!c||!(c instanceof e.HTMLScriptElement)&&(c instanceof e.Location||c instanceof e.Element))){

e=typeof c;

if("object"==e&&null!=c||"function"==e)

try{}

catch(t){}

else d=void 0===c?"undefined":null===c?"null":typeof c;v()

}

a instanceof x&&a.constructor===x?d=a.g:(d=typeof a,v("expected object of type TrustedResourceUrl, got '"+a+"' of type "+("object"!=d?d:a?Array.isArray(a)?"array":d:"null")),d="type_error:TrustedResourceUrl");c.src=d;

(d=c.ownerDocument&&c.ownerDocument.defaultView)&&d!=h?d=n(d.document):(null===m&&(m=n(h.document)),d=m);

d&&c.setAttribute("nonce",d);z(c)

}

function _loadCss(a){

var b=document.createElement("link");

b.type="text/css";b.rel="stylesheet";

b.charset="UTF-8";b.href=a;z(b)

}

function _isNS(a){

a=a.split(".");

for(var b=window,c=0;c<a.length;++c)if(!(b=b[a]))return!1;

return!0

}

function _setupNS(a){

a=a.split(".");

for(var b=window,c=0;c<a.length;++c)b.hasOwnProperty?b.hasOwnProperty(a)?b=b[a]:b=b[a[c]]={}:b=b[a]||(b[a]={});

return b

}

if (_isNS('google.translate.Element')){return}(function(){

var c=_setupNS('google.translate._const');

c._cest = gtConstEvalStartTime;gtConstEvalStartTime = undefined;c._cl='en';

c._cuc='googleTranslateFunction';

c._cac='';c._cam='';c._ctkk='447972.1887378764';

var h='translate.googleapis.com';

var s=(true?'https':window.location.protocol=='https:'?'https':'http')+'://';

var b=s+h;c._pah=h;c._pas=s;c._pbi=b+'/translate_static/img/te_bk.gif';

c._plla=h+'/translate_a/l';c._ps=b+'/translate_static/css/translateelement.css';

c._puh='translate.google.com';

_loadCss(c._ps);_loadJs(b+'/translate_static/js/element/main.js');})();})();

//]]>

</script>

Step 2. Copy these code(Please select these code manually) and paste where you want to show "Google Translate" button. I placed it above the main menu.

</div>

CSS Code :

Step 3. You need to generate CSS code about which design you like, and which look at pretty. Then you need to add after CSS design data code.

( I recommend you to see the video which embed above . )

≻ My used Code(If needed Please select these code manually)

.translate {

margin: 13pt;

}

div#\:0\.targetLanguage {

font-size: 13pt;

font-weight: bold;

background-color: #e4e2ff;

}

span {

color: #000000;

}

Learn more:

*How to create textbox for coding/text in blogger post. Three easy and better ways.

*How to add your own credit in blogger footer.

*Unleashing Online Prosperity: The Most Effective Ways to Earn Money.

" Thank you to Stay with us "

How to add Translate button above the main menu or any place of website.

1. First let's talk about the simple method.

2. Second Method.

Learn more:

People also ask :

Post a Comment

Translate to your Own language

Search This Blog

Popular

How to Earn money from Online: Idea of Digital Income.

Unleashing Online Prosperity: The Most Effective Ways to Earn Money.