Skip to content

Instantly share code, notes, and snippets.

@sskylar
Last active October 21, 2017 05:31
Show Gist options
  • Save sskylar/8524524 to your computer and use it in GitHub Desktop.
Save sskylar/8524524 to your computer and use it in GitHub Desktop.
Front end site translations with Siteleaf v2 (http://www.siteleaf.com) and jquery.localize.js (https://github.com/coderifous/jquery-localize).
<html>
<body>
<h1 data-localize="{{page.id}}.title">{{page.title}}</h1>
<div data-localize="{{page.id}}.body">
{{content}}
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://raw2.github.com/coderifous/jquery-localize/master/build/jquery.localize.js"></script>
<script>
// translate English text to Spanish
$("[data-localize]").localize("site", { language: "es" })
</script>
</body>
</html>
---
---
{% comment %}
NOTE: Create one of these Liquid templates for each language you wish to support ("es" = Spanish).
Then add a meta data field to your page/post called "title_es" or "body_es" (for example), where the translated copy should go.
{% endcomment %}
{
<% for page in site.pages %>
"{{page.id}}": {
"title": "{{page.title_es}}",
"body": "{{page.body_es}}"
}<% unless forloop.last %>,<% endunless %>
<% endfor %>
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment