Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
Hi,
I had a custom php script for that working under CE4 and now thought, that this feature was implemented in the pangolin php plugins file as
current_page_menu_item
also see:
http://community.theturninggate.net/vie … hp?id=7246
So, for testing, I created a class in my custom css
.current_page_item {color: red}
with the php code enabled:
function scripts() {
echo <<<SCRIPT
<script>
$("ul.menu a[href='" + window.location.pathname + "']")
.parentsUntil('.menu', 'li')
.addClass("current_page_item")
;
</script>
SCRIPT;
return false;
} // END /**/
But it is not doing anything? Any help would be great!
Thanx
Offline
can you post a link?
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
http://testsite.petervogel.com/kontakt/
or did you mean a link to the phplugins file?
Offline
the reason you're not seeing your color is because of css specificity. There's a rule that has a more specific selectors that's overriding your css:
nav.nav .menu-item, nav.nav .menu-item a, nav.nav .menu-item span {
color: #505050;
}
so you can try writing something more specific
and it looks like the a element needs to be targeted.
If I took more time I could probably write a specific enough rule without using !important, but ....
anyway, try this in your css instead:
li.current_page_item a {
color: #0049d6 !important
}
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Ok, thanx for the hint, I will try that out later, when I have time.
edit: Had to try it out now and it works! Great, thanks!
Doesn't seem to work for submenus though, I thought that the plugin code also was working on those.
Last edited by skipper (2019-02-28 00:09:59)
Offline
No, but you could probably modify it to also affect the sub-menu class
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
No, but you could probably modify it to also affect the sub-menu class
You could probably;-) I certainly am not able to do any of that stuff. I am happy, when I can change some formatting via css now.
So, if any person would be interested to implement that for sub menu....I would be mor than thankful!
Offline
not tested (and it could possibly break things) but you can try adding this right after the first script.
<script>
$("ul.sub-menu a[href='" + window.location.pathname + "']")
.parentsUntil('.menu .sub-menu', 'li')
.addClass("current_page_item")
;
</script>
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
not tested (and it could possibly break things) but you can try adding this right after the first script.
<script>
$("ul.sub-menu a[href='" + window.location.pathname + "']")
.parentsUntil('.menu .sub-menu', 'li')
.addClass("current_page_item")
;
</script>
I always keep a testing site, so it is ok, if things break;-)
I put the code in;
function scripts() {
echo <<<SCRIPT
<script>
$("ul.menu a[href='" + window.location.pathname + "']")
.parentsUntil('.menu', 'li')
.addClass("current_page_item")
;
</script>
<script>
$("ul.sub-menu a[href='" + window.location.pathname + "']")
.parentsUntil('.menu .sub-menu', 'li')
.addClass("current_page_item")
;
</script>
SCRIPT;
return false;
} // END /**/
It doesn't seem to do the trick, but also doesn't break things.
Thanks for trying anyway!
Offline
it might be that .parentsUntil section. I'm not sure yet exactly how that works
https://api.jquery.com/parentsUntil/
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
I have the solution for this as follows for children as well additionally this simple example also has the added support of if you wanted to highlight the menus even for galleries.
echo '
<style type="text/css">
.selected
{
background-color: red !important;
color: yellow !important;
}
</style>
<script>
$(function()
{
var pname = window.location.pathname; // Get the Pathname
if (pname.indexOf("galleries/") == 1) // if Top-level Gallery
{
var pname = pname.substr(10, 11); // Strip off the actual Page
} // Otherwise it is a normal Page (meaning non-gallery)
// populate the menu and children
$("ul.menu a[href=\'" + pname + "\']")
.parentsUntil(".menu", "li")
.addClass("selected").parents("li").children("a").addClass("selected");
});
</script>
';
This is working on my website [fully tested] and it works with search results as well. I put this in my scripts function plugin but you can use it the way you code it.
One more thing this piece of the code above depends on your system and how your galleries are setup.
if (pname.indexOf("galleries/") == 1) // if Top-level Gallery
{
var pname = pname.substr(10, 11); // Strip off the actual Page
} // Otherwise it is a normal Page (meaning non-gallery)
Last edited by mad (2019-04-02 02:32:08)
Offline
This is working on my website [fully tested] and it works with search results as well. I put this in my scripts function plugin but you can use it the way you code it.
Well, I don't code at all, I am happy if I get some css working;-)
Copying your exact function in my php-plugins created an error. So I added:
"function scripts() {"
//then your part
echo '
<style type="text/css">
.selected
{
background-color: red !important;
color: yellow !important;
}
</style>
<script>
$(function()
{
var pname = window.location.pathname; // Get the Pathname
if (pname.indexOf("galleries/") == 1) // if Top-level Gallery
{
var pname = pname.substr(10, 11); // Strip off the actual Page
} // Otherwise it is a normal Page (meaning non-gallery)
// populate the menu and children
$("ul.menu a[href=\'" + pname + "\']")
.parentsUntil(".menu", "li")
.addClass("selected").parents("li").children("a").addClass("selected");
});
</script>
';
and added a
"}"
Like this it works on the menus and children, if those pages are regular pages. In Galleries it doesn't work for children on my site. Also the background color is red, but the text color is not yellow.
Thanx for sharing this though!
I think that the menu select feature should be an integrated part of BL2.
Offline
For the children on your site you need to change this section of the code to how your galleries and its children are set up.
This is particular to my system. My children are exactly 10 chars plus the leading '/' which makes 11 chars to strip; so it looks like this /galleries/mychildno1 and after the strip it looks like this /mychildno1 if you have something like /galleries/catalogs/mychildno1/ then you need to strip from the back your slug length characters minus the last '/' in my case something like this var parname = pname.substr(-1,11) // instead of the strip of below a negative number uses it as a character index from the end of the string remember 0 is the first character in this case the last '/'.
if (pname.indexOf("galleries/") == 1) // if Top-level Gallery
{
var pname = pname.substr(10, 11); // Strip off the actual Page
} // Otherwise it is a normal Page (meaning non-gallery)
Offline
Hi Mad,
thanks for the effort and explanation! I still don't quite get the code part for the children. All my galleries have names with different character lengths, so your method wouldn't work with it, would it?
Offline