Facebook remarketing script giving validation error - javascript

I am trying to fix all the validation errors in my site. I have the majority of them however when I add in my Facebook remarketing code
<script>(function() {
var _fbq = window._fbq || (window._fbq = []);
if (!_fbq.loaded) {
var fbds = document.createElement('script');
fbds.async = true;
fbds.src = '//connect.facebook.net/en_US/fbds.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(fbds, s);
_fbq.loaded = true;
}
_fbq.push(['addPixelId', "1234567890"]);
})();
window._fbq = window._fbq || [];
window._fbq.push(["track", "PixelInitialized", {}]);
</script>
<noscript><img height="1" width="1" border="0" alt="" style="display:none" src="https://www.facebook.com/tr?id=1234567890&ev=NoScript" /></noscript>
(sample code from https://developers.facebook.com/docs/ads-for-websites/website-custom-audiences/getting-started)
I get 3 errors, Stray end tag head, Start tag body seen but an element of the same type was already open and Cannot recover after last error. Any further errors will be ignored.
If I take the tag out I get the rest of the errors from the page but the link above says not to change anything from the code except the pixelId.
I was wondering if anyone had a similar issue and new how to fix it?

Related

Disqus in Cordova/Ionic app gets stuck on Disqus page

I am trying to add Disqus to my Ionic/Cordova app. I have successfully got the Disqus widget to appear in a template using an iframe but if I click on the Disqus widget to login to Disqus to add a comment, or look at the Disqus community tab, for example, then the app goes to a non scrollable Disqus page that fills all of the screen and there is no way to get back to the app.
Is there a way to make the page it goes to scrollable and smaller than the screen so the user can get back into the app.
The Disqus code server on a static server is:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body>
<div id="disqus_thread"></div>
<script type="text/javascript">
var params;
var disqus_url;
var disqus_title;
var disqus_shortname;
var disqus_identifier;
window.onload = function () {
var match,
pattern = /\+/g,
search = /([^&=]+)=?([^&]*)/g,
decode = function (s) { return decodeURIComponent(s.replace(pattern, " ")); },
query = window.location.search.substring(1);
params = {};
while (match = search.exec(query))
params[decode(match[1])] = decode(match[2]);
if (params["shortname"] === undefined || params["url"] === undefined || params["title"] === undefined) {
alert("Required arguments missing");
}
else {
loadComments(params["shortname"], params["url"], params["title"], params["identifier"]);
}
};
function loadComments(shortname, url, title, identifier) {
disqus_url = url;
disqus_title = title;
disqus_shortname = shortname;
if (identifier !== undefined)
disqus_identifier = identifier;
else
disqus_identifier = "";
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = false;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
}
</script>
<noscript>Please enable JavaScript to view the comments powered by Disqus.</noscript>
blog comments powered by <span class="logo-disqus">Disqus</span>
</body>
</html>
In my app's controller I have:
var disqus_title = "TEST";
var disqus_identifier = '/movie/' + 0;
var disqus_url = 'http://example.com/movie/' + 0;
var url = "http://example.com/disqus.html?";
$scope.disqusurl = url + "shortname=example&url=" + encodeURIComponent(disqus_url) +
"&title=" + encodeURIComponent(disqus_title) + "&identifier=" + encodeURIComponent(disqus_identifier);
$scope.disqusurl = $sce.trustAsResourceUrl($scope.disqusurl);
The relevant part of the template file looks like this:
<ion-content>
...
<iframe style="max-height: 40%;" src="{{disqusurl}}"></iframe>
...
</ion-content>
EDIT
The problem seems to be that the web links in the Disqus widget are launched within the app. If somehow the links could be made to open in an external browser then all might work fine but I can't see how to make pulled in HTML code work this way.
Here's what I would try:
1) try to over ride disqus's css using !important selector
2) try to load in content with ajax
3) search and read articles like this: https://help.disqus.com/customer/portal/articles/472096-using-disqus-in-mobile-apps
4) have an iframe to a page on your website that has disqus, and make the iframe smaller than page height.

Facebook Conversion Pixel vs Script tag with Async

