Anleitung: Einfache multilinguale Webs

Dieses Board ist für Anleitungen gedacht, wie man bestimmte (komplexe) Dinge mit CMSms erledigen kann - User-Beiträge herzlich willkommen!
Nogga

Anleitung: Einfache multilinguale Webs

Post by Nogga »

Hallo,

da die Frage immer wieder auftaucht und ich das Ganze bereits mehrmals gelöst habe (mit Bordmitteln) möchte ich hier nun meine (sicherlich nicht 100% perfekte, aber durchaus annehmbare) Lösung vorstellen.

Die Seite besitzt momentan nur 2 Sprachen, aber ist - zumindest technisch - nicht auf eine Maximalanzahl beschränkt.

Genutzt werden außer dem Menumanager keine weiteren Plugins, welche aber wenn gewünscht auch nicht schwierig einzusetzen sein sollten. Im Zweifallsfalle das Plugin immer in mehreren Ausführungen (für jede Sprache) duplizieren.

Nun aber zur eigentlichen Anleitung (aus dem Gedächtnis - ich habe die Lösung bereits vor etwa einem halben Jahr erstellt).

Kurz zur angewandten Technik:
Da ich ein zwei-stufiges Menüsystem (also oben im Header die Hauptkategorien und links die Unterpunkte zu den entsprechenden Seiten) bestand die Disziplin darin dies ebenfalls in diesem System abzubilden.
Ich habe mich dazu entschieden SectionHeaders für Sprachen zu missbrauchen und die entsprechende Lösung sind dann so aus (die Hierarchie):

(siehe angehängten Screenshot)

