Wordpress blocking javascript? - javascript

I've tried creating a new post on my Wordpress blog and I've pasted an external code from a site, which has a <script src="..."></script> in order to work.
When I publish my post, the script tag simply gets deleted.
Is this a default behavior in Wordpress? Is there any way to avoid this? (preferably without doing any modifications to Wordpress or using inline code).

No this is not default behaviour in wordpress. I have added <script> tags to the html view of a page or post no problem.

Did you switch the view after you add the code ? If so, don't. Wordpress will delete all tags if you switch to view back from HTML.

Like Tim said, you probably posted the code into the Visual Editor (doesn't accept any HTML tags, like scripts). You should to the HTML editor to implement your code, but if you want to have it on more than one page, you should open up the Appearance Editor and paste it into your theme where you need it (most likely in the header).

If you put the script code in html and then switch to the visual editor, it will delete the script. This is a commonly reported problem and is the default behavior of wp.

Wordpress assigns Roles to Users, Users who are either Administrators or Editors can add javascript codes within posts. If the User's role is Author or Contributor then they can not add javascript codes inside posts, even if these users try to add Javascript in HTML mode, wordpress automatically removes the tags.

Related

How To Place Google AdSence code externally

I was looking to setup Google AdSence to monetize my multi-page site, and was wondering if would be ok if I placed the script externally so I can easily edit it and delete it on all pages if necessary.
The code I would but in the location I want the ad:
<script src=”ad-1.js”></script>
And I would copy the AdSence code (Minus the < Script > tags) into the “ad-1.js” file.
Would this be breaking any AdSence rules? Also, is there any way to avoid Ad blockers from blocking the ads?
Edit: I signed up for AdSence, and searching the docs and Google finds me no additional information. Does anyone know if this violates any rules?
How exactly ad-1.js will look like? Note that the tag is <ins> element with a <script> tag. You can't just put <ins> element in ad-1.js file as <ins> is HTML and and you can put only JS code in the JS file. You would need to put something like:
document.write('<ins class="adsbygoogle" ...');
But generally using blocking scripts in HTML is discouraged as it prevents browser from efficiently parsing and evaluating the page. If your goal is to be able to disable ads with one change - I'd suggest instead puttin <ins> tags and then, when you need to disable ads, you can add .adsbygoogle { display: none; } style to some common CSS file used across all your pages. That will effectively prevent ads from loading.
Answering some of your questions:
Would this be breaking any AdSence rules?
No, it doesn't break rules. You can place <ins> tags from JS.
Also, is there any way to avoid Ad blockers from blocking the ads?
AdSense doesn't provide feature for that. There probably some libraries that can help you detect whether user has adblock installed and do something based on that. For example show some banner asking user to disable adblocker.
So, I found an answer, and posting it here for others that may come across this question.
You can use the jQuery "Get Script" command, like this:
In the HTML file:
//Calls jQuery
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
//Calls external js file
<script src="/header.js"></script>
header.js:
$.getScript( "LINK TO CALL GOOGLE ADS" )
ANY ADDITIONAL CODE THAT GOES INSTIDE THE <SCRIPT> TAG GOES HERE

Is there a way to put some custom code in the header when using Elementor header template

Is there a way to put some custom code in the head of the page? Before Elementor you could do this by editing the header.php file of the template, but now, elementor eliminates all the code from the template, and there is no way (at least an obvious way) to do this. For me this is very important, because I like to put some tags in the code and also this is a perfect way to implement Google Analytics without using any other plugin. Google speed showing to add preload fonts because of speed. I also want to add Preload meta in header but don't want to use plugin. Please suggest better for this.
Thanks
as for google analytics the codes are javascript. you can easily add them into header using "HTML Widget" and then add the code between script tags.
and if you are looking for a way to add php codes, i recommend Dynamic.ooo. the plugin has a widget called "PHP Raw" which lets you write your php in elementor and put it anywhere you want. i myself currently use this plugin and it is a swiss army plugin!

Edit existing items in a Wordpress theme

I've created a homepage, that simply has a sentence as the content
I've edited the settings so that this the front page of the website.
However, given the theme that I am using, when I go to the home page, this is what I see
I can see the content of my home page at the very bottom, but before that, there is a slider and a couple of blocks (that presumably come with the theme).
I'd like to know either how to remove these default blocks, or edit them myself to include links to other pages.
Also, as you can probably tell, I am very new to Wordpress. Are there any good documentations for beginners that would teach me how to create pages, edit and customize them so that I can have control over the whole page (as a regular website)?
I think you should edit by the php file, so if u don't know PHP start here.
Go to : menu > appereance > editor.
Here u see all the files you need. The file you should edit change with the theme.. so go through the code.
Maybe, it's under header.php
The html code you get above your content is inserted from the page template assigned to your homepage. Thus, if you want to modify it somehow you should go Editor Panel in Appearance Menu, then edit desired template. You can also create your own template with structure you actually want and assign it to that page.
As for a documentation, I think you're going to be good with the official one.
You can edit it by going appearence->editor with php code, be careful when you doing this
if you want to edit a header, you can find header.php in that particular theme
same with footer.php and you customize the design by clicking appearance->customize

embedding a page with some javascript on a tumblr post

I want to reproduce a simple, one page website with some javascript in a tumblr post (as a form of documentation for a project) but everytime I try to put the source html of the site into the tumblr form it ends up not loading at all inside the tumblr... Here's the page I'm trying to "embed" into tumblr: www.benenson.ae/recording.html
When I copy the html into the tumblr console, I'm fixing the path to the scripts at the top so that's not the problem..Am I missing some trick for getting this to work inside Tumblr?
I wasn't sure what support there was for iframes in tumblr, but it is possible, but you will need to add some styling to suit your needs:
I simply created a new post, selected the html tab and then put in the following code:
<iframe src="http://www.benenson.ae/recording.html"></iframe>
Alternatively you could create a single post, uploading the image content to tumblr and make it link to anywhere you like, and then add a caption for the post that replicates the current text you have.
If that helps or you want to pursue the second option, let me know and I can update my answer.

Facebook likes Not Working when javascript add

So i am trying to add a like to my individual posts. So i added this to each of the posts. The posts are generated from database output then assembled with the properly styling in a javascript file.So i added this to the creation mix.
<fb:like href="my_not_so_sweet_website" layout="button_count" show_faces="true" width="200"></fb:like>
Weird part is... None of them show up. THEN i try taking that code that i generated for each post and just copy and paste it to the top of my website, and low and behold A like Button!!!. Any clues? Need more info? Help?
You are using what's called FBML. The like button is rendered on the fly (well, on page load) by a facebook javascript libabry you include on the page- it needs the FBML tags to know what to render.
The problem is that the FB library isn't smart enough to know that you've dynamically added these FBML tags to the DOM.
There is another type of like button that's an iframe, that one should work if you put it in the DOM dynamically. Docs for that are here: http://developers.facebook.com/docs/reference/plugins/like/
-when you enter your info into the widget there will be an option for iframe.
There is also a FBML render function in the FB javascript SDK. Docs are here: http://developers.facebook.com/docs/reference/javascript/fb.xfbml.parse/

Categories