I am building an image gallery that is slider based and loads new images via javascript and have a requirement to set the Google +1 button's URL via javascript so +1 can be set on each image.
I also need to reload the +1 button based on each image (the url will have a querystring parameter containing the image id to make it unique). Is this possible?
<!-- Place this tag where you want the +1 button to render -->
<div class="g-plusone" data-annotation="inline" data-href="#"></div>
<!-- Place this render call where appropriate -->
<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);
})();
You can use the following code to alter the gplus href attribute using jQuery. Make sure to include jquery library first and then use the code below:
<script type="text/javascript">
jQuery(".your-button").click(function(){
jQuery(".g-plusone").attr("data-href","Your-Value-Goes-Here");
});
</script>
Write this in head tag:
// Load +1 script
(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);
})();
The HTML Code:
<div id="plusone_container">
</div>
And write this jQuery anywhere you want to set +1 button's url:
$("#plusone_container").html('<div id="plusone"></div>');
gapi.plusone.render("plusone", { "href": "Your URL" });
Related
There is a site (https://www.schoolmaterialen.nl) I would like to scrape for specific items using beautifulsoup python. I can query the item I want using the url: https://www.schoolmaterialen.nl/#sqr:(q[9789053001813]), but instead of showing a page with results, it shows a popup using sooqr and the results can't be found in the html code I obtained using beautifulsoup. The only mention of the sooqr popup in the found code is this:
<!-- Start Sooqr.com on-site search and navigation code -->
<script>
document.addEventListener("DOMContentLoaded", function() {
document.getElementsByClassName("keywords")[0].setAttribute("id", "search");
});
var _wssq = _wssq || [];
_wssq.push(['_load', {'suggest': {"account":"SQ-119341-1","fieldId":"search","version":4}}]);
_wssq.push(['suggest._setPosition', 'screen-middle']);
_wssq.push(['suggest._setLocale', 'nl_NL']);
_wssq.push(['suggest._excludePlaceholders', 'Search..']);
(function () {
var ws = document.createElement('script');
ws.type = 'text/javascript';
ws.async = true;
ws.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'static.sooqr.com/sooqr.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ws, s);
})();
</script>
<!-- End Sooqr.com on-site search and navigation code -->
I already tried to directly use the url of the page I want, but it needs the title of the book which is one of the things I want to find using the isbn. Is there a way to somehow still get the link to the page that is in the popup?
I want to append two variables to a script tag in react.js. I have created the script tag in the head of the document like so:
const script = document.createElement('script');
document.getElementsByTagName('head')[0].appendChild(script);
However, I wish to append two JS variables inside the <script></script> tags, so it is the following:
<script>
var io_install_flash = false;
var io_install_stm = false;
</script>
The following code would add the script to head tag:
const script = document.createElement('script');
script.innerHTML = `<script>
var io_install_flash = false;
var io_install_stm = false;
</script>`
document.head.appendChild(script);
How do I change the script tag with a script DOM? Previously I used a script like this
<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
But I want to use the script DOM. when I change like this, script not working
<script>
var jquerymin = document.createElement('script');
jquerymin.type = 'text/javascript';
jquerymin.async = true;
jquerymin.src = 'https://code.jquery.com/jquery-2.2.2.min.js';
document.getElementsByTagName('head')[0].appendChild(jquerymin);
var jqueryui = document.createElement('script');
jqueryui.type = 'text/javascript';
jqueryui.async = true;
jqueryui.src = 'https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js';
document.getElementsByTagName('head')[0].appendChild(jqueryui);
</script>
Is DOM script, cant run script jquery.min and jquery.ui?
If you want to use pure Javascript to add (asynchronously) a new script file, you can do this:
<html>
<head>
<title>JS</title>
</head>
<body>
<script type="text/javascript">
var
scriptElement,
script;
scriptElement = document.createElement('script');
scriptElement.src = "https://code.jquery.com/jquery-2.2.2.min.js";
script = document.getElementsByTagName('script')[0];
script.parentNode.insertBefore(scriptElement, script);
</script>
</body>
</html>
The google plus badge sometimes it render okay with no errors, sometimes it doesn't render and give this error in the console :
TypeError: a is undefined
...pi.auth,e={client_id:c,session_state:b};a.checkSessionState(e,function(b){var c=.
My code is :
< div class="g-page" data-href="https://plus.google.com/+google"
data-theme="dark" data-showtagline="true" data-showcoverphoto="true"
data-rel="publisher" >
<!-- Place this tag after the last widget tag. --><script type="text/javascript">
window.___gcfg = {
lang: 'de'
};
// just put this in here
document.getElementsByClassName('g-page')[0].setAttribute('data-width', document.getElementById('google-badge').clientWidth);
(function () {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/platform.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
EDIT:
the a is defined in the google api here : https://apis.google.com/js/platform.js
I have the same problem. I think google badge library somehow conflicts with other javascript libraries like AngularJS.
I just created a website for a new business that I will run, I try to set the Google 1 button, however even if it's correctly displayed I cannot click it. Does anyone know something about this problem?
Feel free to check the page http://mini-site.ca.
<script type="text/javascript">
(function() {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'apis.google.com/js/plusone.js';;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
Just edit the "< fb:like width="50"..." (facebook tag for like / send buttons)
<fb:like href="http://www.mini-site.ca" send="true" layout="box_count" width="50" show_faces="true" font="arial" class=" fb_edge_widget_with_comment fb_iframe_widget">
Like this.