adding another language option

Dear everyone,

I've been working on "manually" adding another language option for my webiste (english and german), and I've been following this wonderful description: http://freewidgets4u.weebly.com/tutorial-bilingual.html.

Technically everything went according to plan, but now some problems appeared and I don't know what to do. I suspect this is because in the tutorial there is another theme than I use, so I'm sure I just need to adjust my code to work with my theme, and it should work.

I'll describe it to you in detail, so you can have a look. However, if your diagnosis is there's no way I can fix that, then I'll have to return back to english page only.

So, here is my website: www.theresaboden.com


As you can see in the published version, the home page is out of place, even though in the weebly editor it looks like this:

imagehome page according to the editor

The original plan was to duplicate all the pages (alternating in page 1 - english, page 1 - german, page 2- english, page 2 - german,...), and then duplicate the header.html I'm using to header-2nd-language.html and then adjust them with specific codes to point towards and extra file, which is bilingual.css (see next screenshot):

imagethe bilingual file

Now, the adjustments to the header.html and header-2nd-lang.html are as follows (see the two red arrows pointing towards the inserted lines):

imageadjustments in header-2nd-lang.htmlimageadjustments in header.html

Please do NOT be confused by the fact that there is a SPANISH flag picture and the Spanish link, even though I talked about German above. This is just because the tutorial used Spanish as an example and I wanted to do everything as explained to see if it worked, and only afterwards find a German flag and change it.

As you can see the files point towards the bilingual.css, and in the end ideally I should just insert the link the little flags should lead to and that's that.

But funny enough that's not that.

1. As I already said the home page is displaced, and I really don't know why.

2. In the published website the little Spanish flag doesn't even appear.

3. In the published website anywhere else other than the home page (e.g. here: http://www.theresaboden.com/paintings.html) suddenly the whole page turns into a link, which is surreal.

4. If you click the "link" the whole page turned into, you'll get back to the home page, BUT: this time it IS the German version (it now says "Künstlerin" below my name, which is German for "artist" - see screenshots), but the NAVIGATION BAR just remains in the ENGLISH version. And of course if you click it you only get to the English pages. Also very surreal:

imagehomepage - English VersionimageHomepage - German version (see caption below my name), BUT still ENGLISH navigation menu

So.

Before I dare to go any further in changing or adding things, I want to hear your opinion.

Give me some real talk - how badly did I screw up?

Best,

Tessa

1,797 Views
Message 1 of 2
Report
1 REPLY 1

Hi

It is not screwed badly I think.... Smiley Happy

I suggest to change:

a.flaggy from position: absolute; to position: relative;

and the first problem should be gone...

But on the page: http://www.theresaboden.com/homet.html which is a german home version - I see Englih Menu and again Spanish (German language) flag. Looks like it has the same page Layout?! Have you changed the layout for Homet to second language?

Hope I helped a little Smiley Wink

Bye

If you need more help I am ready

1,774 Views
Message 3 of 2
Report