**** JS - FOOTER<style type="text/css">
/* Ẩn Google Translate bar */
.goog-te-banner-frame,
.goog-logo-link,
.goog-te-gadget {
display: none !important;
}
/* Ẩn toàn bộ Google Translate */
.skiptranslate {
display: none !important;
}
/* Fix lỗi bị đẩy trang xuống */
body {
top: 0 !important;
}
</style>
<script>
window.__gt_inited = false;
function googleTranslateElementInit() {
if (window.__gt_inited) return;
window.__gt_inited = true;
new google.translate.TranslateElement({
pageLanguage: 'en',
autoDisplay: false
}, 'google_translate_element');
}
function changeLang(lang) {
var langMap = {
'vi': 1,
'en': 2,
'ja': 3,
'ko': 4,
'zh-CN': 5
};
var langNum = langMap[lang] || 1;
/* 🔥 SET COOKIE CHO GOOGLE TRANSLATE */
document.cookie = "googtrans=/en/" + lang + "; path=/";
document.cookie = "googtrans=/en/" + lang + "; path=/; domain=" + location.hostname;
/* COOKIE CHO PHP */
document.cookie = "site_lang=" + lang + "; path=/; max-age=2592000";
document.cookie = "site_lang_num=" + langNum + "; path=/; max-age=2592000";
/* ⏳ ĐỢI GOOGLE APPLY XONG */
setTimeout(function () {
location.reload();
}, 800);
}
</script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
****FUNCTION PHP
public function languageTop2(){
$lang_num = 2; // mặc định VI
if (isset($_COOKIE['site_lang_num'])) {
$lang_num = intval($_COOKIE['site_lang_num']);
}
if (!in_array($lang_num, array(1,2,3,4,5))) {
$lang_num = 2;
}
$LANG = array(
1 => array(
'content' => '1',
'icon' => 'vi',
'ngonngu' => 'Vietnamese',
),
2 => array(
'content' => '2',
'icon' => 'en',
'ngonngu' => 'English',
),
3 => array(
'content' => '3',
'icon' => 'ja',
'ngonngu' => 'Japanese',
),
4 => array(
'content' => '4',
'icon' => 'ko',
'ngonngu' => 'Korean',
),
5 => array(
'content' => '5',
'icon' => 'zh-CN',
'ngonngu' => 'Chinese',
)
);
**** LẤY GIÁ TRỊ NGÔN NGỮ RA
// echo $LANG[$lang_num]['content'];
// echo $LANG[$lang_num]['icon'];
// echo $LANG[$lang_num]['ngonngu'];
echo'<div class="kigiLanguage">
<div class="languageTop language">
<div class="iconLang">';
echo'<img src="'.$site_live.'themes/'.$ThemeSel.'/images/'.$LANG[$lang_num]['icon'].'.png" alt="'.$LANG[$lang_num]['ngonngu'].'">';
if(!preg_match("/iPhone|iPad|Android|Windows Phone/is", $_SERVER['HTTP_USER_AGENT'])){
echo'<span>'.$LANG[$lang_num]['ngonngu'].'</span>';
}
echo'</div>';
**** Truyền vào JS - Lang - onclick
echo'<div class="popup">
<ul class="lang-switch language">
<li>
<a href="javascript:void(0)" onclick="changeLang(\'vi\')">
<img src="'.$site_live.'themes/'.$ThemeSel.'/images/vi.png"><span>Vietnamese</span>
</a>
</li>
<li>
<a href="javascript:void(0)" onclick="changeLang(\'en\')">
<img src="'.$site_live.'themes/'.$ThemeSel.'/images/en.png"><span>English</span>
</a>
</li>
<li>
<a href="javascript:void(0)" onclick="changeLang(\'zh-CN\')">
<img src="'.$site_live.'themes/'.$ThemeSel.'/images/cn.jpg"><span>Chinese</span>
</a>
</li>
<li>
<a href="javascript:void(0)" onclick="changeLang(\'ja\')">
<img src="'.$site_live.'themes/'.$ThemeSel.'/images/jp.jpg"><span>Japanese</span>
</a>
</li>
<li>
<a href="javascript:void(0)" onclick="changeLang(\'ko\')">
<img src="'.$site_live.'themes/'.$ThemeSel.'/images/kr.jpg"><span>Korean</span>
</a>
</li>
</ul>';
echo'</div>';
echo'</div>';
echo'</div>';
echo'<div id="google_translate_element"></div>';
}
/*** CSS + JS hiệu ứng click dropdownlist ***/
----CSS
.languageTop {
position: relative;
}
/***language**********/
.languageTop .popup {
position: absolute;
top: 55px;
right: 0;
width: 150px;
background-color: #fff;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
.languageTop.active .popup {
opacity: 1;
visibility: initial;
top: 45px;
-webkit-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
.languageTop .popup li a {
display: flex;
padding: 10px;
align-content: center;
color: #333333;
}
.languageTop .popup li a:hover {
color: #2a6496;
}
.languageTop .popup li a img {
width: 25px;
height: 18px;
border: 1px solid rgba(0, 0, 0, 0.1);
}
.languageTop .popup li a span {
margin-left: 10px;
}
.languageTop .iconLang span {
margin-left: 8px;
padding-right: 15px;
position: relative;
text-transform: uppercase;
}
.languageTop .iconLang span::after {
content: "\f107";
position: absolute;
top: 50%;
right: 0px;
transform: translate(0, -50%);
display: inline-block;
font: normal normal normal 14px / 1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 16px;
}
.languageTop .iconLang img {
width: 24px;
height: 18px;
}
.iconLang {
cursor: pointer;
}
/**-------------------------------------------------------*/
languageTop {
position: relative;
}
.languageTop.active .popup {
opacity: 1;
visibility: initial;
top: 45px;
-webkit-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
.languageTop .popup {
position: absolute;
top: 55px;
right: 0;
width: 150px;
background-color: #fff;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
transition: all 0.3s linear;
}
---- JAVASCRIPT
<script type="text/javascript">
$(".languageTop").click(function(event) {
$(".languageTop").toggleClass('active');
});
</script>
====== Chú ý ======
✅ Cách 1: Chặn Google Translate dịch đoạn này
👉 Dùng translate="no" hoặc class notranslate
HOẶC:
👉 Google Translate sẽ bỏ qua hoàn toàn, không sửa chữ nữa