Hallo, leider ist das Widget auf 10 Einträge begrenzt, wie kann ich dies erhöhen? Ich habe ein Newssystem gebaut und jede Seite ist ein Jahr, da ich von 2011 bis 2023 schon mehr als 10 Seiten benötige, wäre das toll, wenn es umsetzbar wäre. Dankeschön.
WZP Seiten Navigation V1.5
-
Mal sehen ob ich es in naher Zukunft schaffe das Widget zu modernisieren und zu erweitern.
Du kannst das Widget aber auch erweitern.
1.
In der widget.json folgendes erweitern:
Code
Alles anzeigen{ "displayName": "Verweise 6-10", "name": "verweise6-10", "popupHeightInPixel": 390, "type": "group", "defaultValue": "", "fields": [ { "displayName": "Verweis 6", "name": "link6", "type": "url-selection", "defaultValue": "https://www.zella.de/widget/" }, { "displayName": "Linktext 6", "name": "linktext6", "type": "text-singleline", "defaultValue": "Link 6" }, { "displayName": "Verweis 7", "name": "link7", "type": "url-selection", "defaultValue": "https://www.zella.de/widget/" }, { "displayName": "Linktext 7", "name": "linktext7", "type": "text-singleline", "defaultValue": "Link 7" }, { "displayName": "Verweis 8", "name": "link8", "type": "url-selection", "defaultValue": "https://www.zella.de/widget/" }, { "displayName": "Linktext 8", "name": "linktext8", "type": "text-singleline", "defaultValue": "Link 8" }, { "displayName": "Verweis 9", "name": "link9", "type": "url-selection", "defaultValue": "https://www.zella.de/widget/" }, { "displayName": "Linktext 9", "name": "linktext9", "type": "text-singleline", "defaultValue": "Link 9" }, { "displayName": "Verweis 10", "name": "link10", "type": "url-selection", "defaultValue": "https://www.zella.de/widget/" }, { "displayName": "Linktext 10", "name": "linktext10", "type": "text-singleline", "defaultValue": "Link 10" } ]2.
in der 10-Links.html dieses erweitern:
Code<a <$= system.partial('zplink-expanded.html', 'link1') $>><$= article.value("linktext1") $></a> <a <$= system.partial('zplink-expanded.html', 'link2') $>><$= article.value("linktext2") $></a> <a <$= system.partial('zplink-expanded.html', 'link3') $>><$= article.value("linktext3") $></a> <a <$= system.partial('zplink-expanded.html', 'link4') $>><$= article.value("linktext4") $></a> <a <$= system.partial('zplink-expanded.html', 'link5') $>><$= article.value("linktext5") $></a> <a <$= system.partial('zplink-expanded.html', 'link6') $>><$= article.value("linktext6") $></a> <a <$= system.partial('zplink-expanded.html', 'link7') $>><$= article.value("linktext7") $></a> <a <$= system.partial('zplink-expanded.html', 'link8') $>><$= article.value("linktext8") $></a> <a <$= system.partial('zplink-expanded.html', 'link9') $>><$= article.value("linktext9") $></a> <a <$= system.partial('zplink-expanded.html', 'link10') $>><$= article.value("linktext10") $></a>3.
Extras > Entwickler > Änderungen übernehmen
In der Gruppe Verweise 6-10 sollte nun ein Scrollbalken erscheinen mit welchem zu die zusätzlichen Links erreichen kannst.
-
-
Hallo Mario habe leider doch noch ein Problem entdeckt, wenn ich das Menü öffne, steht jetzt 1 bis 10 und dann beginnt das Menü wieder bei 1, also ich kann die Links nicht darstellen im eigentlichen Menü
Kannst du mir da helfen? Dankeschön.Dazu müsste ich die deine Änderungen sehen. So kann ich auch nur raten.
-
Tut mir leid, das hatte ich vergessen, habe nur das geändert, was oben stand. Hier die Bilder.
-
Nur anhand der Screenshots kann ich da leider nichts erkennen.
-
10-Links.HTML
<$
var cssClass = article.cssClass
""; var inlineCss = article.inlineCss "";if ( cssClass ) {cssClass = "sidenav " + cssClass;}
else {cssClass = "sidenav";}
if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
var FeHgCol = article.value("fenster-hg-farbe","");
var FeBordCol = article.value("fenster-border","");
var GeschwMS = article.value("geschw","");
var cssselector = '' + '.sidenav ';
var headstyle = "";
if ( FeHgCol !== "" ){headstyle += cssselector + "{background-color: " + FeHgCol + " !important;}\n";}
if ( FeBordCol !== "" ){headstyle += cssselector + "{border-left: 1px solid " + FeBordCol + " !important;}\n";}
if ( GeschwMS !== "" ){headstyle += cssselector + "{transition: " + GeschwMS + "ms !important;}\n";}
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var cssClass = article.cssClass
""; var inlineCss = article.inlineCss "";if ( cssClass ) {cssClass = "sidenav a " + cssClass;}
else {cssClass = "sidenav a";}
if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
var FeTextGr = article.value("fenster-textgroesse","");
var FeLinkCol = article.value("fenster-link-farbe","");
var cssselector = '' + '.sidenav a ';
var headstyle = "";
if ( FeTextGr !== "" ){headstyle += cssselector + "{font-size: " + FeTextGr + "px !important;}\n";}
if ( FeLinkCol !== "" ){headstyle += cssselector + "{color: " + FeLinkCol + " !important;}\n";}
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var cssClass = article.cssClass
""; var inlineCss = article.inlineCss "";if ( cssClass ) {cssClass = "sidenav a:hover " + cssClass;}
else {cssClass = "sidenav a:hover";}
if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
var FeLinkColHov = article.value("fenster-link-farbe-hover","");
var cssselector = '' + '.sidenav a:hover ';
var headstyle = "";
if ( FeLinkColHov !== "" ){headstyle += cssselector + "{color: " + FeLinkColHov + " !important;}\n";}
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var cssClass = article.cssClass
""; var inlineCss = article.inlineCss "";if ( cssClass ) {cssClass = "button-sidenav " + cssClass;}
else {cssClass = "button-sidenav";}
if ( inlineCss ) {inlineCss = ' style="' + inlineCss + '"';}
var ButCol = article.value("farbe-text-button","");
var ButHgCol = article.value("hg-farbe-button","");
var ButTop = article.value("pos-button","");
var cssselector = '' + '#button-sidenav ';
var headstyle = "";
if ( ButCol !== "" ){headstyle += cssselector + "{color: " + ButCol + " !important;}\n";}
if ( ButHgCol !== "" ){headstyle += cssselector + "{background-color: " + ButHgCol + " !important;}\n";}
if ( ButTop !== "" ){headstyle += cssselector + "{top: " + ButTop + "px !important;}\n";}
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var Breakpoint = article.value("button-drehen","");
var MobPosBut = article.value("mobile-pos-button","");
var headstyle = '@media (max-width: ' + Breakpoint + 'px) {';
headstyle += '#button-sidenav {';
headstyle += 'writing-mode:' + 'vertical-rl;';
headstyle += 'right:' + '-14px;';
headstyle += 'padding:' + '5px 18px 5px 4px;';
headstyle += 'top: ' + MobPosBut + 'px !important;';
headstyle += 'margin-top:' + '70px;';
headstyle += '}';
headstyle += '}';
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var Breakpoint = article.value("button-drehen","");
var headstyle = '@media (max-width: ' + Breakpoint + 'px) {';
headstyle += '#button-sidenav:hover {';
headstyle += 'right:' + '-4px;';
headstyle += '}';
headstyle += '}';
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var FeMobPx = article.value("fenster-ab-px","");
var AbstO = article.value("mobile-abstand-oben","");
var headstyle = '@media (max-height: ' + FeMobPx + 'px) {';
headstyle += '.sidenav {';
headstyle += 'padding-top: ' + AbstO + 'px !important;';
headstyle += '}';
headstyle += '}';
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<$
var FeMobPx = article.value("fenster-ab-px","");
var MobSize = article.value("mobile-schriftgroesse","");
var headstyle = '@media (max-height: ' + FeMobPx + 'px) {';
headstyle += '.sidenav a {';
headstyle += 'font-size: ' + MobSize + 'px !important;';
headstyle += '}';
headstyle += '}';
system.addHtmlHeadElement("<st" + "yle>\n" + headstyle + "\n</st" + "yle>");
$>
<!--
***********************************************************************************
* Widget ZP / Widgets fuer Zeta Producer
* <$= article.widgetName $>
* Mario Gross / widget-zp.de
***********************************************************************************
-->
<$=system.partial("article-begin.html")$>
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<a <$= system.partial('zplink-expanded.html', 'link1') $>><$= article.value("linktext1") $></a>
<a <$= system.partial('zplink-expanded.html', 'link2') $>><$= article.value("linktext2") $></a>
<a <$= system.partial('zplink-expanded.html', 'link3') $>><$= article.value("linktext3") $></a>
<a <$= system.partial('zplink-expanded.html', 'link4') $>><$= article.value("linktext4") $></a>
<a <$= system.partial('zplink-expanded.html', 'link5') $>><$= article.value("linktext5") $></a>
<a <$= system.partial('zplink-expanded.html', 'link6') $>><$= article.value("linktext6") $></a>
<a <$= system.partial('zplink-expanded.html', 'link7') $>><$= article.value("linktext7") $></a>
<a <$= system.partial('zplink-expanded.html', 'link8') $>><$= article.value("linktext8") $></a>
<a <$= system.partial('zplink-expanded.html', 'link9') $>><$= article.value("linktext9") $></a>
<a <$= system.partial('zplink-expanded.html', 'link10') $>><$= article.value("linktext10") $></a>
<a <$= system.partial('zplink-expanded.html', 'link11') $>><$= article.value("linktext11") $></a>
<a <$= system.partial('zplink-expanded.html', 'link12') $>><$= article.value("linktext12") $></a>
<a <$= system.partial('zplink-expanded.html', 'link13') $>><$= article.value("linktext13") $></a>
<a <$= system.partial('zplink-expanded.html', 'link14') $>><$= article.value("linktext14") $></a>
<a <$= system.partial('zplink-expanded.html', 'link15') $>><$= article.value("linktext15") $></a>
</div>
<div id="button-sidenav" onclick="openNav()">
<span>☰ <$= article.value("text-button") $></span>
</div>
<script>
function openNav() {
document.getElementById("mySidenav").style.width = "<$= article.value("fenster-breite") $>px";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
}
</script>
<!--############ ANFANG HINWEISFENSTER FUER LIVEVORSCHAU -->
<$ if ( system.preview ) { $>
<!-- Preview-Code nur für internen Vorschau -->
<div style="background-color:#d7daee; padding:15px; border-radius: 10px; box-shadow: inset 0px 0px 20px rgba(0, 51, 255, 0.99);">
<img src="https://www.zella.de/widget/bilder/wzp.png" style="float:left; margin-right:33px;">
<p style="font-size: 1.2em; font-weight: bold; color:#0371df">Seiten-Navigation</p>
<p style="color:#0371df">Hier können Sie das Widget öffnen oder löschen. Dieser Hinweis wird nur in der internen Vorschau angezeigt.</p>
</div>
<$ } else { $>
<$ } $>
<!--########## ENDE HINWEISFENSTER FUER LIVEVORSCHAU -->
<$=system.partial("article-end.html")$>
-
In der widget.json hattest du ein paar Klammern falsch gesetzt. Da hätte ZP eigentlich eine Fehlermeldung ausspucken müssen.