Hi Guys Welcome Again To SK PROJECT HIVE BLOG.
If You Using Default Google Translater In Blogger And You Don't Need To Use It Again Then This Post Will Help You.
You Need To Add Some Code In Your Blogger Template.
How Add It
Go Your Blogger Dashboard >Theme>Edit HTML And Paste This Code's.
Now find ]]></b:skin> and paste this CSS just above it
/* Google Translate CSS */ #google_translate_element{padding:0;margin-right:5px} .goog-te-banner-frame.skiptranslate,.goog-te-gadget-simple img,img.goog-te-gadget-icon,.goog-te-menu-value span{display:none!important} .goog-te-menu-frame{box-shadow:none!important} .goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg style='fill:none;stroke:%2308102b;stroke-linecap:round;stroke-linejoin:round'%3E%3Cpath d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' /%3E%3Cpath d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' /%3E%3Cline x1='17' x2='13.5' y1='19.5' y2='23.5' /%3E%3Cline x1='14.5' x2='21.5' y1='10.5' y2='10.5' /%3E%3Cline x1='17.5' x2='17.5' y1='9.5' y2='10.5' /%3E%3Cpath d='M20,10.5c0,1.1-1.77,4.42-4,6' /%3E%3Cpath d='M16,13c.54,1.33,4,4.5,4,4.5' /%3E%3Cpath d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' /%3E%3C/g%3E%3C/svg%3E") center / 12px no-repeat;background-size: 20px 20px;display:inline-block;font-weight:400;line-height: 1.8;padding:0 6px;text-align:center;white-space:nowrap;vertical-align: middle;-ms-touch-action: manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select: none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-left:none!important;border-top:none!important;border-bottom:none!important;border-right:none!important;border-radius: 4px} body{top:0px!important} .darkMode .goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg style='fill:none;stroke:%23fefefe;stroke-linecap:round;stroke-linejoin:round'%3E%3Cpath d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' /%3E%3Cpath d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' /%3E%3Cline x1='17' x2='13.5' y1='19.5' y2='23.5' /%3E%3Cline x1='14.5' x2='21.5' y1='10.5' y2='10.5' /%3E%3Cline x1='17.5' x2='17.5' y1='9.5' y2='10.5' /%3E%3Cpath d='M20,10.5c0,1.1-1.77,4.42-4,6' /%3E%3Cpath d='M16,13c.54,1.33,4,4.5,4,4.5' /%3E%3Cpath d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' /%3E%3C/g%3E%3C/svg%3E") center / 12px no-repeat;background-size: 20px 20px} .headerIcon .gtWgt.gtHide{display:none} .headerIcon .gtWgt .gtIcon{position:absolute;background-color:var(--header-bg)} .darkMode .headerIcon .gtWgt .gtIcon{background-color:var(--dark-bg)} .postComments.gtHide .gtWgt{display:none} .postComments.gtHide .shrBtn{margin-right:0} .postComments .gtWgt .gtLoad{position:relative} .postComments .gtWgt .gtIcon{position:absolute;background-color:var(--body-bg)} .postComments .gtWgt #google_translate_element{margin-right:0} .darkMode .postComments .gtWgt .gtIcon{background-color:var(--dark-bg)} .postComments .gtWgt .gtIcon .goog-te-gadget-simple{background-color:transparent!important;background-size: 18px 18px} .postComments .gtWgt .gtIcon .goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg style='fill:none;stroke:%2348525c;stroke-linecap:round;stroke-linejoin:round'%3E%3Cpath d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' /%3E%3Cpath d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' /%3E%3Cline x1='17' x2='13.5' y1='19.5' y2='23.5' /%3E%3Cline x1='14.5' x2='21.5' y1='10.5' y2='10.5' /%3E%3Cline x1='17.5' x2='17.5' y1='9.5' y2='10.5' /%3E%3Cpath d='M20,10.5c0,1.1-1.77,4.42-4,6' /%3E%3Cpath d='M16,13c.54,1.33,4,4.5,4,4.5' /%3E%3Cpath d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' /%3E%3C/g%3E%3C/svg%3E") center / 12px no-repeat;background-size: 18px 18px} .darkMode .postComments .gtWgt .gtIcon .goog-te-gadget-simple{background-color:transparent!important;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg style='fill:none;stroke:%23d1d1d1;stroke-linecap:round;stroke-linejoin:round'%3E%3Cpath d='M.5,2V18A1.5,1.5,0,0,0,2,19.5H17L10.5.5H2A1.5,1.5,0,0,0,.5,2Z' /%3E%3Cpath d='M12,4.5H22A1.5,1.5,0,0,1,23.5,6V22A1.5,1.5,0,0,1,22,23.5H13.5l-1.5-4' /%3E%3Cline x1='17' x2='13.5' y1='19.5' y2='23.5' /%3E%3Cline x1='14.5' x2='21.5' y1='10.5' y2='10.5' /%3E%3Cline x1='17.5' x2='17.5' y1='9.5' y2='10.5' /%3E%3Cpath d='M20,10.5c0,1.1-1.77,4.42-4,6' /%3E%3Cpath d='M16,13c.54,1.33,4,4.5,4,4.5' /%3E%3Cpath d='M10.1,7.46a4,4,0,1,0,1.4,3h-4' /%3E%3C/g%3E%3C/svg%3E") center / 12px no-repeat;background-size: 18px 18px}
Then find </body> and paste this javascript just above it
<!--[ Google Translate Script ]--><script>/*<![CDATA[*/ var lazyts=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyts||0!=document.body.scrollTop&&!1===lazyts)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyts=!0)},!0); /*]]>*/</script><script>/*<![CDATA[*/ function googleTranslateElementInit(){new google.translate.TranslateElement({pageLanguage:'en',includedLanguages:'en,hi,gu,bn,ta,te,mr,ne,ml',layout:google.translate.TranslateElement.InlineLayout.SIMPLE},'google_translate_element')}; /*]]>*/</script>
"Don't forget to change highlighted en with your default blog language code and add your languages codes on highlighted en,hi,gu,bn,ta,te,mr,ne,ml add other languages by adding"
Then add this HTML code anywhere that you want to show Google translate button example: header
<!--[ Google Translate Button ]--><div id='google_translate_element'/>
Then save HTML
Now you successfully installed Google translate with lazy load!