Custom Menus for mobile using phpplugins not working

rod barbee · 2019-02-27 10:49:00

Yep

Daniel Leu · 2019-02-27 13:10:31

My implementation only exposes sub-menus of the current page: /galleries, /projects, /blog. So it is a bit fancier than just showing one level.

You can do this with CSS nowadays thanks to the body classes. I used jquery and php when I did this implementation for Bl1.

scottfrey · 2019-02-28 01:03:58

no luck, still displays children. however;
(from my page)

<div id="page__pallet__T1" class="page__column page__pallet" data-position="T1">
	<div class="content clearfix">


<nav class="nav nav_v">
 

<ul class="primary-menu menu mouseable"><li class="menu-item menu-item-has-children"><a href="/portfolio/"><b>Portfolios</b></a><ul class="sub-menu"><li class="menu-item"><a href="/portfolio/age/">Age</a></li>
<li class="menu-item"><a href="/portfolio/artifacts/">Artifacts</a></li>

These are what needs to be suppressed:
<li class="menu-item"><a href="/portfolio/artifacts/">Artifacts</a></li>
I tried:

#page__pallet__T1 li.menu-item {
    display: none;
}

but that doesn't do it either. I don't know enough about CSS to know if I can just switch it like that. It does feel like this is the road to go down though.

rod barbee · 2019-02-28 01:08:13

You need to use the child pseudo selector.
Look at Daniel’s css file, you’ll find it there

scottfrey · 2019-02-28 01:10:03

You need to use the child pseudo selector.

I have no idea what a child pseudo selector is (I looked at his CSS, but I wouldn't know if I saw it)

rod barbee · 2019-02-28 01:30:55

on the child psuedo selector: https://www.w3schools.com/cssref/sel_nth-child.asp

This looks like what Daniel's using to allow the first level of the sub-menu to appear:

.menu-item:nth-child(2) > .sub-menu {
	display: block;
}

scottfrey · 2019-02-28 01:42:04

Sorry Rod, I don't understand how to apply that in this context. is a LI a child of UL? or is li.menu-item a child of page__pallet__T1?

if the latter, is this what you mean?:

 #page__pallet__T1:nth-child(2) > li.menu-item {
    display: none;
}

which still doesn't work

scottfrey · 2019-02-28 01:43:13

I want to suppress every li.menu.item, not every second one or anything, so not sure how it applies

Last edited by scottfrey (2019-02-28 01:48:44)

scottfrey · 2019-02-28 01:55:27

If I understand pseudo selection correctly (which I doubt), what Daniel is selecting for is the 'sub-menu' of the 2nd item of his menu (i.e. his Galleries) and forcing display. Is that correct? Which is not at all why I am trying to do

Daniel Leu · 2019-02-28 01:59:56

scottfrey wrote:

These are what needs to be suppressed:
<li class="menu-item"><a href="/portfolio/artifacts/">Artifacts</a></li>
I tried:
#page__pallet__T1 li.menu-item {
    display: none;
}
but that doesn't do it either. I don't know enough about CSS to know if I can just switch it like that. It does feel like this is the road to go down though.

I used following code on your site to suppress all submenus on mobile:

#page__pallet__T1 ul.sub-menu {
    display: none;
}

Note that I used 'ul' while you used 'il'!

scottfrey · 2019-02-28 02:08:13

YES! That works Daniel!!!!

Rod, you should write this up for your tips site.

Daniel Leu · 2019-02-28 02:11:48

rod barbee · 2019-02-28 05:40:00

scottfrey wrote:

I want to suppress every li.menu.item, not every second one or anything, so not sure how it applies

Ah, sorry. I thought you were trying to emulate what Daniel did on his Galleries page.

Community @ The Turning Gate

#26 2019-02-27 10:49:00

Re: Custom Menus for mobile using phpplugins not working

#27 2019-02-27 13:10:31

Re: Custom Menus for mobile using phpplugins not working

#28 2019-02-28 01:03:58

Re: Custom Menus for mobile using phpplugins not working

#29 2019-02-28 01:08:13

Re: Custom Menus for mobile using phpplugins not working

#30 2019-02-28 01:10:03

Re: Custom Menus for mobile using phpplugins not working

#31 2019-02-28 01:30:55

Re: Custom Menus for mobile using phpplugins not working

#32 2019-02-28 01:42:04

Re: Custom Menus for mobile using phpplugins not working

#33 2019-02-28 01:43:13

Re: Custom Menus for mobile using phpplugins not working

#34 2019-02-28 01:55:27

Re: Custom Menus for mobile using phpplugins not working

#35 2019-02-28 01:59:56

Re: Custom Menus for mobile using phpplugins not working

#36 2019-02-28 02:08:13

Re: Custom Menus for mobile using phpplugins not working

#37 2019-02-28 02:11:48

Re: Custom Menus for mobile using phpplugins not working

#38 2019-02-28 05:40:00

Re: Custom Menus for mobile using phpplugins not working

Board footer