Not working

Hi,

I just checked your page and there’s no some target element (i.e. seems that the shortcode didn’t work).

Does KC pro editor support shortcodes? Maybe it has a special shortcode block?

I just saw this article about your editor/page builder:

https://docs.kingcomposer.com/smooth-page-scroll-to-an-anchor/

You could use the “Row ID” field to add the targets you want. For example, add the some value in the “Row ID” field of the element you want (instead of using the shortcode).

Nice, it works, thanks.

Now how can i add some margin top? because the anchor is behind the sticky menu…

I see the offset, but dont work… the offset only works with shortcodes?

• This reply was modified 3 years, 11 months ago by pilonscv.

The offset works with or without shortcodes. The problem is that another script in your theme (or from the page editor) handles smooth scrolling and prevents “Page scroll to id” from doing its thing (e.g. applying the offset).

Try this:

Go to “Page scroll to id” settings and set the value of “Prevent other scripts from handling plugin’s links selector(s)” field to:

.menu-item a

Save changes, test and let me know.

Hello,

Thanks,i think it works.

No the problem is the mobile offset… how can i remove or edit offset in mobile

• This reply was modified 3 years, 11 months ago by pilonscv.

No, it works (keep the “Prevent other scripts…” option). You just need to fix the sticky header transition of the theme.

First, add the offset you want in plugin settings, e.g.:

#stickymenu

or

200

or any value you want.

Enable “Verify target position and readjust scrolling (if necessary), after scrolling animation is complete” option.

Click save changes.

Optionally, add the following CSS (appearance > customize > additional css) to fix the sticky header transition of the theme:

.atiframebuilder_menuline.slmm-above, .secretlab_menuline.slmm-above{
    min-height: 183px;
    background-color: #1b272b;
}

Let me know

Perfect.. thanks a lot.

For the last… now the highlight… can you please help me with that… how can i add the color of click link to the link of the anchor

You’re welcome ??

If you want to highlight your links on-the-fly (i.e. while the page is scrolling), you first need to s\change the “Highlight selector(s)” option value to:

.slmm .menu-item a

and click save changes.

Then, add the following to your CSS:

body.kc-css-system .kc-css-922522 .slmm li .mPS2id-highlight{
    color: #0875de;
    border-bottom: 0px solid #000000;
}

.main-menu-link.mPS2id-highlight span:after{
    width: 50%;
}

If you only want to highlight only the clicked link (regardless of where the page is currently scrolled), you need to use the .mPS2id-clicked class instead:

body.kc-css-system .kc-css-922522 .slmm li .mPS2id-clicked{
    color: #0875de;
    border-bottom: 0px solid #000000;
}

.main-menu-link.mPS2id-clicked span:after{
    width: 50%;
}

Edit: I forgot to mention that the CSS above simply mimics your theme’s :hover style for the menu links.

• This reply was modified 3 years, 11 months ago by malihu.
• This reply was modified 3 years, 11 months ago by malihu.

malihu

Thanks a lot… amazing support.

I only want to highlight only the clicked link, thanks.

Do you know how can i disable the home higlight, when click on the anchors?

Sure, you need to reset the theme’s .current-menu-item elements. Something like the following would do the trick:

body.kc-css-system .kc-css-922522 .slmm li.current-menu-item a span{
    transition: color 0.4s;
}

body.kc-css-system .kc-css-922522 .slmm li.current-menu-item a:not(:hover):not(._mPS2id-h) span{
    color: #fff;
}

.current-menu-item a:not(:hover):not(._mPS2id-h) span:after{
    width: 0%;
}

If you only want to reset the “Home” menu item (and not all current-page links), change the CSS to:

body.kc-css-system .kc-css-922522 .slmm li#nav-menu-item-12839.current-menu-item a span{
    transition: color 0.4s;
}

body.kc-css-system .kc-css-922522 .slmm li#nav-menu-item-12839.current-menu-item a:not(:hover):not(._mPS2id-h) span{
    color: #fff;
}

#nav-menu-item-12839.current-menu-item a:not(:hover):not(._mPS2id-h) span:after{
    width: 0%;
}

Hi,

Thanks… I have only one problem, when I’m on another page, contacts for example and I click on “gamas” works fine but the link dont have highlight

Thanks

That’s because the linked was not clicked and you’re using the .mPS2id-clicked class. You would need to use the .mPS2id-highlight selector in order to highlight the target(s) dynamically (i.e. when coming from a different page/url).

If you don’t want to use the mPS2id-highlight class, you’ll have to add the class manually with javascript. If you want to do this, you can try the following:

1.Edit your theme/child-theme footer.php template.
2.Find the wp_footer() function and add the following script below it (before the closing body tag):

<script>
(function($){
	var hashVal=window.location.hash ? window.location.hash : 0;
	$(function(){
		if(hashVal){
			var targetElem=$(hashVal),
				targetLink=$("a[href$='"+hashVal+"']");
	    	if(targetElem.length && targetLink.length) targetLink.addClass("mPS2id-clicked");
		}
	});
})(jQuery);
</script>

3.Save the file and test.

Hope this helps

• This reply was modified 3 years, 10 months ago by malihu.
• This reply was modified 3 years, 10 months ago by malihu.
• This reply was modified 3 years, 10 months ago by malihu.

Hi friend,

Thanks, but see what i have now… the Gamas and Normas e Certifica??o are highlight…

Thanks for your help, if you need i can send you the admin login, many thanks

You didn’t use the “mPS2id-highlight” class or the custom script I posted above(?)
You can simply add the script and reset the theme’s current menu item CSS like so:

body.kc-css-system .kc-css-922522 .slmm li.current-menu-item a._mPS2id-h:not(.mPS2id-clicked) span{
    transition: color 0.4s;
}

body.kc-css-system .kc-css-922522 .slmm li.current-menu-item a._mPS2id-h:not(:hover):not(.mPS2id-clicked) span{
    color: #fff;
}

.current-menu-item a._mPS2id-h:not(:hover):not(.mPS2id-clicked) span:after{
    width: 0%;
}

If you want to send me credentials, you can contact me here.