Row ID

[Shawna Frede]

Hello,

When using a Row ID with WP Bakery to make links or drop-down menu items, the selected link always sends the user below the intended mark.

If I have a link on my “Contact” page to the testimonials section on the “About” page, the user is sent to the middle of the testimonials section, rather than the top text box I set the Row ID to. This only happens when linking to a new page, or at the very top of the page. If I am already scrolling on the page, and click a link/menu item, it will send me to the intended location.

I have been putting the Row ID in the the row of my section/sub titles for all my pages and have this problem throughout. I am using V3 header as well.

Any help would be great, Thank you.

[Zex]

Hello, Shawna!

I’m trying to figure out the problem that you describing… It will be much easier if you can give me a link to the examples you write about…

Sorry if I missed the point… but…
Have you tried to insert an empty row before the row you want to link, and link that row instead of the row you actually need to target?

[Shawna Frede]

This reply has been marked as private.

[Zex]

Hi, Shawna!

Ok. Now I see the problem. That happens because you have a fixed header.

Try next:

Insert the empty row before your anchor links as I suggested you earlier (Same as you currently have above the “Current Postings” anchor.)
then insert the next CSS code into Customizing->General->Additional CSS:

#current-postings {
content:"";
  display:block;
  height:150px; 
  margin:-150px 0 0; 
  z-index: -999;
}

this code currently works for the current-postings anchor only.
If you keep the same ID names for the other two anchors, your code should be like this:

#current-postings,
#what-we-offer,
#staff-testimonials{
content:"";
  display:block;
  height:150px; 
  margin:-150px 0 0; 
  z-index: -999;
}

Please let me know if this helped you.

Regards

[Shawna Frede]

This gives me proper functionality now, thank you so much! The only issue remaining is the background colour. These empty rows do not seem compatible with my row shape dividers and leaves large white spaces. I have tried adjusting the colour on the row shape divider and the empty row but to no avail. This method works otherwise, is there away to make this compatible with the dividers as well?

Thanks so much

[Zex]

Unfortunately, I can’t see the white spaces, anyway, maybe you should try to insert a background-color property to the code that controls the empty row. So the code should be like this:

#current-postings,
#what-we-offer,
#staff-testimonials{
content:"";
  display:block;
  height:150px; 
  margin:-150px 0 0; 
  z-index: -999;
  background-color: #dfdfdf !important;
}

Regards

[Shawna Frede]

Thanks for all your help! Works great.

[Author]

Posts