google-plus - Google加分享按钮，当前网址而不是指定网址？

Question

如果需要澄清，请告诉我。如果无法完成，也请告诉我。我拼命试图解决这个问题

我在以下站点上遵循Google开发人员指南中的“共享”按钮:

https://developers.google.com/+/web/share/

而且我似乎无法弄清楚如何使用自定义图标并使用当前URL而不是必须指定URL。

我发现他们网站的此部分指定了定位标记地址:

"https://plus.google.com/share?url={URL}"

这将允许我使用自定义图标(也是我可以使用的唯一方式)，以及一些其他自定义参数。但是，此方法似乎需要指定的URL，据我所知，它没有提供根据当前页面动态创建链接的方法。

如果我在顶部使用代码生成器，它将使用当前页面，但会调用Google托管的Java脚本，此外，当我将鼠标悬停在图标上时，它会弹出一个悬停链接。当然，我也不能在生成器中使用自定义图标。

我一直在搜寻我能想到的每个搜索字词，也在该网站上进行搜索，到目前为止，我还没有找到其他人问这个问题。经过大约20-30分钟的搜索，我发现我不会通过搜索找到答案，因此，如果这个问题已经得到解答，我深表歉意。

只是一些我的经验背景可以让我知道我的位置:我对HTML和CSS的工作有很好的了解。但是，我了解Java语言非常基础的知识，仅此而已。但是，我肯定打算学习，因为它将证明是一项非常有价值的技能。

非常感谢你!!

我想我知道需要做些什么，但是...我不知道该怎么做(或者是否可行):|

我的共享链接需要链接到一个脚本，该脚本查看当前页面的URL，然后获取该信息，并从中创建一个动态链接，该链接会将用户带至以下链接:https://plus.google.com/share?url= {来自查询的URL将在此处}。

我认为这可能行得通……听起来像那样。有什么想法吗？如果是这样，那么任何简单的脚本都可以做到这一点？

双重感谢!

-我终于找到了可行的方法，但是它使用了Javascript，但我并没有完全理解它，只是对其进行了调整。我花了很长时间才找到它，但是它可以与Google Plus，Facebook或Twitter一起使用! (而且我敢肯定，它将与任何其他提供需要指定URL的共享链接的网站一起使用)

在这里，我仍在寻找更好的解决方案，但这确实符合我的期望:

<a href="javascript:(
function(){
var w=480;var h=380;
var x=Number((window.screen.width-w)/2);
var y=Number((window.screen.height-h)/2);
window.open('https://plus.google.com/share?url='+encodeURIComponent(location.href)+'
  &title='+encodeURIComponent(document.title),'','width='+w+',height='+h+',left='+x+',top='+y    +',
  scrollbars=no');
})();" style="background: url(/wp-content/themes/HTML5/images/googleplus.png) no-repeat  scroll left center transparent;">
Share to Google+</a>

Answer 1

编辑!在花了几个月的时间学习Javascript之后，我构建了一个比下面提供的解决方案好得多的解决方案。我将保留原始答案，但是，我想将此更好的解决方案放在顶部。

该解决方案应可在任何为您提供自定义共享URL(即，允许您手动输入要共享的地址的URL)的社交媒体平台上工作。

这就是所有工作的原理(如果有人对JS有更多的经验或建议，请告诉我)。

我将变量分配给document.URL和document.title属性。

我编写了一个命名函数(我称我为socialShare)，该函数设置为通过window.onload事件上的匿名函数运行。

socialShare函数将变量分配给HTML中我的社交按钮的位置。就我而言，我使用ID来定位元素。这些变量的目的纯粹是为了美观(我使用这些变量动态地重写HTML代码，因此，当您将鼠标悬停在“共享”按钮上时，它将显示正确的URL，以共享您所在的当前页面)

var fbShare = document.getElementById("fbShare");

var gplusShare = document.getElementById("gplusShare");

twitterShare = document.getElementById("twitterShare");

