git 添加徽章_将Google + 1徽章添加到您的网站

最新推荐文章于 2024-08-07 07:30:00 发布

culuo8053

最新推荐文章于 2024-08-07 07:30:00 发布

阅读量110

点赞数

文章标签： java html javascript python css ViewUI

原文链接：https://davidwalsh.name/google-plus-badge

版权

git 添加徽章

Google's new Google+ service is taking the development world by storm, and why shouldn't it? It's minimalistic UI, use of cutting edge web techniques, and overall usability make it Google+ one of the more impressive web applications I've seen in quite a while (I was going to say "since Google Wave", but that one didn't end up well, did it?) Google+ allows you to share photos, links, statuses, and much more; consider it a mesh between Twitter and Facebook.

Google的新Google+服务正在席卷开发世界，为什么不呢？它具有简约的用户界面，尖端的网络技术的使用以及整体可用性，使Google+成为我已经有一段时间见过的最令人印象深刻的网络应用程序之一(我想说的是“自Google Wave以来，但自从结束得很好吗？) Google+允许您共享照片，链接，状态等等。认为它是Twitter和Facebook之间的一个网格。

Google+ will only gain more traction, meaning that the information we share will be pushed to more and more people. This presents an excellent opportunity to promote our websites, much in the way that Twitter and Facebook have. Let me show you a few different ways to add the new Google+1 badge to your website.

Google+只会吸引更多人，这意味着我们共享的信息将被推向越来越多的人。这提供了一个极好的机会来推广我们的网站，就像Twitter和Facebook一样。让我向您展示几种将新的Google + 1徽章添加到您的网站的方法。

简单HTML (The Simple HTML)

Adding a Google+1 badge is as easy as adding a few HTML tags:

添加Google + 1徽章就像添加一些HTML标签一样容易：


<!-- one button, uses canonical link or current URL -->
<g:plusone></g:plusone>

<!-- customized for a specific address -->
<g:plusone href="https://davidwalsh.name/google-plus-badge"></g:plusone>

<!-- include the JS file -->
<script src="https://apis.google.com/js/plusone.js"></script>

Provide the g:plusone tag the URL to share via the HREF attribute (if none is provided, the page's canonical link will be searched for and used, otherwise the current URL is used) and the desired size of button via the size attribute. This tag should be added wherever within the page that you'd like the button to appear; the SCRIPT tag should be found at the bottom of the page. If you'd prefer not to dabble with the HTML yourself, Google provides a Google+1 button builder to do the dirty work for you. Four button sizes are currently offered.

通过HREF属性提供要共享的URL的g:plusone标记(如果未提供，则将搜索并使用页面的规范链接，否则将使用当前URL)，并通过size属性提供所需的按钮尺寸。该标签应添加到您希望按钮出现在页面中的任何位置； SCRIPT标签应在页面底部找到。如果您不想自己涉猎HTML，则Google提供了Google + 1按钮生成器来为您完成工作。当前提供四种按钮尺寸。

You could also use the following HTML5 code to render your button:

您还可以使用以下HTML5代码来呈现按钮：


<div class="g-plusone" data-size="standard" data-count="true"></div>

Your button must have the g-plusone CSS class and data- attributes for options.

您的按钮必须具有g-plusone CSS类和选项的data-属性。

延迟加载 (Deferring Loading)

The HTML code above will render with the rest of the page, but what if you want to render a button on your own schedule? No worries -- Google's API allows you to render buttons whenever you'd like:

上面HTML代码将与页面的其余部分一起呈现，但是如果您想按自己的时间表呈现按钮呢？不用担心-Google的API允许您在需要时呈现按钮：


<!-- one button, uses canonical link or current URL -->
<g:plusone></g:plusone>

<!-- Place this tag in your head or just before your close body tag -->
<script src="https://apis.google.com/js/plusone.js">
  {parsetags: 'explicit'}
</script>

<!-- Now render! -->
<script>
	gapi.plusone.go();
</script>

Using {parsetags: 'explicit'} and gapi.plusone.go() will turn your g:plusone tags into badges whenever you'd like. You can also render a specific button with the following JavaScript code:

使用{parsetags: 'explicit'}和gapi.plusone.go()可以将g:plusone标签g:plusone转换为徽章。您还可以使用以下JavaScript代码呈现特定的按钮：


<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
	{"parsetags": "explicit"}
</script>
<script type="text/javascript">
	function renderPlusone() {
		gapi.plusone.render("plusone-div");
	}
</script>
<body>
	<a href="#" onClick="renderPlusone();">Render the +1 button</a>
	<div id="plusone-div"></div>
</body>

Full API information as well as an introductory video is available here. There are a few more small customization options available so check them out if you're looking to specify language or play with custom rendering.

完整的API信息以及入门视频可在此处获得。还有其他一些小的自定义选项，因此，如果您要指定语言或使用自定义渲染，请检查一下。

Don't miss out on another avenue for sharing your awesome web content with everyone! Implementing Twitter, Facebook, and Google+1 sharing buttons takes 5 minutes but the amount of traffic you can gain via these referral avenues is tremendous!

不要错过与所有人共享您很棒的Web内容的另一种途径！实施Twitter，Facebook和Google + 1共享按钮需要5分钟，但是您可以通过这些推荐途径获得大量流量！

翻译自: https://davidwalsh.name/google-plus-badge

git 添加徽章

culuo8053

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
git 添加徽章_将Google + 1徽章添加到您的网站

git 添加徽章Google's new Google+ service is taking the development world by storm, and why shouldn't it? It's minimalistic UI, use of cutting edge web techniques, and overall usability make it Google...
复制链接

扫一扫