Row ID
- This topic has 6 replies, 2 voices, and was last updated 4 years, 3 months ago by
Shawna Frede.
-
AuthorPosts
-
July 31, 2019 at 2:54 pm #16296
Shawna Frede
ParticipantHello,
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.
July 31, 2019 at 3:06 pm #16298Zex
ModeratorHello, 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?July 31, 2019 at 3:22 pm #16299Shawna Frede
ParticipantThis reply has been marked as private.July 31, 2019 at 4:12 pm #16306Zex
ModeratorHi, 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
July 31, 2019 at 5:43 pm #16313Shawna Frede
ParticipantThis 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
July 31, 2019 at 6:02 pm #16314Zex
ModeratorUnfortunately, 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
July 31, 2019 at 8:24 pm #16317Shawna Frede
ParticipantThanks for all your help! Works great.
-
AuthorPosts
- You must be logged in to reply to this topic.