Zusatz-Links und YouTube Script

Buch88

Hallo Mario, eine klasse Seite die du hast! Gratuliere dir. Ich probiere gerade eine 1-seitige Homepage aus, dabei kann ich beim Typ "leere Seite" kein Zusatz-Links Menü (ganz unten) erstellen. Meinst du das du vielleicht mal so ein Widget oder Code machen kannst? Man könnte zwar im Text-Editor einfach Impressum und Datenschutz schreiben und verlinken, das sieht aber auf dem Smartphone sehr abenteuerlich aus. Weiterhin, die beiden YouTube Widgets sind prima, jedoch reagieren die bei mir nicht auf Cookie Consents. . . trotz "Nein" wird es geladen. Viele Grüße Stefan

mario

Ich kenn leider nur eine Möglichkeit das ganze Hauptmenü von ZP abzugreifen.

Nur das Zusatzmenü abzugreifen habe ich noch keine Möglichkeit gefunden.

Ja mit dem "Cookie Consent" ist halt bl. . . das der nur die ZP-Widgets greift. da muss ich mal schauen ob ich da irgend etwas machen kann.

Buch88

Ich habe das jetzt mal probiert als Quellcode einzufügen, das geht zwar, jedoch sieht das etwas Chaotisch aus https: //www. zella. de/forum/images/smilies/emojione/263a. png" class="smiley" alt=": -)" height="23" srcset="https: //www. zella. de/forum/images/smilies/emojione/263a@2x. png 2x"> Aber trotzdem Dankeschön. Noch etwas, soll man nur deine Widget-Seite verlinken oder auch deine Homepage?

< div id="footer" class="container">

<
div id="xmenu" class="" data-type="inline-editing" data-context="xmenu" data-item-id="xmenu">
    
        <
a class="xmenulink" href="index.
php?
page-id=576">
Startseite<
/a>
    
        <
a class="xmenulink" href="kontakt.
html?
page-id=578">
Kontakt<
/a>
    
        <
a class="xmenulink" href="impressum.
html?
page-id=579">
Impressum<
/a>
    
        <
a class="xmenulink" href="impressum.
html?
page-id=579" target="_blank" rel="noopener">
Datenschutzerklärung<
/a>      
    
<
/div>

Buch88

Ich stelle mal kurz hier die Frage noch, dein Script "Seiten-Navigation" ist ja der Hammer, super gemacht, kann ich das aber auch links statt rechts anbringen? Gruß Stefan

mario

Nein das geht mit diesem Widget nicht.

Aber das Widget baut auf diesen Code auf. Da lässt sich alles ändern. https: //www. code-zp. de/seitennavi-1. html">LINK>

mario

Wegen den YouTube-Widgets habe ich direkt bei ZP nachgefragt.

Da gibt es wohl keine Möglichkeit.

Buch88

Danke dir! Kannst du mir bei Gelegenheit noch sagen, wo ich was ändern muss, ich habe zwar "left" (Links) geändert, brachte aber nichts https: //www. zella. de/forum/images/smilies/emojione/2639. png" class="smiley" alt=": -(" height="23" srcset="https: //www. zella. de/forum/images/smilies/emojione/2639@2x. png 2x">

Buch88

Diese Seite nutzt Widgets von Mario Groß, http: //www. widget-zp. de und https: //www. zella. de

Soll ich das so etwa schreiben (wegen Copyright)

Buch88

Hallo Mario, auf der linken Seite habe ich jetzt alles (siehe unten). Der Button "Menü" bleibt bei dir recht kurz, bei mir geht er jetzt aber über die ganze Seite beim öffnen. Ich mache dir mal ein Bild davon. Kannst du mir da helfen? Danke

CSS

< style>
#content {
padding-bottom: 10px;
}
< /style>

< style>
. sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 99000;
top: 0;
left: 0;
background-color: #333;
overflow-x: hidden;
transition: 0. 5s;
padding-top: 60px;
z-index: 6101;
}

. sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;
color: #818181;
display: block;
transition: 0. 3s;
}

. sidenav a: hover {
color: #f1f1f1;
}

. sidenav . closebtn {
position: absolute;
top: 0;
left: 0px;
font-size: 36px;
margin-left: 50px;
}

#main {
position: fixed;
z-index: 1;
top: 20px;
left: 0px;
padding: 5px 18px 5px 8px;
font-size: 14px;
color: #000000;
background-color: #D6CBB5;
border-radius: 5px 0 0 5px;
text-transform: uppercase;
cursor: pointer;
transition: 0. 2s;
}
#main: hover {
right: 0px;
}

@media (max-width: 20px) {
#main {writing-mode: vertical-rl; right: 7px; padding: 5px 18px 5px 4px; }
#main: hover { right: 12px; }
}

@media screen and (max-height: 20px) {
. sidenav {padding-top: 15px; }
. sidenav a {font-size: 18px; }
}
< /style>

Und dann Quelltext

< div id="mySidenav" class="sidenav">
< a href="javascript: void(0)" class="closebtn" onclick="closeNav()"> ×< /a>
< a href="index. php"> Startseite< /a>
< a href="hover-effekte. html"> Hover< /a>
< a href="text. html"> Text< /a>
< a href="popup-fenster. html"> CSS Fenster< /a>
< a href="menue. html"> Menü< /a>
< a href="mehr. html"> Mehr< /a>
< a href="layout. html"> Layout< /a>
< a href="vorlagen. html"> Vorlagen< /a>
< br>
< a href="http: //codeschnipsel. xobor. de/" target="blank"> Support< /a>
< a href="https: //www. facebook. com/CodeschnipselZP/" target="blank"> Facebook< /a>
< /div>

< div id="main" onclick="openNav()">
< span> ☰ Menü< /span>
< /div>

< script>
function openNav() {
document. getElementById("mySidenav"). style. width = "250px";
}
function closeNav() {
document. getElementById("mySidenav"). style. width = "10px";
}
< /script>

Buch88

attachment=117

mario

https: //www. zella. de/forum/forum/index. php? thread/85-zusatz-links-und-youtube-script/& postID=488#post488">

Diese Seite nutzt Widgets von Mario Groß, http: //www. widget-zp. de und https: //www. zella. de

Soll ich das so etwa schreiben (wegen Copyright)

Ja.

Welches Layout wird denn hier verwendet? Dann kann ich deinen Code mal testen.

Buch88

Weiterhin "Bistro"

Buch88

Falls es möglich ist, kannst du mir bitte den Code geben für Links, irgendwie ist meine Version total unnutzbar https: //www. zella. de/forum/images/smilies/emojione/2639. png" class="smiley" alt=": -(" height="23" srcset="https: //www. zella. de/forum/images/smilies/emojione/2639@2x. png 2x"> Ich habe jetzt plötzlich nicht nur einen Balken sondern zwei Schiebeleisten https: //www. zella. de/forum/images/smilies/emojione/2639. png" class="smiley" alt=": -(" height="23" srcset="https: //www. zella. de/forum/images/smilies/emojione/2639@2x. png 2x"> Da merkt man das du der Profi bist. . .

attachment=118

mario

Also Album Responsive.

Dieses Layout hat ja eine Vertikale Navigation, da ist eine solche Absolut positionierte Navigation total fehl am Platz.

Buch88

Die Navigation ist ja nicht platzierbar, weil ich ein "leeres Seitenformat" gewählt habe. Zeta bietet keine Möglichkeit auf "leeren Seiten"-Typen ein kleines Menü einzufügen, leider https: //www. zella. de/forum/images/smilies/emojione/2639. png" class="smiley" alt=": -(" height="23" srcset="https: //www. zella. de/forum/images/smilies/emojione/2639@2x. png 2x">

mario

Ah verstehe.

Soll das auf allen Seiten angezeigt werden? Dann würde ich das anders einbinden.

CSS:

< style>
. sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 99000;
top: 0;
left: 0;
background-color: #333;
overflow-x: hidden;
transition: 0. 5s;
padding-top: 60px;
z-index: 6101;
}

. sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 18px;
color: #818181 ! important;
text-decoration: none ! important;
display: block;
transition: 0. 2s;
}

. sidenav a: hover {
color: #f1f1f1 ! important;
text-decoration: none ! important;
}

. sidenav . closebtn {
position: absolute;
top: 0;
left: 25px;
font-size: 36px;
margin-left: 150px;
}

#main {
position: fixed;
z-index: 1;
top: 70px;
left: -10px;
padding: 5px 12px 5px 18px;
font-size: 14px;
color: #fff;
background-color: #333;
border-radius: 0 5px 5px 0;
text-transform: uppercase;
cursor: pointer;
transition: 0. 2s;
}
#main: hover {
left: 0px;
}

#mySidenav {
transition: 0. 1s;
}

@media (max-width: 890px) {
#main {writing-mode: vertical-rl; left: -15px; padding: 5px 4px 5px 18px; }
#main: hover { left: -10px; }
}

@media screen and (max-height: 650px) {
. sidenav {padding-top: 15px; }
. sidenav a {font-size: 18px; }
}
< /style>

HTML:

< div id="mySidenav" class="sidenav">
< a href="javascript: void(0)" class="closebtn" onclick="closeNav()"> ×< /a>
< a href="https: //www. unser-sammler-team. de/"> Startseite< /a>;
< a href="https: //www. unser-sammler-team. de/unser-team. html"> Under Team< /a>
< a href="https: //www. unser-sammler-team. de/rund-ums-ueei. html"> Rund ums ÜEI< /a>
< a href="https: //www. unser-sammler-team. de/72er-displays. html"> 72er Displays< /a>
< a href="https: //www. unser-sammler-team. de/caps. html"> Caps< /a>;
< br>
< a href="http: //codeschnipsel. xobor. de/" target="blank"> Support< /a>
< a href="https: //www. facebook. com/CodeschnipselZP/" target="blank"> Facebook< /a>
< /div>

< div id="main" onclick="openNav()">
< span> ☰ Menü< /span>
< /div>

< script>
function openNav() {
document. getElementById("mySidenav"). style. width = "250px";
}
function closeNav() {
document. getElementById("mySidenav"). style. width = "0";
}
< /script>

Buch88

Hallo Mario, einfach nur perfekt, vielen, vielen Dank, wie soll ich dir das danken! Ich habe schon getestet, der HTML Teil einfach auf jeder Seite einfügen, stimmts? Die neue Seite umfasst im Menü nur

Startseite

Kontakt

Impressum

Datenschutz

Daher ist das schnell erledigt. Danke dir! ! !

mario

https: //www. zella. de/forum/forum/index. php? thread/85-zusatz-links-und-youtube-script/& postID=497#post497">

. . . , der HTML Teil einfach auf jeder Seite einfügen, stimmts?

Das funktioniert, ist aber sehr aufwendig.

Der eigentliche Weg wäre das Widget Quelltext auf die anderen Seiten zu vererben damit Änderungen nur einmal getätigt werden müssen.

Aber auch das ist nicht optimal, vor allem weil das Widget ja nur über den Spaltenmodus aufrufbar ist.

Der beste Weg ist das "HTML mit dem Skript" über Erweitert > Attribute > Standard > footer_script einzufügen. Der Code wird dann automatisch allen Seiten vor dem schließenden < /body> eingefügt und kann jederzeit Projekt-Übergreifend angepasst werden.

Buch88

Danke Mario, also Footer_Script müsste ich anlegen, dort den HTML oder CSS Teil einfügen? Generell ist das aber für mich auch möglich auf jeder Seite einzufügen, wie gesagt, die Seite wird nie länger als Startseite - Kontakt - Impressum und Datenschutz. Das sind vier Seiten!

Buch88

Vielen, vielen Dank Mario! Du leistest eine super Arbeit! Ich habe das Menü jetzt auf jeder Seite mit Quelltext eingefügt, alles geht. Super, ich freue mich total, herzlichen Dank an Dich! Bleib gesund und weiterhin viel Erfolg.

attachment=119

Nächste Seite »