Dynamically changing "Canonical" link in the same page with different variables

Wappler General Need Help
1

Hello,

How can I change the href:link of the canonical rel in my web page head section?

What I am going to do it is that;

1- https://www.example.com/products/product1/design1
2- https://www.example.com/products/product1/design2
3- https://www.example.com/products/product1/design3

I want to do it dynamacally by injecting the selected design on the same page.
I am using routing by updating same web page with url queries. So I have only I page can serve hundreds of the products. But I can not update my canonical links on every design product and because of this the web pages can not being indexed by google.

Do you have any solution?

2

We do similar to Brian and do this dynamically. Check out Brians video on the subject (Node ONLY):

1 Like
3

I am using php platform so dynamacally Server data bindings iare not available for canonical and meta tags.

4

Would this method from @Heather_Mann offer a solution?

5

Set the App Root to Page in the App Connect settings, then you can make your canonical meta tag dynamic:

<link rel="canonical" dmx-bind:href="'https://www.example.com/product1/' + some_dynamic_binding">
6

I have done that before.

When I check my view source from browser CTRL+U, I see the coding like this :

<link rel="canonical" dmx-bind:href="''https://www.example.com/product1/' + {{query.design}}">

What I want to do it like this :

<link rel="canonical" dmx-bind:href="'https://www.example.com/product1/design1'">

Is this possile? or is this necessary for google?
Can google render the webpage with the correct variables instead of getting dynamic content coding values?

Thank you.

7

It doesn’t matter what you see in the source code. The search engines see your page rendered with the dynamic expressions rendered, so the same as you see it when inspecting it with the dev tools inspect.

1 Like
8

I am also updating title tag,

Do I need to update ?
<meta property="og:title">
and
<meta property="og:url">

9

I would suggest yes as they serve different purposes. og: tags are for social media integration

10

I am still having problem not all of my pages are being indexed.

My warnings are below:

  • Alternate page with proper canonical tag Website Failed 1,839(page count)
  • Crawled - currently not indexed Google systems Failed 8,927(page count)
  • Duplicate, Google chose different canonical than user Google systems Failed 635(page count)
  • Discovered - currently not indexed Google systems Passed 26,426(page count)

My current canonical is like this on my every page:

<link rel="canonical" dmx-bind:href="canonical.value"/>