Blogger itself does not provide such a facility, but I'm here presenting a javascript hack which allows posts to be written in multiple languages, and have flags on top of the page to switch among them.
First of all, you have to write within a single post a different version for every language which you want to support. To do this, you must first set the correct environment. When editing a post, you should switch to HTML view first:
Then, suppose you are writing content in Italian and English, you should add this skeleton:
1
2
3
4
5
6
| <div class="lang:italian">Questo è del contenuto in Italiano</div><div class="lang:english">This is English content</div> |
Then, switching back to Compose mode will show you the two sentences. Replace them with the actual content you want to display in your blog post.
Then, go to the Layout Editor of your blog and add a new HTML/JavaScript block on top of your blog posts:
Enter there the following code:
Then, go to the Layout Editor of your blog and add a new HTML/JavaScript block on top of your blog posts:
Enter there the following code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
| <script language="Javascript">function getElementsByClass(searchClass,node,tag) { var classElements = new Array(); if ( node == null ) node = document; if ( tag == null ) tag = '*'; var els = node.getElementsByTagName(tag); var elsLen = els.length; var pattern = new RegExp('(^|\\\\s)'+searchClass+'(\\\\s|$)'); for (i = 0, j = 0; i < elsLen; i++) { if ( pattern.test(els[i].className) ) { classElements[j] = els[i]; j++; } } return classElements;}function show_en() { var it = getElementsByClass('lang:italian', null, null); var en = getElementsByClass('lang:english', null, null); for(i = 0; i < it.length; i++) { it[i].style.display = 'none'; } for(i = 0; i < en.length; i++) { en[i].style.display = 'block'; }}function show_it() { var it = getElementsByClass('lang:italian', null, null); var en = getElementsByClass('lang:english', null, null); for(i = 0; i < it.length; i++) { it[i].style.display = 'block'; } for(i = 0; i < en.length; i++) { en[i].style.display = 'none'; }}</script><a href="#" onclick="show_en();"><img src="PATH-TO-EN-FLAG" /></a><a href="#" onclick="show_it();"><img src="PATH-TO-IT-FLAG" /></a> |
This adds at the top of you posts two flag images, which can be clicked, showing either italian or english content. Now, the last bit of editing entails activating either language as the default one (otherwise, you will see both languages, until one of the two flags is clicked).
To do so, open you Blog's model editor and click "Edit HTML".
A popup telling you about the dangers of this operation will show up. Tell blogger to take it easy, and start editing your model. You should find the <body> tag, and add the following attribute in it:
1
| onload='show_en();' |
Selecting which is the default language which you want to display.
For a live preview of how this works, point your browser to CranEntertainment's blog!
0 коммент.:
Отправить комментарий