Die Section Headers leiten die einzelnen Sprachen ein (also de für deutsch, en für englisch). Der Vorteil dieser Lösung ist zudem, dass man bei pretty-urls dann auch die entsprechende Sprache in der URL hat (z.B. http://www.ritenetworking.de/de/dienstleistungen/ für die deutsche Seite Dienstleistungen).

Wichtig ist auch, dass der Seitenname (nicht Titel) natürlich bei jeder Seite anders sein muss, das kann man dann entweder über angehängte Länderkürzel lösen: start_de, start_en, etc., was aber ansichts der pretty url (oben angedeutet) dann wieder doof aussieht, da das Länderkürzel zwei mal in der URL wäre. Dementsprechend solltet Ihr glückliche Seitennamen wählen: start/home für die Startseite de/en oder z.B. dienstleistungen/services, usw.

Die Seiten selbst können natürlich auf beliebigen Templates basieren. Optimalerweise natürlich für jede Sprache ein separates Template, falls man hard-codierten Text im Template hat (z.B. ein Link zum Impressum, bzw. analog im Englischen zum Impress).

Ein deutsches Template sähe dann so aus:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<__html>
  <head>
    <title>{title} - {sitename}</title>
    <meta http-equiv="content-language" content="de" />
    {metadata}
    {stylesheet}
  </head>
  </__body>
    <div id="overall">
      <div id="header">
        <div id="top_menu">
          {cms_module module='menumanager' template='TopMenu' start_level="2" number_of_levels="1"}
        </div>
      </div>
      <div id="page" class="clearfix">     
        <div id="left_col">
          <div id="logo_block">
            <p><img src="img/logo.gif" width="140" height="108" alt="Logo" /></p>
          </div>
          <div id="language_block">         
            <p>
              {cms_selflink page="startseite" image="img/lang_de.gif" text="Deutsch" imageonly=1}
              {cms_selflink page="home" image="img/lang_en.gif" text="English" imageonly=1}
            </p>
          </div>
          <div id="left_menu">
            {cms_module module='menumanager' template='LeftMenu' start_level="3"}
          </div>
        </div>        
        <div id="content_col">         
          <div id="front_box">
            {random_blob prefix='deTopBox'}  
          </div>
          <div id="content">
             <div class="content_block">
               {content}
             </div>
          </div>
        </div>       
      </div>
      {html_blob name='deFooter'}
    </div>
  <__body>
</__html>
Bemerkenswert an diesem Template ist zunächst, dass es im Prinzip für alle Sprachen geeignet ist. Dadurch, dass wir dem Topmenü-Menumanager sagen, dass er nur den zweiten Level anzeigen soll (also alles unter de, bzw. en) und auch nur ein weiteres Level (also unsere Hauptkategorien Dienstleistungen, etc.) sucht er sich automatisch, je nachdem ob er gerade in der deutschen (alles unter dem de-Zweig) oder in der englischen Hierarchie (alles unter dem en-Zweig) ist die passende Menü heraus.

Der Language Block ist in diesem Fall ebenfalls simpel aufgebaut - er verweist eben auf die deutsche (startseite) oder eben auf die englische (home) Startseite. Bei einem Klick passiert genau der oben erwähnte Effekt.

Ein Hinweis: Ein Verhalten, dass er immer genau das anderssprachige Pendant zur gerade aktiven Seite aufruft (also bei einem Besuch von Dienstleistungen und anschließendem Klick der Aufruf der Seite Services) ist weder machbar noch wirklich sinnvoll, da es ja nie garantiert ist (und auch nur in den seltensten Fällen praktikabel) genau die gleichen Inhalte in _allen_ Sprachen zur Verfügung zu stellen.

Und zuletzt das linke Menü (LeftMenu) es verhält sich im Prinzip genau wie das TopMenu nur dass eben statt dem 2. Level alles unterhalb des dritten Levels angezeigt wird. Ebenfalls im gerade aktiven Sprachzweig.

Und nun abschließend noch die entsprechenden Menu-Manager-Templates. Dies sind im Prinzip die ganz normalen Templates nur abgespeckt um die Anzeige der Section Headers (sonst würden wir diese am Ende noch sehen...). Also in diesem Fall:

TopMenu:

Code: Select all

{if $count > 0}
<ul>
  {foreach from=$nodelist item=node}
    {if $node->depth > $node->prevdepth}
      {repeat string="<ul>" times=$node->depth-$node->prevdepth}
    {elseif $node->depth < $node->prevdepth}
      {repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
      </li>
    {elseif $node->index > 0}
      </li>
    {/if}

    {if $node->current == true}
      <li><a href="{$node->url}"><span>{$node->menutext}</span></a>
    {elseif $node->type == 'sectionheader'}
      <li><a href="{$node->url}"><span>{$node->menutext}</span></a>
    {else}
      <li><a href="{$node->url}"><span>{$node->menutext}</span></a>
    {/if}
  {/foreach}
  
  {repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
LeftMenu:

Code: Select all

{if $count > 0}
<ul>
  {foreach from=$nodelist item=node}
    {if $node->depth > $node->prevdepth}
      {repeat string="<ul>" times=$node->depth-$node->prevdepth}
    {elseif $node->depth < $node->prevdepth}
      {repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
      </li>
    {elseif $node->index > 0}
      </li>
    {/if}

    {if $node->current == true}
      <li><a href="{$node->url}">  {$node->menutext} </a>
    {elseif $node->type == 'sectionheader'}
      <li>   {$node->menutext}
    {else}
      <li><a href="{$node->url}">  {$node->menutext} </a>
    {/if}
  {/foreach}
  
  {repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}

So das war's vorerst - eventuell werde ich das Ganze noch erweitern um eine kleine Anleitung wieder man die Suche ebenfalls multilingual gestaltet - sofern ich mal Zeit finde.

Anmerkung: Das News-Modul funktioniert ebenfalls multilingual (indem ich die Kategorien dazu missbrauche)  - das kommt ggf. auch noch nach!

Das entsprechende Endprodukt könnt Ihr unter http://www.ritenetworking.de bestaunen ;) - dort ist jedoch die englische Sprache noch ausgeblendet aufgrund von Zeitmangels *gg* :) Aber Ihr könnt versichert sein, dass es funktioniert ;)

UPDATE: multilinguale News über Kategorien

Wie gewünscht und ebenfalls relativ einfach umgesetzt:

Einfach für jede Sprache eine entsprechende Kategorie in den News erstellen und dann entsprechend auf den News-Seiten die Newsblöcke mit Filter auf die Kategorie anlegen:

Code: Select all

{cms_module module="news" number="10" category="German" makerssbutton="true"} Neuigkeiten
{cms_module module="news" number="10" category="German"}
Für die deutsche Sprache - für jede andere Sprache entsprechend die Kategorie anpassen.

Fragen werden hier gerne beantwortet!

Und jetzt geht's zum Raclette-Essen - bin eingeladen :o)

[gelöscht durch Administrator]
Last edited by Nogga on Wed Jan 10, 2007 3:58 pm, edited 1 time in total.
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

Besten Dank für die ausführliche Erläuterung - hast dir das Raclette-Essen verdient :) ...
swgreed

Re: Anleitung: Einfache multilinguale Webs

Post by swgreed »

Nogga wrote:
Anmerkung: Das News-Modul funktioniert ebenfalls multilingual (indem ich die Kategorien dazu missbrauche)  - das kommt ggf. auch noch nach!
Sehr schöne Anleitung!  :)
Die Sache mit den News ist sicherlich noch interessant, da es in der Standardinstallation ein nur "entweder/oder" zu geben scheint, was die ausgewählte Sprache angeht.
Nogga

Re: Anleitung: Einfache multilinguale Webs

Post by Nogga »

Ist drin!
User avatar
moonie
Forum Members
Forum Members
Posts: 81
Joined: Tue Feb 13, 2007 3:08 pm
Location: Switzerland

Re: Anleitung: Einfache multilinguale Webs

Post by moonie »

Tolle Anleitung, Nogga! Damit verhinderst Du grad ne schlaflose Nacht bei mir  ;D

Ich habe mich für ein Projekt zuerst mit dem MLE-Modul rumgeschlagen, dann aber schnell festgestellt dass ich die Seite wohl nicht so realisieren kann wie sie sein sollte (oder ich hab alles falsch verstanden..):
- pretty url's mit unterschiedlichen Seiten-alias per Sprache
- unterschiedliche Templates per Sprache
- real-time Sprach-switcher auf allen Seiten

Mit Deinem Lösungsansatz klappt fast alles, dass der Sprach-switch halt "nur" auf die Startseite leitet, damit kann ich leben.  ;)
Nogga

Re: Anleitung: Einfache multilinguale Webs

Post by Nogga »

Die Umleitung auf die Startseite macht ja eigentlich auch Sinn.

Bedenkt man z.B. dass man die Webseiten nur teilweise übersetzt hat, bzw. manche Themenbereiche nicht in allen Sprachen existieren würde ein Switch in einer solchen Begebenheit ins Nirwana führen... :)

