Mục lục

    Google Translate có thể xem như là một API được hỗ trợ từ Google, Mã code nhúng cũng giống như Google Map, Google Translate được tạo ra và có thể được tích hợp vào website để dịch trang web đó sang thành nhiều thứ tiếng khác nhau dễ dàng và không mất nhiều thời gian.

    Các bước để tích hợp Google Translate vào website

    Bước 1: Xây dựng giao diện website

    CODE HƯỚNG DẪN:

    <div class="container">
        <h1>Hướng dẫn tích hợp Google Translate</h1>
     
        <p>Chọn ngôn ngữ muốn hiển thị!</p>
        <div id="translate_select"></div>
         
        <h2>Nội dung trang web</h2>
        <p>
            Nội dung cần dịch.
        </p>
    </div>

    Note: id=”translate_select” chèn vào nơi bạn muốn dịch trang website nhé.

    Bước 2: Tiến hành tích hợp Google Translate vào website

    Đầu tiên, bạn cần nhúng mã script của Google Translate vào header của website.

    <script type="text/javascript"
        src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
    </script>

    Tiếp đến bạn thêm đoạn mã script sau đây vào sau đoạn mã vừa rồi để kích hoạt mở hộp tuỳ chọn ngôn ngữ của google translate nhé.

    <script type="text/javascript">
        function googleTranslateElementInit() {
            new google.translate.TranslateElement({pageLanguage: 'vi'}, 'translate_select');
        }
    </script>

    Như vậy là xong việc tích hợp Google Translate vào website rồi nhé, thật đơn giản phải không nào, giờ chạy lên và xem thành quả nhé.

    Lời kết

    Qua hướng dẫn mình bạn có thế thêm Google Translate vào bất kỳ website nào nhé. Việc thêm Google Translate sẽ giúp bạn tiết kiệm rất nhiều thời gian cho việc code đa ngôn ngữ cho website.

    Xem thêm: Hướng dẫn thiết kế website wordpress nhanh chóng

     

    5/5 - (1 bình chọn)

    Công nghệ tương lai Lập trình/ Code

    Portainer Là Gì? Toàn Tập Về Công Cụ Quản Trị Container Hàng Đầu (Hướng Dẫn Chi Tiết)

    Sự bùng nổ của công nghệ Container hóa (Containerization) với đầu tàu là Docker

    Xem thêm

    Công nghệ tương lai Công cụ và hướng dẫn Lập trình/ Code

    Helper Là Gì? Bí Quyết Viết Code “Sạch” Và Tối Ưu Trong Lập Trình

    Trong thế giới lập trình và phát triển phần mềm, việc phải lặp đi

    Xem thêm

    Digital Maketing Đồ Họa và Video Xu hướng

    Des là gì? Giải mã ý nghĩa của Des trong Thiết kế, SEO, IT & Logistics

    Bạn đang lướt mạng xã hội và thấy ai đó bình luận: “Dân Des

    Xem thêm

    Để lại một bình luận

    Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

    Chào mừng bạn đến với TASDIGITAL.net
    Chào mừng bạn đến với TASDIGITAL.net