I found a unknown script in blogger theme - javascript

Can someone familiar with blogger tell me what is this script doing?
<script type="text/javascript">
(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js';
var head = document.getElementsByTagName('head')[0];
if (head) {
head.appendChild(script);
}})();
</script>
I tried to see what in this file //pagead2.googlesyndication.com/pagead/js/google_top_exp.js is, but the code is minified and hard to read.

I found out the answer.
The code is from blogger navigation bar.

(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js';
var head = document.getElementsByTagName('head')[0];
if (head) {
head.appendChild(script);
}})();
1) This is an anonymous self invoked function.
2) in this function, You are creating a script element:
script = document.createElement('script');
3) giving an src for the js file:
script.src = '//pagead2.googlesyndication.com/pagead/js/google_top_exp.js';
4) getting element head:
var head = document.getElementsByTagName('head')[0];
5) then if there is a head element contained in the document then append the script element to the head
if (head) {
head.appendChild(script);
}})();

I created a blogspot educational blog a couple of days ago and also redirected it to a custom domain. I published two blog posts on it.
One day, I was visiting the blog and had the Ad-blocker ON on the site, I was that it was blocking 1 ad. When I whitelisted the website, it showed nothing.
Then, going to the "view source" option. I came across the same script you are talking about.
I was shocked because who wants any code to appear on site without any permission. Then, I researched it and came to know that it code automatically appears on every newly created blog (the blogspot blog). This is highly likely to appear when you create a blog and do nothing (i.e. when you do not post on the regular basis).
The code on my theme is located under:
<div id="navbar-iframe-container">
So, if you want it to go away, you should publish around 2-3 posts every day and it will be long gone. By the way, even if it is there, it is not going to do anything bad, nor will it show an ad on your blog.

Its inserted by blogger. Try removing it from the theme using theme > 'edit html' and then save and refresh the script will appear again. I think its probably injected by blogger itself. And when you run the page, it usually shows as
window['google_empty_script_included'] = true;
So probably its used for adsense, and shouldn't be something to worry about.

Related

How to Inject Adsense

I am trying to figure out why injected Adsense units don’t show up on a page when the client id is changed.
What I am Doing
I use a script I found on a similar stack overflow question and inject an Adsense ad and script into a website, which already runs Adsense, after page load: dynamic Adsense
var externalScript = document.createElement("script");
externalScript.type = "text/javascript";
externalScript.setAttribute('async','async');
externalScript.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
document.getElementsByTagName('body')[0].appendChild(externalScript);
var ins = document.createElement("ins");
ins.setAttribute('class','adsbygoogle');
ins.setAttribute('style','display:block;');/*add other styles if required*/
ins.setAttribute('data-ad-client','ca-pub-YOUR-CLIENTID');
ins.setAttribute('data-ad-slot','YOUR-SLOTID');
ins.setAttribute('data-ad-format','auto');
document.getElementsByTagName('body')[0].appendChild(ins);
var inlineScript = document.createElement("script");
inlineScript.type = "text/javascript";
inlineScript.text = '(adsbygoogle = window.adsbygoogle || []).push({});'
document.getElementsByTagName('body')[0].appendChild(inlineScript);
The Problem
This script injects ads if I set the client id and ad slot to one that is already on the page. However, if I change the client id or ad slot, the element is objected but no ad is loaded. It should be mentioned that I inject after page load.
My Question
Does anyone know why some ads load and some don’t given the parameters I explained earlier?
Please note: I am aware Adsense injection is against the TOS. I do not intent to misuse this method, but am experimenting to discover how it works.

Place 'script' before the end of BODY tags with jQuery