Freut mich, dass es geholfen hat - vielleicht wird der Post ja irgendwann sticky  ::)  ;D
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

Nogga wrote: vielleicht wird der Post ja irgendwann sticky  ::)  ;D
Das lässt sich einrichten  ;) ...
User avatar
moonie
Forum Members
Forum Members
Posts: 81
Joined: Tue Feb 13, 2007 3:08 pm
Location: Switzerland

Re: Anleitung: Einfache multilinguale Webs

Post by moonie »

Hm ein letztes Problemchen bleibt und ich habe keine Antwort gefunden auf dem Forum. Eventuell kriegt das jemand von euch ganz schnell hin..  ;D

Kann ich die News-Kategorien im 'Detail-Template' irgendwie herauslesen? Ich möchte nämlich im News-Detail-Template pro Sprache einen anderen "zurück" Link darstellen (z.B. mit {$return_url} kommt da natürlich immer nur "Zurück").
Also so etwas wie {if category="de"}zurück {else if}retour möcht ich erzielen. Nur leider habe ich null Ahnung wie ich das auslesen könnte?
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

moonie wrote: Nur leider habe ich null Ahnung wie ich das auslesen könnte?
Sämtliche auf einer Seite verfügbaren Smarty-Variablen lassen sich mit dem Tag get_template_vars anzeigen.

Wenn du Noggas News-Beispiel nimmst, liesse sich evtl. category als Trigger verwenden ...
User avatar
moonie
Forum Members
Forum Members
Posts: 81
Joined: Tue Feb 13, 2007 3:08 pm
Location: Switzerland

Re: Anleitung: Einfache multilinguale Webs

Post by moonie »

Vielen Dank für den Tipp mit den get_template_vars, Cyberman, damit klappts!

Leider gab die Ausgabe der Variablen keine Kategorie zurück, dafür hab ich aber page_name als Variable entdeckt. Ich habs jetzt z.B. über {if $page_name == "aktuelles"} gelöst, und es funktioniert.

Danke für Deine Hilfe!
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

Einen interessanten Thread zu diesem Thema gibts auch hier (in englisch)

http://forum.cmsmadesimple.org/index.ph ... 756.0.html
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

Wie man Benutzer in Abhängigkeit von der im Browser des Besuchers eingestellten Sprache weiterleiten kann, gibt es hier zu lesen (in englisch)

http://forum.cmsmadesimple.org/index.ph ... 805.0.html
faglork

Re: Anleitung: Einfache multilinguale Webs

Post by faglork »

Moin!

Entschuldigt wenn ich den Thread mal wieder ausgrabe, aber mir ist nicht ganz klar wie nun eigentlich die Hierarchie aussieht (der erwähnte Screenshot fehlt). Wo befindet siche die Startseite und was befindet sich da drauf?

Und vor allem: welche Funktion haben die Trenner? Und warum ein extra Menü-Template zum ausblender der Section header - das kann man doch im Backend einstellen?

Servus,
Alex
markus
Forum Members
Forum Members
Posts: 98
Joined: Mon Dec 17, 2007 4:13 pm

Re: Anleitung: Einfache multilinguale Webs

Post by markus »

hallo, als aufgabe muss ich jetzt zu einer deutsche seite noch eine englische und französische seite erstellen. aber ich kann dem ganzen hier nicht so ganz folgen.
ich dachte das ich einfach für jede sprache ein thema erstelle und das nur ein gewsses menü abgefragt wird.
wer hätte noch lösungen am start?
cyberman

Re: Anleitung: Einfache multilinguale Webs

Post by cyberman »

Kannst du dein Nichtverstehen genauer beschreiben? Wo genau ist dein Problem? Was ist nicht verständlich?

Entweder verwendest du die inoffizielle MLE-Lösung oder ein 2stufiges Menü. Das top-menü verwendest du als Auswahl-Menü für die Sprache (number_of_levels='!') und das Submenü enthält dann die jeweilige Sprache. Die Struktur ist ganz simple:

1. DE
1.1 Start
...
2. EN
2.1 Home
...
3. FR
3.1 Démarrer
...

Das Submenü startest du mit dem Parameter start_level='2'.
Post Reply

Return to “HowTo's”