WBCE CMS – Way Better Content Editing.
Du bist nicht angemeldet.
Hallo Leute
Ich habe das scachgar Template bei der WECE 1.1.11 im Einsatz, jedoch zeigt es kein responsive Menü an. (Das Hamburger-icon ist da, aber es passiert nichts beim draufklicken)
Auffällig ist, dass vermutlich der <?php echo $topmenu;?> Aufruf an der richtigen Stelle fehlt.
Nur wo genau plaziere ich den jetzt?
bzw ich habe es soweit geschafft, dass das Menü angezeigt wird, aber leider immer, also nicht ausgeblendet wird.
Beitrag geändert von berny (21.02.2017 11:00:53)
Offline
Glaube eher nicht, dass <?php echo $topmenu;?> fehlt.
Ergänz mal in der standard.js nach
var scrollTopNow = -1;
noch
var ww=0;
Dann sollte es gehen.
Code allein macht nicht glücklich. Jetzt spenden!
Offline
OK, thx, das wars!
Danke!!!
Offline
florian
Jetzt habe ich noch ein Problemchen:
Wenn ich ein Menü mit Untermenü aufmache (also hover) erscheint zwar das Untermenü, aber sobald ich mit der Maus das Menü verlasse, verschwindet auch dass Untermenü.
Da das Untermenü immer links vom kompletten Block angesetzt ist, habe ich keine Chance, auf das Untermenü zu klicken.
Das gleiche ist bei den weiteren Untermenüs.
Wie kann ich das ändern, dass das Menü einfach unterhalb des oberen Menü erscheint, ev sogar untereinander.
Oder dass das Menü stehen bleibt, auch wenn ich den eigentlichen Menüpunkt mit der Maus verlasse.
Offline
Woher die lustigen Template-Namen kommen:
http://www.schachinger.at/
Da steht im CSS:
/*Ausnahmen Unternehmen*/
#nav ul li.liid22:hover ul{left: 300px;}
Scachgar ist nicht ganz so einfach, aber eben mal was anderes.
Hmm
Das wäre jetzt mal ok, jedoch wie schaffe ich es, dass ich das automatisiere....
ich müsste ja sonst für jeden Menüpunkt extra die Ausnahmen schreiben....
Übrigens, ich finde das Template überaus
Offline
Automatisieren lässt sich das nicht, aber ändert sich denn so viel an der Struktur?
Konkret bedeutet das Ausnahmen definieren ja nur, dass die jeweiligen Untermenüs über die Klasse lii+Page-ID der Elternseite und die Anweisung "left" an die richtige Stelle geschoben werden müssen (oder es genug untergeordnete Einträge geben muss, damit die Leiste lang genug wird).
Code allein macht nicht glücklich. Jetzt spenden!
Offline
ok...
Ich warte mal auf die Gesamtstruktur, dann passen wir an.
thx
Offline
So, habs jetzt ein wenig anders gelöst, also Denkansatz...
<ul class="mul[page_id]" style="width:100%;">
Damit wird das Untermenü einfach auf 100% in die Breite gezogen, und ich verlasse mit der Maus eben nicht das Menü.
Vielleicht gibts noch was, dass man einfach den restlichen Balken transparent macht, damit würde dann die Maus das Menü nicht verlassen, aber es schaut optisch gleich aus wie vorher....
Das funktioniert dann auch in allen weiteren Level.
weiters folgender Tag:
style="width:100%; background: #4d7091;"
Die Farbe ist die Hintergrundfarbe des Menüs.
Transparent bewirkt, dass die Schatten usw auch angezeigt werden, man müsste also diese irgendwie deaktivieren.
Inherit bewirkt, dass level 1 blau, level 2 hellgrau angezeigt werden.
Ev hat ja jemand eine Idee, wie man das optimieren könnte...
Beitrag geändert von berny (22.02.2017 13:46:18)
Offline
Ich würde das nicht per style="" da reinverdrahten, weil das evtl. in der mobilen Ansicht stört.
Code allein macht nicht glücklich. Jetzt spenden!
Offline
ok, stimmt, wo gehört das dann genau hin?
Offline
in die template.css
Code allein macht nicht glücklich. Jetzt spenden!
Offline
jo, des woas i eh ;-)
Meinte, wo genau ...
Offline
In der template.css gibt es die Abschnitte
/* Root Level Link Formatting */
und
/* 2nd Child menu */
so um Zz. 150-170 herum, da müsste es dann sinnvoll ergänzt werden.
Code allein macht nicht glücklich. Jetzt spenden!
Offline
thx...... bin am basteln
Offline
gibt das ein bugfix für templates?
ich glaube ich habe ein ähnliches Problem.
Mobil wird das Menü angezeigt aber funktioniert nach dem aufrufen einer Seite ( ab der 3. , keine untermenüs ) nicht mehr. Die Pfeile ( vor und Zurück ) verschwinden dann auch.
html, body {
background: #d1d6de url(img/bodybg.jpg) repeat-x 0 0;
margin: 0; padding: 0;
height:100%;
width:100%;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Layout Blocks
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.wrapper { /* Holds the page items in place */
box-shadow: 0px 20px 40px -20px rgba(0, 0, 0, 0.9);
background:#fff;
}
.wrapper, #topmenubox .m_inner { width: 90%; max-width: 1100px; margin: 0 auto 0 auto;}
.topspacer {padding-top: 140px; width:100%;}
#header_pic {width:100%; margin-bottom:20px;}
/*===========================================================
Contentbereich
/*====================================================
Bloecke
*/
.mainbox {width:96%; margin:0 2% 0 2%;}
.content {width: 60%; float: left; margin-left: 0;}
.sidebar {width: 37%; float: right; }
/*.content p img , #leftbox p img {max-width:100%; height:auto ! important; }*/
.mainbox .contentwide {width:100%; margin:0 0 0 0;}
/* right innerhalb von .contentwide, geht auf mobiles nach oben*/
.mainbox .contentwide .contentwidenarrow {width:100%;}
.clearcontent {height:60px; clear:both; }
.footerbox {height:80px; font-size:11px; color: #999; width: 100%; background: #fff;}
.footerbox .left {width: 25%; margin:0 0 0 0; float:left;}
.footerbox .center {width: 50%; margin: 10px 0 0 0; float:left; text-align:center;}
#gototopswitch {float:right; margin: 10px 10px 0 0}
/* Top and Menu Box */
#topmenubox {width: 100%; height:120px; margin:0 0 0 0; position:fixed; z-index:900; top:0; left:0%; transition: 0.5s all;}
#topmenubox .m_inner {position:relative; height:100%; background: #fff; }
#topmenubox a.logo img {max-height:80%; max-width:100%; position: absolute; left: 2%; bottom:20%;}
#topmenubox.reduced {height:70px; transition: 0.5s all;}
/* Search Box in header */
li.search_box_li a {border: none ! important;}
.menuebox {width: 75%; height:100%; float:left; position:relative;}
.toggleMenu {display:none;}
#openrightboxswitch, #closerightboxswitch{display:none;}
/* nav: see below */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
breadcrumbs vom design kaum moeglich
*/
.breadcrumbs {
height:30px;
line-height:100%;
margin: 0 0 0 0;
padding: 3px 0 3px 0;
clear:both;
}
.innerbc {
font-size:14px;
margin:10px 0 0 0%;
}
.breadcrumbs .innerbc span {
background: transparent url(img/bclink.gif) no-repeat;
padding: 6px 2px 0px 12px; font-weight: normal; }
.breadcrumbs .innerbc a {
padding:1px;
border-bottom: 1px dotted #505567;
text-decoration: none;
}
.breadcrumbs .innerbc a:hover {border-bottom: 1px solid #505567;}
.breadcrumbs .innerbc .menu-current a{
color: #000000;
}
.frontpage .breadcrumbs {display:none;}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
#### Header Menu #####
#######################
Horizontal Drop-Down Menu based off :
http://www.tanfa.co.uk/css/examples/menu/tutorial-h.asp
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* Remove List Formattings
~~~~~~~~~~~~~~~~~~~~ */
#nav {
position: absolute;
right: 0;
bottom:0;
border: 0;
padding:0;
}
#nav ul, #nav2 ul {
list-style-type: none;
list-style-image: none;
margin: 0;
padding: 0;
width: auto;
position: relative;
z-index: 800;
background: #ffffff;
}
#nav ul li, #nav2 ul li {
list-style-type: none;
list-style-image: none;
margin: 0;
padding: 0;
}
/* Root Level Link Formatting */
#nav ul li {float: left; display:inline; color: #aaa; text-align: left; font-weight: normal; list-style-type: none; list-style-image: none ;}
#nav ul li a {display: block; font-size: 16px; border-right:1px #ddd solid; color: #666; text-decoration: none; background-repeat: no-repeat;}
#nav ul li a span {display:block; padding: 11px 12px 10px 12px; }
/* Root Level link hover */
#nav ul li a:hover, #nav li a:focus, #nav li a:active, #nav ul li a.active, #nav a.menu-current, #nav a.menu-parent {color: #fff; background: #00aeef ; }
/*Current page Customisations*/
#nav a.menu-current {font-weight: bold;}
/* 2nd Child menu */
#nav li ul {position: absolute; left:-10000px; top:40px ;width: 100%; opacity:0.0; text-transform: none; background: #ddd ; box-shadow: 0px 10px 10px -4px rgba(0, 0, 0, 0.4);}
#nav li ul li {text-align: left; font-weight: normal; margin: 0; padding: 0; line-height: 1.2em; width:33%;}
#nav li ul li a {height:auto; text-shadow: none; margin:0; padding: 0; color: #333; border-top: 1px solid #fff; font-weight: normal; font-size: 13px; background: none;}
#nav li ul li a span {display:block; padding:8px; }
/* 2nd Child link hover */
#nav li ul a:hover, #nav li ul a.menu-current { background-color: #cc0000; text-shadow: 1px 2px 4px #000;}
/* Show and hide */
#nav li:hover ul, #nav li a:focus ul, #nav li.tabselected ul { left:0; margin: -3px 0 0 0; opacity:1; transition:0.5s opacity;}
#nav li ul ul { margin-left: -10000px; opacity:0.0; transition:0.5s opacity;}
#nav li:hover ul ul, #nav li.subMenu ul ul { margin-left: -10000px; opacity:0.0; transition:0.5s opacity;}
#nav li:hover>ul, #nav li li:hover>ul { opacity:1; margin-left: 0; transition:0.5s opacity; z-index: 1000;}
/*neu*/
#nav ul li {background:#4d7091; }
#nav ul li a {color:#fff; }
#nav ul li ul { border-right: 1px solid #ccc; }
#nav ul li ul, #nav ul li ul li {background:#f1f1f1; border-bottom:none;}
#nav ul li ul li a {color:#000; border: none;}
/*ohne*/
#nav ul li ul, #nav ul li ul li {width:auto; }
#nav ul li ul li a {width:auto; padding:3px; border-left: 1px solid #ccc;}
#nav ul li ul li a span {}
/* Better: */
#nav li:hover {
z-index: 900; /* ...and here. this makes sure active item is always above anything else in the menu */
white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}
/* end menu */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* subnav */
#nav { bottom: 30px; }
#subnav{
position: absolute;
right: 0;
bottom: 0;
border: 0;
padding: 0;
height: 30px;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* Slider */
.rslides {
position: relative;
list-style: none;
overflow: hidden;
width: 100%;
padding: 0 ;
margin: 0 0 30px 0;
}
.rslides, .rslides li {padding:0; list-style:none; list-style-image:none;}
.rslides ul li {
-webkit-backface-visibility: hidden;
position: absolute;
display: none;
width: 100%;
left: 0;
top: 0;
}
.rslides li:first-child {
position: relative;
display: block;
float: left;
}
.rslides img {
display: block;
height: auto;
float: left;
width: 100%;
border: 0;
}
/* Login Box */
#showlogin {display: block; margin: 20px 0 0 10px;}
#login-box { margin-top:0; padding-left:10px; font-size: 10px;}
#login-box .inputfield {
font-size: 10px;
padding:2px;
border: 1px solid #505567;
background-color: #f2f3f8;
width:100%;
}
#login-box .loginsubmit { float:right;}
/* Search Box in header */
#search_box { position:absolute; padding:0 5px; width:138px; height:0px; right:0; top:0; background:#d1d6de; transition:1s all; overflow:hidden;}
#search_box.visible { height:22px; padding:5px;}
.search_box .searchstring { width:70%; border: 1px solid #ddd; font-size:14px; padding:3px;}
.search_box .searchbutton { vertical-align: top; margin: 1px 0 0 5px; }
#aprevnext {display:block; width:90px; height:27px; position:absolute; right:0; top:0;}
#aprevnext a {display:block; width:40px; height:27px; float:right; opacity:0; border:none;}
#aprevnext a.aprev {background: url(img/prev.png) no-repeat center top; }
#aprevnext a.anext {background: url(img/next.png) no-repeat center top; }
#aprevnext a:hover {opacity:0.8}
.frontpage #aprevnext a.aprev {display:none;}
.showonmobiles {display:none;}
/* ====================================================================================================================
Responsive:
*/
@media screen and (min-width: 1025px) {
}
/*Smaller Screens */
@media screen and (max-width: 1240px) {
.wrapper, #topmenubox .m_inner { width: 98%;}
}
/*Smaller Screens */
@media screen and (max-width: 1024px) {
.wrapper, #topmenubox .m_inner {width:100%; margin: 0 0 0 0;}
body {font-size: 14px;}
.mainbox {width:96%; margin-left:2%; padding-top:30px;}
#topmenubox {height: 60px ! important; box-shadow: 0px 20px 40px -20px rgba(0, 0, 0, 0.4);}
#topmenubox #nav {display:none;}
.logobox a.logo {width: 210px; height:160px; margin-bottom:20px;}
.toggleMenu {display:block; float:right; width:20px; height:50px; background: url(img/menuswitch.png) no-repeat top right; margin:10px 4% 0 0;}
.topspacer {position: relative; height: auto ! important; margin-top: 60px; padding-top:0; padding-bottom: 0%; background-position: center top;}
/*Nav*/
.breadcrumbs { height:560px; }
#nav2 {width:250px; height: auto; position:absolute; left:0; top:100px; z-index:2000; }
#nav2 {background: #eee url(img/glitzi.png) no-repeat right 0px; box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.4);}
#nav2 li {width:250px; padding: 0 0 0 0; }
#nav2 li a {display:block; padding: 12px 0 12px 20px; font-size:18px; color:#000; text-decoration: none; border-bottom: 1px solid #fff;}
#nav2 li li a {padding: 10px 0 10px 30px; font-size:16px; }
#nav2 li li li a {padding: 8px 0 8px 40px; font-size:14px; }
#nav2 li li li li a {padding: 6px 0 6px 50px; font-size:13px; ;}
#nav2 li ul {display:none;}
#nav2 li.menu-parent > ul, #nav2 li.menu-current > ul {display:block;}
#nav2 li.is_opened > ul, #nav2 li.is_opened > ul {display:block;}
#nav2 li a.menu-expand {background: transparent url(img/arr-down.png) no-repeat left center ;}
#nav2 li a.menu-current { color:#fff; background-color: #cc0000; text-shadow: 1px 2px 4px #000;}
#nav2 ul li a.menu-expand.is_opened, #nav2 ul li a.menu-parent {font-weight:bold; background: #ddd url(img/arr-right.png) no-repeat 2px center ; }
#nav2close {display:none; position:absolute; top:0; width:100%; height: 900px; background-image:none;}
/*
.breadcrumbs { width: 100%; height: auto; }
.innerbc { margin: 2px 0 5px 2%; width: 96%; }
.innerbc span {display: block; float:left; padding: 2px 2px 2px 12px; margin: 0 0 5px 0;}
.innerbc b {display: none;}
*/
#nav2 .search_box_li {display: none;}
.search_box { margin: 0 0 10px 20px;}
#subnav {right:70px; top: 15px; }
#aprevnext a {opacity:0.5;}
}
@media screen and (max-width: 800px) {
}
/* ======================================================================
Smaller Screens */
@media screen and (max-width: 600px) {
.content, .sidebar {width:96%; margin-left:2%; float:none;}
.mainbox .contentwide .contentwidenarrow, .sidebar {float: none; width:96%; border-left:none; }
}
@media screen and (max-width: 480px) {
#subnav {right:50px; }
}
Offline
Its now 2019, and the template SCACHGAR is still not working on the download site, this is no advertising for WBCE.
and somewhere else in TXT template : Auch sonst gibt es ein paar Dinge, die stören könnten. Ich hatte keine Lust mehr. Vielleicht ein andermal. ??
Isn't it better to make this right ?
Thank you in advance.
Offline
Navigation is fixed
Code allein macht nicht glücklich. Jetzt spenden!
Offline
ähh, auch hier? https://wbce.at/tpls/template-scachgar.html
Wenn man mit der Maus über z.B. Topics fährt, so kann man gar nicht die Preset Demos ganz links anklicken. Auch sonst wird die 3. Ebene nicht schön angezeigt, weil die die 2. Ebene überlagert ...
Beitrag geändert von ice (30.01.2019 19:40:52)
Offline
Es ging nur um den JS-Fehler, der die mobile Navigation lahmgelegt hat. Das von Dir beobachtete Phänomen ist templatespezifisch, die Navigation von Scachgar ist halt sehr speziell und nicht für umfangreiche Seiten geeignet. (Für kleinere hingegen durchaus)
Code allein macht nicht glücklich. Jetzt spenden!
Offline
Achso ... okay ;-)
Offline
Thank you Florian !
Offline
Hallo,
ich hake an dieser Stelle einmal nach um keinen neuen Thread aufzumachen. Untermenüs unterstützt das Template nicht?
Ich kann die nämlich nicht auswählen. Sie erscheinen ich direkt unter dem Menüpunkt und verschwinden, wenn ich die Maus zum Submenü bewege...
p.s nicht am Handy sondern am Desktop, zum Mobilemenü komme ich später
Beitrag geändert von nickfake (21.02.2019 10:53:35)
Offline
Doch, an sich schon, siehe auch Verhalten auf wbce.at/tpls. Das beschriebene Problem tritt auf, je weiter rechts ein Menüpunkt steht und je weniger Unterpunkte dieser hat. Da muss man dann ein bisschen an der Reihenfolge und der Struktur der Seite drehen, dann geht das auch. (Beispiel)
Code allein macht nicht glücklich. Jetzt spenden!
Offline
Verstanden, danke dir!
Offline