This is the 'script' I want before the 'body' tag:
<script type="text/javascript">
var vglnk = { api_url: '//api.viglink.com/api',
key: '89dcd0a12ff35d227eaaaff82503030b' };
(function(d, t) {
var s = d.createElement(t); s.type = 'text/javascript'; s.async = true;
s.src = ('https:' == document.location.protocol ? vglnk.api_url :
'//cdn.viglink.com/api') + '/vglnk.js';
var r = d.getElementsByTagName(t)[0]; r.parentNode.insertBefore(s, r);
}(document, 'script'));
</script>
I want this code to be where I've put "HERE"
<html>
<head>
</head>
<body>
Some HTML and stuff
HERE
</body>
</html>
How would I go about this in jQuery?
(I'm doing this from an extension. Mainly in Chrome, but also Firefox and Internet Explorer.)
You need the content script to do the insert on every page you want.
The code of the content script is really simple and doesn't need jQuery.
var code = "your script code here";
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.appendChild(document.createTextNode(code));
document.body.appendChild(script);
As it will only be called once you don't even need to define a function. You can debug the code using debugger on any web the content script is attaching (F12) you will see your code in the content script tab.
I had the same issue regarding the best place to add jQuery: to the header or before the body tag? The answer is that it does not matter.
The whole page (or DOM) needs to initialize or load in order to accomplish what you are doing.
And...
The more information within the body, the more reliance you need to make sure the document is loaded.
The two sentences above are redundant because:
All jQuery UI, basic syntax, widgets, etc. are triggered with:
$(document).ready( function() {
$("#some_id").click( function {
More code here
});
});`
The code above means that the the full HTML page (or 'document') needs to be loaded before jQuery can run, AKA initialized.
There is an order that jQuery needs to be loaded for a UI to work. The actual library needs to be first, then the UI. The library can be downloaded from jquery.com and uploaded to the designers web space or through a CDN (content display network) to save on bandwidth. Here is an example of how the order should be:
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
Notice the library is the first line, and then the UI. In this case I loaded jQuery Mobile.
In conclusion, it does not matter. It is a preference mostly. More in on Unclear where $(document).ready goes.

Difference between calling a script in the onload event or placing code at end of html

I was reading the google maps api documentation and stumbled across a paragraph that explains the Asynchronously Loading the API. The api documentation can be found here
As an example it showed a script that looks like this:
function loadScript() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
What is the difference between this piece of code and just simply adding the script call all the way to the end of the html markup? Like this:
<!-- rest of the markup -->
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize"></script>
</body>
</html>
You usually want your JS scripts to run after the DOM is loaded and this event doesn't necessarily occur when your html is read/parsed. I.E. There exists some time between reading the HTML and building the DOM that your JS needs to traverse.

javascript dynamically creating script block

I have a question about inserting a dynamically created script with JavaScript.
This is the code I'm using:
var body = document.getElementsByTagName('body')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'code.js';
body.appendChild(script);
I usually place scripts at the bottom of the page, but if it's dynamically inserted like this, is there a way to ensure that the script is placed at the bottom of the page?
If it's dynamically inserted like this, is there a way to ensure that the script is placed at the bottom of the page?
You already do that with body.appendChild(script); of course there might be other elements inserted after it later on.
However, as you are dynamically inserting the script, there is absolutely no need to ensure placing it at any certain location - it is loaded and executed asynchronously (neither blocking something nor waiting for something). You may place it anywhere in the document, and even remove it right away, it will not influence any load or execute behaviour.
There's a way to ensure that using Jquery. The code.js will be called after DOM is loaded and putted right before </body> tag:
$(function() {
var body = document.getElementsByTagName('body')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'code.js';
body.appendChild(script);
});

How to lazy-load jQuery itself, specially when $(document).ready() is being used

I use jQuery on my website like this:
<head>
<script src="http://ajax.googleapis.com/.../jquery.min.js" ...></script>
</head>
I then use:
$(document).ready(function(){
});
On some occasions, this event is used:
$(document).ready(function(){
var s = document.createElement("script");
s.type = "text/javascript";
s.async = true;
s.src = "http://www.script-host.com/.../script.js";
document.getElementsByTagName("head")[0].appendChild(s);
});
Now jquery.js seems to be (one of) the heaviest resource on my website in terms of filesize. I therefore want to lazy load jquery.js itself but I understand that this would cause all document.ready events to fail. What is the best workaround for this?
Maybe this recent article may help you: http://samsaffron.com/archive/2012/02/17/stop-paying-your-jquery-tax
the idea behind is to create a temporary $ function in which you collect all function to be executed at domready event and then it's replaced later when you load jQuery at the bottom of the page.
You could load jQuery at bottom of the page, not in <head>. It will still use bandwidth, but it should be visually faster.

Categories