Liquid utility that includes Google Translate HTML and JS code
Change current working directory to the repository that will be utilizing this project, and checkout your gh-pages branch if available...
cd ~/git/hub/__org_name__/__repository__
git checkout gh-pagesAdd this project as a Git submodule...
mkdir -vp _includes/modules
git submodule add\
-b master --name "includes-translate"\
"https://github.com/liquid-utilities/includes-translate.git"\
"_includes/modules/includes-translate"Suggested additions for your ReadMe.md file so everyone has a good time with submodules
Clone with the following to avoid incomplete downloads
git clone --recurse-submodules <url-for-your-project>
Update/upgrade submodules via
git submodule update --init --merge --recursiveInclude the Liquid script within a Layout file...
_layouts/default.html
<!--
Source: https://raw.githubusercontent.com/jekyll/minima/v2.5.0/_layouts/default.html
License: MIT
Modified_For: liquid-utilities/includes-translate
-->
<!DOCTYPE html>
<html lang="{{ page.lang | default: site.lang | default: "en" }}">
{%- include head.html -%}
<body>
{%- include header.html -%}
<main class="page-content" aria-label="Content">
<div class="wrapper">
{% include modules/includes-translate/includes-translate.html %}
{{ content }}
</div>
</main>
{%- include footer.html -%}
</body>
</html>Note; depending upon theme choice it may be more organized to include code from this project within a
header.htmlfile, eg._includes/header.html
Define site defaults...
_config.yaml
page:
translate_id: translate_selection
language: en
translate_callback: google_translate_callback
auto_translate: falseIndividual posts may overwrite site defaults...
_posts/2019-08-16-hello-lifeforms.md
---
layout: post
title: "Hello Lifeforms"
date: 2019-08-16 13:58:05 -0700
categories: posts
language: es
auto_translate: true
---
Ejemplo de contenido de la página que se traducirá.git add README.md
git add .gitmodules
git add _config.yaml
git add _includes/modules/includes-translate
git add _layouts/default.html
## Add any changed files too
git commit -F- <<'EOF'
:heavy_plus_sign: Adds `liquid-utilities/includes-translate#1` submodule
**Additions**
- `.gitmodules`, tracks submodules AKA Git within Git _fanciness_
- `README.md`, updates installation and updating guidance
- `_layouts/modules/includes-translate`, injects JavaScript configs for translating page via Google Translate
EOF
git push origin gh-pages🎉 Excellent 🎉 your site is now ready to begin unitizing code from this repository!
{% include %} parameters, and _config.yaml or _posts/_pages Frontmatter, may accept the following customizations;
-
translate_idstring, HTMLidthat Google Translate script should injectoptionandselectelements into; defaults to"translate_selection" -
languagestring, language two letter code that pages are written in; defaults to"en" -
translate_callbackstring, name of JavaScript function that Google Translate should call when a languageoptionis chosen; defaults to"google_translate_callback" -
auto_translateboolean, iftruewill add JavaScript function and event listener that will automatically select preferred language if detectable; defaults tofalse -
disable_translateboolean, iftruewill disable all features ofincludes-translatewithin page/post or entire site; defaults tofalse
Because this project is a script that may be included, it is possible to translate select pages or posts instead of modifying site template files, eg...
_posts/2020-03-05-test-automatic-translation.md
---
layout: post
title: "Test Automatic Translation"
date: 2020-03-05 12:58:05 -0700
categories: posts
translate_id: translate_selection
translate_callback: google_translate_callback
language: ja
auto_translate: true
---
{% include modules/includes-translate/includes-translate.html %}
翻訳するページコンテンツの例。-
StackOverflow -- JavaScript for detecting browser language preference
-
StackOverflow -- How do I change an HTML selected
optionusing JavaScript? -
StackOverflow -- How do I change an HTML selected
optionusing JavaScript? -
StackOverflow -- How can I trigger an
onchangeevent manually? -
Daddy Design -- How to Disable Google Translate from Translating Specific Words or Content Blocks
Legal bits of Open Source software
Includes Translate documentation on how things like this could be utilized
Copyright (C) 2022 S0AndS0
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published
by the Free Software Foundation; version 3 of the License.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
