如何让WordPress自定义小工具区的社交分享按钮分享当前页面?
解决WordPress小工具分享按钮动态获取当前页面URL的问题
嗨,这个问题很好解决!你现在的分享按钮链接里用的是固定的首页URL,只需要把固定地址替换成WordPress提供的动态获取当前页面永久链接的代码就行,具体步骤如下:
核心原理
WordPress内置了get_permalink()函数,它会自动获取当前浏览页面的完整URL,我们只需要把这个函数的输出插入到分享链接对应的参数位置即可,同时用esc_url()来确保URL的安全性(避免注入风险)。
修改后的完整代码
直接替换你小工具里的代码为以下内容即可:
<div class="wpb_wrapper footer_snsShare pc hide-on-single-post"> <h2 class="p1" style="text-align: center;"><span class="s1"><b>SNS</b></span><b>でシェア!</b></h2> <ul> <li> <a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo esc_url(get_permalink()); ?>" target="_blank" class="qbutton left white default btn_snsShare btn_fb" style="color: #333333; font-size: 32px; " rel="noopener noreferrer">FACEBOOK<span aria-hidden="true" class="qode_icon_font_elegant social_facebook_circle qode_button_icon_element" style="color: #1877f2;"></span></a> </li> <li> <a href="http://twitter.com/share?url=<?php echo esc_url(get_permalink()); ?>" target="_blank" class="qbutton left white default btn_snsShare btn_twitter" style="color: #333333; font-size: 32px; " rel="noopener noreferrer">Twitter<span aria-hidden="true" class="qode_icon_font_elegant social_twitter_circle qode_button_icon_element" style="color: #1da1f2;"></span></a> </li> <li> <a href="http://line.me/R/msg/text/?<?php echo esc_url(get_permalink()); ?>" target="_blank" class="qbutton left white default btn_snsShare btn_line" style="color: #333333; font-size: 34px; " rel="noopener noreferrer">LINE<span aria-hidden="true" class="qode-icon-kiko kikos kiko-line qode_button_icon_element" style="color: #00b900;"></span></a> </li> </ul> </div>
注意事项
- 如果你用的是WordPress默认的「自定义HTML」小工具,它默认不支持执行PHP代码。这时候你有两个选择:
- 安装一个支持PHP的小工具插件,比如PHP Code Widget,然后用这个插件的小工具来插入上述代码;
- 如果你懂一点主题开发,可以在主题的
functions.php里添加一段代码,让自定义HTML小工具支持PHP执行(不过插件方案更简单安全)。
这样修改后,访客不管浏览哪个页面,点击分享按钮都会自动分享当前页面的URL啦!
内容的提问来源于stack exchange,提问作者Hirohito Yamada




