react-helmet

React SPA - GTM Analytics React-Helmet Previous Page Title

微笑、不失礼 提交于 2021-02-18 17:46:06
问题 I am using Google Tag Manager to push pageview events to the datalayer for Analytics tracking. This is happening in componentDidMount() (and sometimes componentWillReceiveProps() if I am listening for query string parameter changes with the location prop using withRouter). I am using react-helmet to dynamically update my title and other tags as components change. I have noticed an issue that I am getting the improper page title in Analytics. It's frequently showing the page title of the

React Helmet not updating meta tags

做~自己de王妃 提交于 2021-01-04 07:00:53
问题 I have my index.html page in react project as following: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Bucard | Digital Business Card</title> <meta name="title" content="Bucard | Digital Business Card"> <meta name="description" content="Bucard - Description for bucard" /> <meta property="og:title" content="Bucard | Digital Business Card" /> <meta property="og:image" content="http://m.digital-card.co.il/zedka/152/images/icon.png" /> <meta property="og:description"

React Helmet not updating meta tags

╄→гoц情女王★ 提交于 2021-01-04 06:59:27
问题 I have my index.html page in react project as following: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Bucard | Digital Business Card</title> <meta name="title" content="Bucard | Digital Business Card"> <meta name="description" content="Bucard - Description for bucard" /> <meta property="og:title" content="Bucard | Digital Business Card" /> <meta property="og:image" content="http://m.digital-card.co.il/zedka/152/images/icon.png" /> <meta property="og:description"

What is the purpose of react-helmet?

寵の児 提交于 2020-12-27 08:45:50
问题 I've created a server-side react app, where it would return html as shown below: const html = renderToString(<App />); <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <title>A Cool Page</title> <link rel="stylesheet" href="${ROOT}/static/index.css"> </head> <body> <div id="root">${html}</div> <script src="${ROOT}/client-bundle.js"></script> </body> </html> I read a lot of people have been using react-helmet to manage the content in head.

How to make a script working the first time for a special component with gatsby?

天涯浪子 提交于 2020-07-22 11:12:13
问题 I am working on a static website project using Gatsby. I have several markdown pages, and only one is using a script through a cdn call. Instead of calling my script wherever i am on the website, I only to want to call and use my script when I need to update my <head> . That's why I started to use logical inside my Helmet component. Actual version (calling on every pages): return( <Layout> <Seo /> <Helmet> <script src="myScriptForOnePage.js" /> </Helmet> .... </Layout> ); Excepted version:

How can I add meta tags for sharing a particular link in React.js?

会有一股神秘感。 提交于 2020-03-04 15:34:06
问题 Say, I have an online shop application built with React.js and I want to customize the look of the URL that is shared on social media (e.g. add a description and an image) using HTML meta tags. Besides, I want the route of particular product (e.g. https://www.mywebsite.com/product/<productId> ) to preview the appropriate picture and description of it, so it is not acceptable to just include the meta tags in the index.html . I have tried to use react-helmet and other packages that are used for

React Helmet: Facebook Open Graph

时光毁灭记忆、已成空白 提交于 2020-02-29 10:34:48
问题 So I've got react helmet working on my client-side app to re-render facebook og tags into the head depending on which page is active in the app. however the facebook debugger and facebook itself don't pick any of this up. am i missing something ? is this only possible with server-side rendered pages? i hope not as i'll have to learn node.js ! <Helmet> <title>{props.title}</title> <meta property="og:url" content={ogUrl} /> <meta property="og:type" content={props.type} /> <meta property="og

Facebook not recognizing some Gatsby React Helmet Meta Tags on Netlify

允我心安 提交于 2019-12-23 02:33:02
问题 Some, but not all, of my Gatsby React Helmet Meta Tags seems to be getting lost by facebook. Here is the code: <Helmet> <title>Code Championship | Code is Sport</title> <meta name="description" content="Code is Sport. Competitive coding competitions for elementary, middle, and high school students." /> <meta name="keywords" content="code, championship, competition, minnesota" /> <meta property="og:url" content="https://www.codechampionship.com" /> <meta property="og:title" content="Code

How can I add custom scripts in index.html's head part in Docusaurus V2?

两盒软妹~` 提交于 2019-12-21 09:28:13
问题 We are making a website with Docusaurus V2. In Docusaurus V1, there is a scripts setting in siteConfig.js to cusutimize html's head content. But, I cannot find the corresponding setting in Docusaurus V2. According to https://docusaurus.io/blog/2018/09/11/Towards-Docusaurus-2#layout, it seems possible to customize html's <head> part in V2. Layout The current state of Docusaurus is that it is in charge of the entire layout and styling, unintentionally making it very hard for users to customize

react-helmet outputting empty strings on server-side

笑着哭i 提交于 2019-12-13 15:12:06
问题 I am using react-helmet and on the client all is good in the inspect window and the tags are being outputted correctly. However, when I boot up in production and the SSR kicks in the tags aren't shown in the source and I'm getting no errors at all. I tried logging the 'stringified' title tag too and got: <title data-react-helmet="true"></title> Here is some code: This is one of the page components where I'm setting the tags from, the 3 page components are all set up identically to this. (I've