0

I am not able to add the following javascript into my wordpress post.

The javascript is provided by Google to display a map of the web search results.

<script type="text/javascript" src="https://ssl.gstatic.com/trends_nrtr/2578_RC01/embed_loader.js"></script> <script type="text/javascript"> trends.embed.renderExploreWidget("GEO_MAP", {"comparisonItem":[{"keyword":"covid","geo":"","time":"today 12-m"}],"category":0,"property":""}, {"exploreQuery":"q=covid&date=today 12-m","guestPath":"https://trends.google.com:443/trends/embed/"}); </script>

I have tried to add the javascript using the text editor (not visual) and also tried to add the javascript above within the "< code > </ code >", but it is still unsuccessful. Referring to this feedback adding javascript in wordpress posts (which might be stale)

What should I do if I wanted to add the above javascript into the wordpress post body?

Update: @bhanu below is how I added the Javascript which results in an empty body post.

enter image description here

Improve this question

2 Answers 2

Reset to default
1

Well it is very simple to do that. I don't fully understand if you are on Gutenberg or classic Editor so I am going to show it for both of them.

Execute JS inside post with Gutenberg

  • Use Custom HTML block to and paste your code inside the block. If you are adding JS you must wrap it around <script></script> tag.

JS in gutenberg

  • This would give the following result.

output : JS in gutenberg

Execute JS inside post with Classic Editor

  • If you have some content like this.

js in Classic

  • Switch to text mode and paste the code where you want to add it.

js in Classic - code added

  • This would be the output.

js in Classic - output

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Thanks for the response. From the visual that you pasted, I am using Classic Editor. I have switched to the "Text" view, and paste the javascript codes, but the post doesn't show the map as you have shown above. Do you know whether I need to enable something before the javascript is enable to execute?
@Calvin no, can you share screenshots of how you added it and what do you see on the post page. Also is there something in the console.
I have added a screenshot of how I added the Javascript.
I root caused the issue is at my side. Based on your recommendation, after adding the Javascript, I use 2 different browsers to browse the post. The issue occurs in Safari while Chrome has no issue to show the javascript. Thanks!
0

There's 2 ways to add Javascript to your Wordpress site. Obviously in this case you're wanting to add it to an individual post/page, rather than site-wide. So a good option is to use the CodeEmbed plugin, which has 30,000 active users, is free & open-source on SVN, and receives frequent updates.

After activating this plugin, go back to the edit post/page webpage in your admin panel, and enable "Custom Fields" in "Screen Options". Scrolling down below the content body field, you'll see a new field where you can insert js code:

After adding this field, simply add the shortcode {{CODEmyjscode}} anywhere in THAT SPECIFIC page/post's body field.

If you don't want to use a plugin, simply use the "Custom HTML" button in the WYSIWYG Wordpress editor and paste your jscode inside the Custom HTML area, making sure to add tags

-L

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.