如果需要澄清,请告诉我。如果无法完成,也请告诉我。我拼命试图解决这个问题
我在以下站点上遵循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>
最佳答案
编辑!在花了几个月的时间学习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");
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;}
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>
关于google-plus - Google加分享按钮,当前网址而不是指定网址?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/20055351/