然后，我编写三个单独的匿名函数，每个社交媒体平台一个。每个函数都有两个语句。这些函数的工作方式如下:第一部分是分配给ID为fbShare的HTML元素位置的变量。第二部分告诉它单击该元素时要运行该函数。 .onclick。第三部分是单击该元素时将运行的匿名函数。该函数的第一条语句将打开一个新窗口； window.open;并在该新窗口中，打开通过输入window.open方法参数指定的URL。参数如下:(URL,name,specs)，其中URL是您要共享的URL，name是可选的，如空白引号所示为空白，最后specs是您指定窗口属性(即:宽度和高度)的位置。第一个参数URL:("https://www.facebook.com/sharer.php?u="+currentURL, currentURL是之前分配的全局变量，它将代替currentURL放置当前文档URL所在的任何内容。第二个参数name:"",保留为空白，因为它是可选的。第三个参数specs:"height=368,width=600,left=100,top=100,menubar=0");这些是逗号分隔的项目列表。就我而言，我已经指定了窗口的高度，宽度和位置，并禁用了菜单栏。最后，第二条语句return false;告诉浏览器不要遵循HTML代码中的链接。如果未指定，浏览器将遵循HTML中的URL，并打开一个新窗口。有关window.open方法的更多信息，请参见此新答案底部的链接。

fbShare.onclick = function() { window.open("https://www.facebook.com/sharer.php?u="+currentURL,"","height=368,width=600,left=100,top=100,menubar=0"); return false; }

gplusShare.onclick = function() { window.open("https://plus.google.com/share?url="+currentURL,"","height=550,width=525,left=100,top=100,menubar=0"); return false; }

twitterShare.onclick = function() { window.open("https://twitter.com/share?url="+currentURL+"&text="+currentTitle,"","height=260,width=500,left=100,top=100,menubar=0"); return false; }

最后，我修改每个社交媒体按钮的HTML href元素，以便当用户将鼠标悬停在共享按钮上时，他们会在其浏览器状态栏中看到正确的共享URL。该语句的第一部分获取元素id fbShare，第二部分告诉它设置属性.setAttribute。然后，我们传入要更改的属性名称(在这种情况下为("href",)，然后传入我们希望新属性值为"http://www.facebook.com/sharer.php?u="+currentURL); currentURL的内容，此处与之前相同。无论当前页面的URL是什么，它都是变量的值。

fbShare.setAttribute("href","http://www.facebook.com/sharer.php?u="+currentURL);

gplusShare.setAttribute("href","https://plus.google.com/share?url="+currentURL);

twitterShare.setAttribute("href","https://twitter.com/share?url="+currentURL+"&text="+currentTitle);

这就是全部!我希望我写得很好，并且希望它相对容易理解。如果那里的专业人士有任何建议，请随时投入并提出您的建议! :)

我的JS文件
http://jrltest.host-ed.me/_js/share.js
链接到w3schools.com上window.open方法上的信息
http://www.w3schools.com/jsref/met_win_open.asp
链接到w3schools.com上有关.setattribute方法的信息
http://www.w3schools.com/jsref/met_element_setattribute.asp

老答案:我想我将添加它作为答案。它可以解决问题，并解决我遇到的确切问题。 “window.open”之后的URL将是社交媒体的“共享链接”(在本例中为google加“Share Link”。可以修改或删除一些变量。任何擅长脚本的人都可能创建一个PHP版本(我很喜欢)或对其进行修改以更好地满足他们的需求，无论如何，我希望这会帮助到别人!

<a href="javascript:(
function(){
var w=480;var h=380;
var x=Number((window.screen.width-w)/2);
var y=Number((window.screen.height-h)/2);
window.open('https://plus.google.com/share?url='+encodeURIComponent(location.href)+'
  &title='+encodeURIComponent(document.title),'','width='+w+',height='+h+',left='+x+',top='+y+',
  scrollbars=no');
  })();" style="background: url(/wp-content/themes/HTML5/images/googleplus.png) no-repeat scroll left center transparent;">
Share to Google+</a>