2

I'm using react js and react-helmet to change the canonical tag values in the pages. But, it is not updating the value. Everywhere it is showing https://www.example.com, which is mentioned in my index.php file. I need to update the canonical link. I have earlier used jquery, but it didn't work out. It was updating in element-inspector and not in page-source but google was marking as duplicate pages.

I'm following https://github.com/nfl/react-helmet#server-usage

canonical url code

var newCanonicalUrl = "https://www.examle.com" + this.state.productUrl;

inside render function

return(<Helmet link = {[{"rel" : "canonical", "href" : {newCanonicalUrl}}]}>);
Abhishek Dhanraj Shahdeo
  • 1,356
  • 2
  • 14
  • 35

1 Answers1

1

This should do the trick:

link = {[
      { rel : 'canonical', href : newCanonicalUrl  }
]}
Hlöðver Þór Árnason
  • 21
  • 1
  • 2
    This does **not** answer the question in a useful way. _why_ do you believe this is the answer? _how_ does it work? Simply telling someone to _change their code_ without any context or meaning does not help them learn what they did wrong, and is also not useful for future readers. – GrumpyCrouton Jul 06 '17 at 17:51
  • @xameeramir check the DOM from inspect element, it should be present – Sourabh May 04 '20 at 21:46
  • @Sourabh Yes, the change reflects in the virtual DOM. It can be confirmed by inspecting the elements. However, the point of the question is all about page-source :) – Zameer Ansari May 05 '20 at 11:53
  • @xameeramir, if you want the tags in source code then you have to do serverside rendering. – Sourabh May 10 '20 at 02:25
  • @Sourabh Oh, you talking about server-side rendering! Yeah then it will show up but I'm trying the client side. – Zameer Ansari May 11 '20 at 13:16
  • @xameeramir https://stackoverflow.com/questions/8598836/jquery-dom-changes-not-appearing-in-view-source – Sourabh May 12 '20 at 00:24
  • Thank you @Sourabh The best thing about SO is it's the kind community :) – Zameer Ansari May 12 '20 at 17:29