• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Anpassung der Navigation im Jimdo-Head Design Rome

apfelbaum

Neues Mitglied
Hallo liebes Forum,

ich habe eine kleine Homepage für unser Unternehmen im Jimdo gebastelt. Sieht auch soweit zufriedenstellend aus. Problematisch ist ja bekannterweise die Sprachauswahl. Diese habe ich mit den Anpassungen aus diesem Link (klick mich) auch super hinbekommen. Das einzige, was ich leider nicht bearbeiten kann, ist die Navigationsleiste. Ich würde dort ebenfalls gern diese <div class="textDe"></div>-Methode anwenden, müsste aber dazu die entsprechende Stelle irgendwie ansprechen können. Und daran scheitert es bei mir gerade.

Über "Element suchen" habe ich die Stelle auch schon gefunden:
Code:
<a href="/produkte/" data-link-title="Produkte">Produkte</a><span data-navi-toggle="cc-nav-view-1499044854" class="jmd-nav__toggle-button"></span>
Ziel wäre also zwei Mal diesen Code eingeben, jeweils nur mit der Anpassung <div class="textDe"> oder halt "En", und aus dem zweiten "Produkte" ein "Products" machen.

Wie kann ich diese Stelle im Headbereich ansprechen und entsprechend ändern?

Ich wäre für jede Hilfestellung sehr dankbar!

Gruß Konstantin
 
Werbung:
Wenn ich den kram gerade richtig verstehe muss man nur den class Namen ( class="textDe" ) dazu geben.

Code:
<a href="/produkte/" data-link-title="Produkte" class="textDe">Produkte</a>
<span data-navi-toggle="cc-nav-view-1499044854" class="jmd-nav__toggle-button"></span>

Kann aber auch sein das ich falsch liege.
Falls das nicht geht poste mal den Link zur Seite dann kann man mal kucken wie das genau geht.
 
