Page 1 of 3

using image in menu

Posted: Tue Oct 12, 2021 3:50 pm
by bastingse
Folks, i wonder if it is possible to using an image in the menu of the jekyllandhyde template instead of showing 'Home" or "contact"?
I know it is being ask here before but no solution came up that i can use on jekyllandhyde.
Toxic_XH isn't working.... :-(

Re: using image in menu

Posted: Tue Oct 12, 2021 7:10 pm
by lck
bastingse wrote:
Tue Oct 12, 2021 3:50 pm
Toxic_XH isn't working.... :(
Yes, unfortunately Toxic_XH does not work here, because here not a standard menu but a special menu is created and output via template.htm. Unless Christoph knows a solution how to use Toxic here as well :?: .
bastingse wrote:
Tue Oct 12, 2021 3:50 pm
Folks, i wonder if it is possible to using an image in the menu of the jekyllandhyde template instead of showing 'Home" or "contact"?
The following would be possible via CSS:

Code: Select all

.lck_nav a[href$="/?Home"],
.lck_nav a[href$="/?Contact"] {
	color: transparent;
}
.lck_nav a[href$="/?Home"]:before,
.lck_nav a[href$="/?Contact"]:before {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.lck_nav a[href$="/?Home"]:before {
	content: url(images/home.gif);
}
.lck_nav a[href$="/?Contact"]:before {
	content: url(images/contact.gif);
}
But this only affects the horizontal menu (desktop menu) and not (yet) the mobile menu. Maybe it is not wanted/needed there and it is sufficient as it is.

Re: using image in menu

Posted: Tue Oct 12, 2021 8:45 pm
by cmb
bastingse wrote:
Tue Oct 12, 2021 3:50 pm
Toxic_XH isn't working.... :-(
Yeah, this and several other templates use modified tocs() which is relatively simple as of CMSimple_XH 1.6.3, and Toxic_XH was developed before that. It probably doesn't make much sense to further maintain that plugin at all; I don't know whether anybody ever used the categories;most likely the ability to set specific classes for individual pages is what is desired. Morepagedata_XH can do a part of this (although it's overkill), and the rest could be adapted as well, but let's see whether Ludwig's suggestion is a a step in the right direction, or even the solution.

Re: using image in menu

Posted: Wed Oct 13, 2021 9:03 am
by lck
lck wrote:
Tue Oct 12, 2021 7:10 pm
The following would be possible via CSS:
Changed the above code a bit so that it also works for menu links without subpages (.ddm_link removed).

Re: using image in menu

Posted: Wed Oct 13, 2021 9:42 am
by bastingse
Ick, cmb, thanks for think along with this issue.
Gonna try this later on!!
Thanks!!!

Re: using image in menu

Posted: Wed Oct 13, 2021 1:39 pm
by bastingse
YES !! It works !! :D
Huhhhh... but only when logged in as admin. Soon as logout it shows text "Home" again :o
Delete cookies, using another browser.... nope, doesn't help???

I did add the code to startpage.css and stykesheet.css

Re: using image in menu

Posted: Wed Oct 13, 2021 3:19 pm
by lck
bastingse wrote:
Wed Oct 13, 2021 1:39 pm
Huhhhh... but only when logged in as admin. Soon as logout it shows text "Home" again
Delete cookies, using another browser.... nope, doesn't help???
My mistake, sorry. You have to put that in the lck_ddmenu.css best at the end.

Re: using image in menu

Posted: Wed Oct 13, 2021 4:02 pm
by cmss
Bei Toxic ist natürlich im Template.htm toc und li durch toxic bzw. toxic_li zu ersetzen, sonst gehts nicht - bei mir ging es früher - unter xampp php8 jetzt nicht mehr(FHS ancorific). Der Grund ist ersichtlich :
* Es klappt nicht, wenn ein Template nur ein toc() hat und kein ersetzbares li, oder wenn es ein eigenes Menu aufbaut wie bei Jekyll etc..
* Bei meinem sm-simpl-blue(smartmenus ohne toc() ) brauche ich nur li(hc,1) durch toxic_li() zu ersetzen , und es geht !
* Es wäre schön, wenn es allgemein auch mit nur-toc (wieder) ginge - oder ein kleiner Patch...!
* Man könnte auch den Pagemanager um diese Fähigkeit erweitern.

.cro1::before, .cro2::before {
display: inline-block;
font-style: normal; font-size:14px;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
.cro2::before {
font-family: "Font Awesome 5 Free"; font-weight: 900;
content: "\f521"; margin-right:8px;
}

a[target="_blank"]:after { content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==)
margin: 0 3px 0 5px;}

* window.location= “#Ankername”; ul.menulevel2 li:nth-child(3n+3) { color: #ccc; }
* Jquery hat noch weitere entsprechende Möglichkeiten. $(this).find("i").addClass("icon-arrow-down");
* Ein JS https://www.bryanbraun.com/anchorjs/ anchor.js
* Der webix-Framework https://github.com/webix-hub/webix hat auch einiges zu bieten

Re: using image in menu

Posted: Thu Oct 14, 2021 10:37 am
by bastingse
My mistake, sorry. You have to put that in the lck_ddmenu.css best at the end.
Unfortunatly no, it does not work. I removed it from start and style css, then added it to lck_ddmenu but the same thing happends.
Removed all cookies, browser history and so on...... The image is still only show up when logged in as admin to cmsimple :shock:

Re: using image in menu

Posted: Thu Oct 14, 2021 11:03 am
by cmss
Mal (Firefox) mit der echten Maustaste auf den Menü-Link klicken - > untersuchen :
(Click once (Firefox) with the right mouse button on the menu link -> examine: )
<li class="docs">
<span class="ddm_link">
<a href="/xhclb38/Contents">Contents</a></span>
<span class="ddm_opener"><a href="javascript:void(0)" onclick="return false;">
<span class="ddm_opener_icon"></span></a>
</span>
----------------------dann rechts schauen (then look right ):
.lck_nav .menulevel1 > li:nth-child(n), .lck_nav .menulevel1 > li:nth-child(n) > ul li {
background-color: transparent;
}
----------------------------------------------------------bzw. zum Anker(or to the anchor ) :
.lck_nav .ddm_link a {
box-sizing: border-box;
text-align: right;
}
----> all(es) in Ick_ddmenu.css
Ich würde mal dort ansetzen und .ddm_link hinzufügen (Toxic kann hier nicht funktionieren)
(I would go there and add .ddm_link (Toxic can't function here) )