Load Adsense ads in ajax loaded pages - javascript

I have an audio streaming website and thus we need to keep the audio playing while the user navigate from one page to another page in the website. So to achieve the above, we need to load the content using Ajax. We are now trying to use Adsense ads in our website and observed that the ads doesn't get loaded when the content of an other page is being loaded using Ajax. So can you help how to use it. I tried using an separate html page where ads are placed and include it using iframe, this works but I am unsure if this is allowed by Adsense. Can you please confirm me if this approach using iframe is allowed or if there is any alternative workaround to load the ads.
I also tried to contact Adsense but I didn't find any contact details.

How do you load ads currently? But generally the process will be the following:
Using ajax add <ins class="adsbygoogle" ...> elements where you want to see ad.
Once DOM is updated run adsbygoogle.push({}); from JS to trigger ad load.

Related

Prevent Specific JS Loaded by iframe from Running on my Site

I want to know if it is possible to block JS, loaded by an iframe, from running on my Wordpress site. I currently embed iframe generated by a service I pay to use for my business. The iframe comes with Google AdSense ads embedded in it. Recently, the rogue pop-ups have been affecting my customers. Essentially, these are ads that run on the mobile version of my site and initiate a series of redirects. I can prevent these on my own device with an AdBlocker, but not all of my customers are that savvy.
I have tried to disable the Google AdSense ads a few ways: CSS display:none; (fails, as the JS is loaded even if the element is hidden with CSS), PHP (created a plugin that leverages wp_deqeue_script, targeting the google ad script files (blocks some JS, but ultimately fails to prevent every instance of the ads), and even HTML in the head section of my site, (the idea is that it prevents loading sources outside my domain, fails).
Is there a way to programmatically prevent these JS files from loading on my site?
There is not so much you can do about it. As #charietfl states in the comment you should think in the first place about not embedding this at all if that is a possibility for you.
From programming perspective there is only one reliable thing you can do: use iframe sandbox mode.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
This way you can prevent the IFRAME target from running ANY scripts - I do not know though if its a valid scenario for you. Otherwise there is actually no reliable way to affect the loaded iframe.

jQuery - go to page, take screenshot without load this page

I am trying to write an application in style of 4chan thread saver. I know that I can make a screenshot using html2canvas and even managed to do it. But how to load a html page without load it in browser? I care about keep the style of the page
This is not a jQuery issue. However, you should be able to do a XMLHttpRequest defined here and supply the url, to get the web page html back.

Smooth page transition like Youtube

I'm very interesting with Youtube page transition. When you open a video, then move to another video that have different URL. The browser page not refreshed like usually when open a conventional web pages. It's just like you are not move to another page, you are in the same page whereas not.
Is there any javascript/jquery plugin to do this?
If you're wondering how to load content and not reload/refresh a webpage, then you'll be referring to Ajax (Asynchronous JavaScript and XML).
These should help you out:
Ajax W3C
jQuery Ajax

How to click iframe element in wordpress (all pages)?

I have a wordpress website, where I have pages with artists. This is an example: http://chasefetti.paradigmrecordsinc.com/ of a page from my website
On the top I have an iframe from arena.com
I want after the page loads to click the play button.
If I do it on the arenas page http://arena.com/artist/chasefetti like this (using firebug):
document.getElementsByClassName("fg icon-play-fg")[0].click()
it works, but on my website I guess it doesn't know about accessing the iframe.
How can I specify to access that iframe ?
Also the full mission that I gotta do is to play that button for each page. I am thinking to add a jquery that does what I want to do, to the templates page.
My main problem is accessing that element from the iframe
As far as I know(I tired it once) you can't do that, unless the source of the iframe is on the same site as yours, which isn't the case here.
Also check this same-origin policy.

Loading offsite content with AJAX

I'm building a PHP page that will load some off site content into a DIV. There are other static elements on the page also. The problem I'm having is that the page takes too long to load because PHP loads the off site content before displaying the page.
I am considering loading the off site content in the DIV via AJAX. I'm assuming the rest of the page would load regardless of how long it takes the AJAX DIV to load.
The content will not need to update or change while the original page is loaded. It just needs to load the content once.
I have been searching for a while and have found a lot of different techniques for doing this. Such as jQuery.
Do you have any suggestions on how to do this?
Any links to tutorials would be great.
Thanks
I guess this can help you:
$('#result').load('ajax/test.html');
Reference: jquery
If you control the second (off-site) domain, you can get around the same-origin policy issues by loading a script on the secondary domain. That script should kick off the various AJAXish content updates you want.
on example1.com:
<div id="stuff-from-example2"></div>
<script src="http://www.example2.com/js/stuff.js"></script>
in stuff.js:
$('#stuff-from-exampl2").load('http://www.example2.com/fragment.html');
You can get around the same-origin policy by loading the data using JSONP.
Here are the JQuery docs

Categories