dnish
commented
6 years ago We also need to set attributes for the HTML tag, f.e. the lang attribute is a common way to tell crawlers the content language.
Open ch-lukas opened 6 years ago
dnish
commented
6 years ago We also need to set attributes for the HTML tag, f.e. the lang attribute is a common way to tell crawlers the content language.
dobesv
commented
6 years ago When doing SSR with helmet it returns strings that should be injected into the head and body opening tag with additional attributes, e.g.
<html ${helmet.htmlAttributes}><body ${helmet.bodyAttributes}></body></html>It would be nice to have support for that as well. For example setting a body css class or lang on the html element.
ch-lukas
commented
6 years ago @dobesv , yip the standard package is very limiting as it is basically a line-by-line streaming reader and as such can only really prepend some html as certain locations.
To be able to really work with the DOM it needs to be parsed e.g. Cheerio. I ended up creating a package for this and have been using it for the last few months.
This should do what you need : sink.updateHeadElementByTag('html', 'en', 'replace', 'lang');
Overview
Using the Meteor packages static-html & server-render for a Meteor / Vue project. The vue router has been setup for client-side rendering, but am needing server-render to inject some SEO header info and for noscript redirects.
The server-render package seems to working ok, but is very limited and suggesting the following enhancements to its class / functions.
renderIntoElementById
sink.renderIntoElementById("id", "code");sink.renderIntoElementById("id", "code", "replace or append true/false");Would allow me to inject whole sections of code and to replace redirect e.g.
<meta id="reload" http-equiv="refresh" content="5; url=/noJS">.renderIntoElementByTag
sink.renderIntoElementByTag("tag", "code", "replace or append true/false");The challenge I face when using static-html is that you can't use attributes like "id" on the "head" tag so cannot search by element id in this/similar instances.
It would be nice to be able to inject/replace a brand new head and this function would do that.
Another example - to update the title element you could use:
sink.renderIntoElementByTag("title", "Awesome Website", true).renderIntoElementByAttribute
sink.renderIntoElementByAttribute("tag", "search attribute name", "search attribute value", "update attribute. null means innerHtml value is updated", "code");For example, you have
<meta name="description" content="Free Web tutorials">and want to update the content of the description meta element - e.g.sink.renderIntoElementByAttribute("meta", "name", "description", "content", "50% off");