-1

Hey guys i just had an question which i haven't found on the internet.

So basically i am making an twitter card, but the problem here is that the image generator is async. It generates the image by giving numbers or string.

So the code will be something like this:

<meta
  name="twitter:image"
  content={`https://image-generator/${some_string_or_number_in_here}.png`}
 />

But when i try to make it as twitter card it does not work. Doesn't either show up or it shows an default image.

I know twitter card expects an direct link which already exists, but this one is an node app which generates png's for you.

Any suggestions guys how i can fix this ?

Magomed.Khamidov
  • 43
  • 4
  • can you do something like let a =`https://image-generator/${some_string_or_number_in_here}.png` and then content = {a}. It helps me in most of the cases –  Oct 14 '21 at 10:14
  • Oh so just put it a variable inside the meta tag ? It did work for you right ? – Magomed.Khamidov Oct 14 '21 at 10:15
  • you can try, not exactly tried in meta tag but yes in html and javascript, it works. –  Oct 14 '21 at 10:19

1 Answers1

0

Please try this

 let _desc = `https://image-generator/${some_string_or_number_in_here}.png`;
document.querySelector('meta[name="twitter:image"]').setAttribute("content", _desc);
  • You can also check this link to use document.querySelector according to you. https://stackoverflow.com/questions/59198952/using-document-queryselector-in-react-should-i-use-refs-instead-how –  Oct 14 '21 at 10:46
  • Have you tried this in react (next js) ? BTW will the twitter card image work if i do this implementation ? – Magomed.Khamidov Oct 14 '21 at 10:53
  • sorry, don't know that language. Meta tag is used only to share information about your page and used for search engine optimisation. If you want to display image, just use img tag –  Oct 14 '21 at 10:56