Vielen Dank für den Hinweis!
Ich kann leider nur im Head etwas eintragen. Dort übernimmt er es aber nicht, da es wahrscheinlich nicht richtig ist. :(

Es geht um diesen Link:
Link (ist im Moment noch die jimdofree-Version, ich habe aber mittlerweile Pro und warte nur noch auf den Domainumzug)

Gruß Konstantin
 
Zuletzt bearbeitet:
Werbung:
für deine produkte verlinkung aus der Navi sollte das wohl so aussehen
Code:
<a class="textEn" href="/produkte/" data-link-title="Produkte">Produkte En</a>
<a class="textDe" href="/produkte/" data-link-title="Produkte">Produkte De</a>

Dann kannst du das über die deutsch und englisch verlinkung umstellen.

So mußt du das dann bei allen anderen auch machen.
 
Vielen Dank für die Antwort. Folgendes habe ich im Head unter dem Script für De / En - Umschaltung eingegeben:
Code:
<script type="text/html">
/* <![CDATA[ */
<a class="textEn" href="/produkte/" data-link-title="Produkte">Products</a>
<a class="textDe" href="/produkte/" data-link-title="Produkte">Produkte De</a>
/*]]>*/
</script>

Es bleibt im Editor zumindest schon mal drin und wird nicht direkt wieder gelöscht, allerdings funktioniert die Umschaltung leider noch nicht. Was habe ich falsch gemacht?

Danke!
 
Eine Ergänzung noch: Ich kann nur den Headbereich bearbeiten bzw. dort etwas eintragen. Ich kann leider nicht direkt auf den HTML-Code der Seite über den Homepagebaukausten von Jimdo zugreifen.
 
Werbung:
Eine Ergänzung noch: Ich kann nur den Headbereich bearbeiten bzw. dort etwas eintragen. Ich kann leider nicht direkt auf den HTML-Code der Seite über den Homepagebaukausten von Jimdo zugreifen.
He wat ?
Was soll der Code im head den bringen ?
Wenn ich meinen Code aus post #4 in der Navi kopiere ( bei produkte ) funbktioniert das alles , auch die umschaltung.

Warum kannst du nicht auf den html Code zugreifen?
Das geht bestimmt.
Wenn du angeblich nur in head zugriff hast dann kommt wahrscheinlich nur noch Javascript in frage.

Hast du mal im jimdo Forum gefragt wie man an den html Code dran kommt ? ( heißt du da apfelbaum ? )
 
Danke euch! Ich habe natürlich auch bei Jimdo angefragt, ob ich an den HTML-Code zur Abänderung heran komme. Leider negative Antwort :(
Ich habe in einem Jimdoforum nachgefragt, allerdings schien mit die Reaktionsfreudigkeit dort leider nicht so groß, weshalb ich es hier nochmal probiert habe. Könnt ihr mir zufällig einen Link empfehlen, wo die Sache mit den Javascript etwas erklärt ist? Gruß
 
Werbung:
Könnt ihr mir zufällig einen Link empfehlen, wo die Sache mit den Javascript etwas erklärt ist? Gruß
Das zu erklären wird wohl nicht klappen, zumindest wenn ich das erkläre :smile:

Kannst du den überhaupt javascripte im head einbinden ?
Testen mal das.
Einfach im head einbinden und kucken ob in der console eine menge kram steht
Code:
<script>
document.addEventListener("DOMContentLoaded", function(event) {
   var arr=document.querySelectorAll('nav');
   console.log(arr);
});
</script>

Wenn das klappt dann kann man mal kucken ob man da was erstellen kann.

Du solltest dann aber das html schon mal fertig machen wie du es gerne hättest .
 
Deinen Code werde ich nachher mal probieren. Grundsätzlich sollte aber JavaScript im Head funktionieren, da ich den Rest ja auch mit Hilfe des JavaScriptes übersetze.
 
@apfelbaum
Wenn es um eine Firmen-Webseite geht, sollte man um Baukästensysteme wie Jimdo einen großen Bogen machen. Man nimmt dann besser einen Webspace mit PHP und MySQL und setzt dann z.B. WordPress auf.
 
Werbung:
Das zu erklären wird wohl nicht klappen, zumindest wenn ich das erkläre :smile:

Kannst du den überhaupt javascripte im head einbinden ?
Testen mal das.
Einfach im head einbinden und kucken ob in der console eine menge kram steht
Code:
<script>
document.addEventListener("DOMContentLoaded", function(event) {
   var arr=document.querySelectorAll('nav');
   console.log(arr);
});
</script>

Wenn das klappt dann kann man mal kucken ob man da was erstellen kann.

Du solltest dann aber das html schon mal fertig machen wie du es gerne hättest .
So, ich habe das mal gemacht. Habe aber leider keine Ahnung, wo da jetzt was drin stehen soll... :(

Aber wie gesagt, das bisherige Umschalten zwischen Deutsch und Englisch auf der restlichen Seite mache ich ja auch über Javascript im Head und funktioniert super.
 
Ich kann den Javascript Code jetzt nicht finden aber ist ja auch nicht schlimm.
Du sagst ja das die anderen Javascripte da auch gehen.

Also müssen wir jetzt mit Javascript deine Navigationsleiste ändern damit wir das da auch nutzen können weil du keinen anderen Zugriff auf die Leiste hast ?
Sehe ich so richtig oder ?
 
Ich kann den Javascript Code jetzt nicht finden aber ist ja auch nicht schlimm.
Du sagst ja das die anderen Javascripte da auch gehen.

Also müssen wir jetzt mit Javascript deine Navigationsleiste ändern damit wir das da auch nutzen können weil du keinen anderen Zugriff auf die Leiste hast ?
Sehe ich so richtig oder ?
Ganz genau. Wenn ich dort an den HTML-code kommen würde, hätte ich es über <div>- machen können. Im Grunde bräuchte ich nur ein JavaScript, das die einzelnen Menüpunkte beim Anklicken des "English"-Buttons übersetzt.
Den Code, den ich für das Umschalten der Sprache verwende, ist hier zu finden: LINK
 
Werbung:
Kuck mal ob du damit klar kommst

Hoffe du verstehst es wie ich es gemacht habe?

Theoretisch kannst du so die ganze Seite übersetzen, und wenn du neue Menü Punkte erstellem tust mußt du nur noch das Englische und Deutsche Wort den array zufügen
 
Zuletzt bearbeitet:
Vielen Dank für dein Bemühen! Leider funktioniert es noch nicht. Ich vermute, dass ein Problem beim Ansprechen der Buttons zur Sprachauswahl besteht. Obwohl es eigentlich über getElementById gehen müsste, oder?
Hier nochmal der Code für das restlichen Übersetzen (den CSS-Teil für die Formatierung habe ich weggelassen):
Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
//<![CDATA[

$(document).ready(function(){

var someVarName = localStorage.getItem("pageLanguage");

if (someVarName == "Engl"){
document.getElementById( 'langDe' ).style.color = '#808080';
document.getElementById( 'langEn' ).style.color = '#00b14d';
$(".textEn").show();
$(".textDe").hide();
}


$("#langDe").click(function(){
$(".textEn").hide();
$(".textDe").show();
document.getElementById( 'langDe' ).style.color = '#00b14d';
document.getElementById( 'langEn' ).style.color = '#808080';
var pageLanguage = "Deut";
localStorage.setItem("pageLanguage", pageLanguage);
});

$("#langEn").click(function(){
$(".textEn").show();
$(".textDe").hide();
document.getElementById( 'langDe' ).style.color = '#808080';
document.getElementById( 'langEn' ).style.color = '#00b14d';
var pageLanguage = "Engl";
localStorage.setItem("pageLanguage", pageLanguage);
});

});
//]]>
</script>

Deinen Code habe ich unter diesem eingefügt.
 
das kann alles auch so nicht gehen.
Man kann eigentlich nicht 2 mal ein clickevent beim gleichen Element aufrufen.
Zumindest kenne ich das nicht so.
Ein Moment mal ich kucke mal gerade
 
Werbung:
Erstens wird das Js ehr geladen als wie der Dom da ist und somit bekommst du schon mal ein error in der Konsole.
Das hättest du aber selber sehen können.

Ich bin zwar kein Freund von misch Code aber wir schmeissen mal gerade die beiden Js zusammen
Javascript:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>

<script>
$(document).ready(function(){
    var someVarName = localStorage.getItem("pageLanguage");

    if (someVarName == "Engl"){
        document.getElementById( 'langDe' ).style.color = '#808080';
        document.getElementById( 'langEn' ).style.color = '#00b14d';
        $(".textEn").show();
        $(".textDe").hide();
   }

   $("#langDe").click(function(){
      tauschen(1);//von englisch zu deutsch
      $(".textEn").hide();
      $(".textDe").show();
      document.getElementById( 'langDe' ).style.color = '#00b14d';
      document.getElementById( 'langEn' ).style.color = '#808080';
      var pageLanguage = "Deut";
      localStorage.setItem("pageLanguage", pageLanguage);
});

$("#langEn").click(function(){
     tauschen(2);//von deutsch zui englisch
     $(".textEn").show();
     $(".textDe").hide();
     document.getElementById( 'langDe' ).style.color = '#808080';
     document.getElementById( 'langEn' ).style.color = '#00b14d';
     var pageLanguage = "Engl";
     localStorage.setItem("pageLanguage", pageLanguage);
});

var array_ger=['Haus','Produkte','Stapelheber','Stapelwender','Sondermaschinenbau','Leistungen','Kontakt'];
var array_eng=['Home','Products','Stack lifter','Pile turner','Special mechanical engineering','Services','Contact'];
function tauschen(u){
   var nav_links=document.querySelectorAll('nav ul li a');
   nav_links.forEach(function(ele){
       if(u==2){
           var position = array_ger.indexOf(ele.innerHTML);
           ele.innerHTML=array_eng[position];
           document.getElementById('langEn').setAttribute('disabled',true);
           document.getElementById('langDe').removeAttribute('disabled');
       }
       if(u==1){
           document.getElementById('langEn').removeAttribute('disabled');
           document.getElementById('langDe').setAttribute('disabled',true);
           var position = array_eng.indexOf(ele.innerHTML);
           ele.innerHTML=array_ger[position];
       }
   })
}
});
</script>

Wenn das dann geht ,ändern wir den misch marsch Code.

In den Fall meine ich Jquery und Nativ Javascript durcheinander.
Kann man zwar machen ist aber Schlechter und unübersichlicher Code
 
Funktioniert fast perfekt! Tausend Dank!!!
Ein Problem besteht aber leider noch. Wenn man ins Englische wechselt und einen Menüpunkt anklickt, ist alles wieder auf Deutsch. Beim erneuten Anklicken des "Deutsch"-Buttons kommt anschließend im Menü "undefined"... :(
 
Zurück
Oben