Streaming live at 10am (PST)

Could adding an ID to the body cause problems?


#1

I'm working on a site with several long pages. I created a back-to-top link as a symbol so that it can be easily editable across the site. But since in-page linking has to be to an ID, I need to add an ID to something that will be on every page. The best (only?) candidate is the body.

I found that Webflow doesn't support adding an ID to the body.

So I'm assigning an ID to the body setting up the link via this code in the footer.

<script type ='text/javascript'>
    $(document.body).attr('id', 'top');
    $('.back-to-top-button').attr('href', '#top')
</script>

Everything is working fine. But since an ID on the body is not intentionally supported in Webflow, I just wanted to ask if this is likely to break or cause problems down the road. Could it get overwritten by Webflow's backend?

Thanks!
Grant


#2

Hi @Grant smile

Great question. What I normally do, to make sure I don't have to use any custom code, is give my top nav or upper most div/section an ID of "top".

Then, for the "Back to top" button, I do an in-page link to "top".

hope this helps smile


#3

Hey @PixelGeek, thanks for the reply!

That is helpful. It caused me to discover something I didn't expect: I can add the same ID to different elements as long as I don't add it twice on the same page. So I could go back, undo the custom code, and add the ID "top" to all the pages. I'll keep that in mind going forward.

But this is a large site (80+ pages) and the client will be maintaining it in Webflow. It would be better for development and maintenance to leave it in the custom code. (I wouldn't have to add all those IDs, and it will be easier for the client to add the symbol, should they need to.)

So for that reason + curiosity, I return to my original question: Is the custom code solution future-proof? smile


#4

Depends how far in the future we are talking about. (the year 3024?) wink But for now, yes, it'll work as long as you don't give any other elements that same ID. smile

Cheers


#5

#6