Google+ button broke tooltip - javascript

I have created my Portfolio and put there a Google+ button. The page is still unstyled and the broken tooltip is slowing me down. Where is the problem?

there is a conflicting style in your stylsheet css/style.css that is causing the problem.
If I get rid of that stylesheet ti works as it should.

I'm not sure where you go that code but you way want to replace it this : http://www.google.com/webmasters/+1/button/
<!-- Place this tag where you want the +1 button to render -->
<g:plusone annotation="inline"></g:plusone>
<!-- 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);
})();
</script>

Instead of:
<div class="g-plusone">
</div>
Try:
<g:plusone annotation="inline"></g:plusone>

Related

Google Searchbox not Validating as HTML5

I have added the Google searchbox to my HTML5 site. When I go to the W3C validator I get an error: element gcse:search not allowed as child of element div in this context. I was instructed by Google to put the script in a div, and cannot get the searchbox to work without it. Can anyone help at all? I imagine it is a problem which must arise all the time. My code is below. Many thanks!
<div id="searchbox">
<script>
(function() {
var cx = '014531685129972083622:vk5kxnojpx0';
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:search> </gcse:search>
</div>
I imagine it is a problem which must arise all the time
Might that be the reason, perhaps, they covered this in their official documentation …?
https://developers.google.com/custom-search/docs/element#html5:
HTML5-valid div tags
You can use HTML5-valid div tags as long as you observe these guidelines:
The class attribute must be set to gcse-XXX
Any attributes must be prefixed with data-.
For example:
<div class="gcse-searchbox" data-resultsUrl="http://www.example.com" data-newWindow="true" data-queryParameterName="search" >

Adding Image in Google+ Integration

I have integrated Google+ to my visualforce page and it's working fine. I want to display the image which is a url field, dynamically in my object{!obj.image}. How do I do this?
<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>
i have achieved displaying image by redirecting to the detail page where the images exist by
<link rel="canonical" href="http://www.mywebsite/detailpage" />
but it is displaying all the images of the page like gallery i want first image only how do i do this??
we can not send images to google+ sharing.It takes images from the page by default

canonical url for google+ is not working in repeat tag

I have multiple sub pages links in my page i am using canonical link to share my pages but for all sub pages it is showing same link
<link rel="canonical" data-href="http://www.website.com/{!object.name}" />
<div class="g-plusone" data-size="medium" ></div>
<!-- Place this tag after the last +1 button tag. -->
<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>
I am using this code in apex:repeat tag but for all records the first value url is showing. how to do this?
found some code through google documents and its working fine for me.
instead of using link used
<div class="g-plusone" data-href="http://www.website/{object.name}" data-size="medium" ></div>

Need website help, Adding a shop. Shopify

I am inserting a shopify store into my website. They have a widget they use that pulls up a collection and you can add to cart and check out. The embedded code they gave me is below and should be inserted between .
<script type="text/javascript">
var ShopifyStoreConfig = {shop:"glow-station-shop.myshopify.com", collections:[14849869]};
(function() {
var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true;
s.src = "//widgets.shopifyapps.com/assets/shopifystore.js";
var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
})();
</script>
I then have to place the following code where I want them to click in my actual site.
<a href='#shopify-store'>View my Store</a>
My question is what do I need to change to that I can have multiple instances of this connecting to different products. An example would be a "view my store" and a "view my store2" button both connecting to different collections.
The "View my store2" code is the same as the 1st but the collections:[14849869] changes to a different number.
You could create a index.html with several iframes. Each iframe would have the code for its store and <base target="_parent" />

Google +1 Button script not loading in local html file

I'm playing around with the new Google +1 button and I've attempted to set up a simple demo of it.
This is my code:
<html>
<head>
<title>Plus One</title>
</head>
<body>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone callback="plus_one_callback" href="http://www.testurl.com/"></g:plusone>
<!-- Place this tag after the last plusone tag -->
<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);
})();
function plus_one_callback(){
alert('callback');
}
</script>
</body>
</html>
However it does not render the button and there is no error message in my console.
Here is a screengrab of my firebug net panel:
Anyone know why this happens?
It won't work because as of Firefox 3 you can't run external JS scripts locally. Or to be more exact, you'll run into problems when firefox sees "file://" in the url. This question was also answered here. It probably would work if you used another browser.
If you really need this kind of stuff to work locally, however, there is a solution. You can install WAMP or XAMPP to run a local server.

Categories