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.
Related
Aim: Getting Google ads separately to be embedded to a site.
What I tried so far:
1.) Google Custom Search API
→ does not deliver ads but search result
Coding information:
https://developers.google.com/custom-search/v1/cse/list
Code for getting search results:
function requestSearchResult() {
jQuery.get("https://www.googleapis.com/customsearch/v1/", {
q: SearchTerm,
cx: "01042***5fgs",
key: "AL***Xra",
},
function(items, status) {
document.getElementById("content").innerHTML += "" + items.items[0].htmlTitle + "";
document.getElementById("content").innerHTML += "<br>" + items.items[0].displayLink;
document.getElementById("content").innerHTML += "<br>" + items.items[0].htmlSnippet;
document.getElementById('content').innerHTML += "<br>" + '<img src="' + items.items[0].pagemap.cse_thumbnail[0].src + '" alt="text mode" />';
...
...
});
2.) Custom Search Element Control API
→ does not deliver ads separately but it is possible to embed a search box and/or search results together (not separately) with ads to a site, the search results and ads cannot be handled for further scripting
Coding information:
https://developers.google.com/custom-search/docs/element
Code for a search box:
<script>
(function() {
var cx = '01743***hxm';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchbox-only></gcse:searchbox-only>
Code for search results:
<script>
(function() {
var cx = '01743***hxm';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchresults-only></gcse:searchresults-only>
If you just need ads, take a look at https://developers.google.com/custom-search-ads/
If you're looking to use Custom Search, but want more control over rendering, use the Custom Search Element Control API and the recently introduced callbacks feature: https://customsearch.googleblog.com/2019/06/introducing-callbacks-for-even-more.html
Note that for policy reasons this does not provide any control over Ads rendering -- Ads must be rendered as provided.
Thanks, these links are helpful, just did not find them before:
explanation with example code:
https://developers.google.com/custom-search-ads/web
code generator for specific settings:
https://developers.google.com/custom-search-ads/web/code-generator
#Andy: I will check it in detail now and try to set it all up. Are you interested in working together with me (of course not for free :-))? That would save a lot of time I think :-) If yes, please get in contact with me (h.gruenbacher#gmail.com)!
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 am using Google Site Search (the paid one, not Google Custom Search) with a simple search input box…mine, not Google’s.
Here is my very basic input box:
<div id="search">
<form action="http://????????.com" method="GET">
<input type="text" class="input" name="q" placeholder="Search...">
<input type="submit" value="Search">
</form>
</div>
The Google Site Search script is something along this order:
<script>
(function() {
var cx = xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchresults-only></gcse:searchresults-only>
I am (obviously) not a programmer…otherwise, I’m certain the answer to this would be quite evident. However, can anyone tell me what the HTML requires to pass the search text entered to the script? Directing the “action=” to www.google.com/search working just fine, if I’m wanting an internet-wide search. However, I want to confine the search to the site (hence, Google Site Search).
Thanks, in advance, and please advise if I need to clarify any points here.
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" });