Facebook recommends the following code be added to a webpage to allow conversion tracking. This is one of several similar "beacons" we have installed on our site. Many of them are using the "createElement" method to insert the script tag dynamically into the document model...
<script>
(function() {
var _fbq = window._fbq || (window._fbq = []);
if (!_fbq.loaded) {
var fbds = document.createElement('script');
fbds.async = true;
fbds.src = '//connect.facebook.net/en_US/fbds.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(fbds, s);
_fbq.loaded = true;
}
})();
window._fbq = window._fbq || [];
_fbq.push(['track','1234567890',{'value':'10.00','currency':'USD'}]);
</script>
Question, can the code be simplified to use the following script tag...
<script src="//connect.facebook.net/en_US/fbds.js" async></script>
<script>
window._fbq = window._fbq || [];
_fbq.loaded = true; // This may not even be needed anymore
_fbq.push(['track','1234567890',{'value':'10.00','currency':'USD'}]);
</script>

Google+ - How to open the interactive post dialog without a button click?

Is there a way to open the Google+ interactive post dialog without the need of clicking the button first?
I would like to have it displayed in a website directly.
Below is the related code from the G+ examples.
JavaScript:
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client:plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
HTML:
<button
class="g-interactivepost"
data-contenturl="https://plus.google.com/pages/"
data-contentdeeplinkid="/pages"
data-clientid="xxxxx.apps.googleusercontent.com"
data-cookiepolicy="single_host_origin"
data-prefilltext="Engage your users today, create a Google+ page for your business."
data-calltoactionlabel="CREATE"
data-calltoactionurl="http://plus.google.com/pages/create"
data-calltoactiondeeplinkid="/pages/create">
Tell your friends
</button>
Add an id to that button element (You can possibly use a different element entirely as long as you include all the supplied attributes -- can't be sure without testing) and style it to be hidden.
From there, just trigger a click on it on whatever event you want.
I.E.
HTML:
<button
id="thisdumbbutton"
class="g-interactivepost"
data-contenturl="https://plus.google.com/pages/"
data-contentdeeplinkid="/pages"
data-clientid="xxxxx.apps.googleusercontent.com"
data-cookiepolicy="single_host_origin"
data-prefilltext="Engage your users today, create a Google+ page for your business."
data-calltoactionlabel="CREATE"
data-calltoactionurl="http://plus.google.com/pages/create"
data-calltoactiondeeplinkid="/pages/create">
Tell your friends
</button>
CSS:
#thisdumbbutton{ display: none; }
JS:
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client:plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
$('#something').hover(function(){
$('#thisdumbbutton').click();
});
})();
</script>

+1 button is unavailable or has stopped working

I have 3 google +1 buttons in the same wordpress page. But one of them fails when is clicked (in then float lateral widget) showing an exclamation mark.
When click again the following page is opened:
+1 button is unavailable or has stopped working. I am pretty sure that none of the described possible reasons occur.
The code for both is practically the same:
// float code (malfunction)
<div id="float_plusone">
<g:plusone size="tall" href="<?php echo urlencode(get_permalink()); ?>" count="true"></g:plusone>
</div>
<script type="text/javascript">
(function() {
var po = document.createElement("script"); po.type = "text/javascript"; po.async = true;
po.src = "https://apis.google.com/js/plusone.js";
var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(po, s);
})();
</script>
// above/below posts code (works)
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
<g:plusone size="medium" callback="googleplus_click"></g:plusone>
Any suggestion about is very welcome.
This is the URL the button is sending to the server to +1.
"id":"http://bestpushchairs.net/qc21/disclosure-policy/http%3A%2F%2Fbestpushchairs.net%2Fqc21%2Fdisclosure-policy%2F"
It looks like the button is taking the href value and assuming it is relative to the current path. Try not using urlencode.

Self executing function and the document.write

I have this self-executing function:
<script type="text/javascript">
(function() {
var sc = document.createElement('script');
sc.src = 'http://blahblah.com/test.js';
sc.type = 'text/javascript';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(sc, s);
})();
</script>
All that is contained in test.js is:
document.write('ping!');
However, it hangs -- am I doing something incorrect?
I found a way to go around the document.write but now the only question is why does this not work.
var nc = document.createElement('div');
nc.appendChild(document.createTextNode('blah'));
var scr = document.getElementsByTagName('script')[0];
scr.parentNode.insertBefore(nc, scr);
I have no idea what you're trying to accomplish, but your code is valid as long as it's hosted on http://blahblah.com/.
Your browser won't let you execute remote code to manipulate the original page. It's not that dumb.

Categories