Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ability to have granular control over order of elements #23

Open
jtart opened this issue Aug 29, 2018 · 6 comments
Open

Ability to have granular control over order of elements #23

jtart opened this issue Aug 29, 2018 · 6 comments

Comments

@jtart
Copy link

jtart commented Aug 29, 2018

This is also an issue (but not a GitHub one...) in react-helmet.

While this library, and react-helmet, allow some level of control over the order of head elements - by element type: link, meta, etc - it would be good to have fine-grain control over what element goes where as the position of elements inside the head is important.

An example of the benefits of this are in meta elements, where it is best for some key meta elements to come at the top of the head, i.e. charset, and some meta elements to come towards the bottom, i.e. open-graph data.

@JoviDeCroock
Copy link

Would it be a solution to provide this order in the index.html and let the library preserve your original order? I was originally implementing this in react-helmet but it feels like it's not maintained anymore

nfl/react-helmet#407

@staylor
Copy link
Owner

staylor commented Oct 17, 2018

@JoviDeCroock do the current unit tests account for what your patch fixes, or is it possible to show the behavior with a test?

@JoviDeCroock
Copy link

@staylor Well i wanted to first discuss this before i would try implementing it somewhere else, The problem in most SPA's is that when you add a <Helmet> on a page it gets placed on the bottom, this is below an awfull lot of <style> tags from for example a css-in-js library. This prevents crawlers from seeing the meta tags since they only crawl the first x amount of characters.

I want to find a solution that suits the needs for both server and client side. I hope this explanation makes a bit of sense.

Thank you so much for taking your time to respond to this issue, i appreciate it a lot.

@Maggie199
Copy link

@staylor I'm running into an issue that some component on the page looks very bad during page loading because css gets loaded in the end. Not sure if it's the same issue here, but would love to know if there's any workaround :)

@dvzrd
Copy link

dvzrd commented Mar 14, 2021

Any update on this issue?

I think there's a problem with sharing some pages because meta tags can become burried under too many links and script tags and sites like linked in or facebook can't reach some of the updated meta data that you may set in dynamically generated pages.

is there a way to maybe have a stricter order of tags with meta being at the very top, followed by link and script tags? That way the meta data can be scraped regardless of how many links and script tags you may have in your head.

I'll see about getting a PR out for this.

@justinph
Copy link
Contributor

I've started some work on this (see PR #133). It hard-codes a certain set of tags and attributes that should be prioritized for SEO purposes. As it stands, this only works on a SSR, but a client render will respect the order from the server and keep it unchanged. Would be curious if anyone has any preference on this pattern.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants