如何解决分享按钮未使用 AddToAny 插件在社交媒体上分享相应的图像
我在我的网站上使用 addtoany 插件。 我遇到了一个问题,我的页面上有一个图像列表,每个列表都有共享按钮。 现在,当我点击任何分享按钮时,我只会看到社交网站上的第一张图片。
例如,如果我点击第二个列表分享按钮,那么根据我必须获得 1000*600
但我获得 600*400
图像。
img {
width: 400px;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" />
<div class="elements odd">
<img src="https://dummyimage.com/600x400/000/fff">
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style sharebtns" style="display:inline-block; text-align:center;">
<ul>
<li><a class="a2a_button_facebook"><i class="fab fa-facebook-f"></i></a></li>
<li><a class="a2a_button_twitter"><i class="fab fa-twitter"></i></a></li>
<li><a class="a2a_button_linkedin"><i class="fab fa-linkedin-in"></i></a></li>
<li><a class="a2a_button_whatsapp"><i class="fab fa-whatsapp"></i></a></li>
<li><a class="a2a_button_email"><i class="fas fa-envelope"></i></a></li>
</ul>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
</div>
<div class="elements even">
<img src="https://dummyimage.com/1000x600/000/fff">
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style sharebtns" style="display:inline-block; text-align:center;">
<ul>
<li><a class="a2a_button_facebook"><i class="fab fa-facebook-f"></i></a></li>
<li><a class="a2a_button_twitter"><i class="fab fa-twitter"></i></a></li>
<li><a class="a2a_button_linkedin"><i class="fab fa-linkedin-in"></i></a></li>
<li><a class="a2a_button_whatsapp"><i class="fab fa-whatsapp"></i></a></li>
<li><a class="a2a_button_email"><i class="fas fa-envelope"></i></a></li>
</ul>
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<!-- AddToAny END -->
</div>
解决方法
更新:
要将其与自定义 url 一起使用,请将属性 data-a2a-url
和 data-a2a-title
添加到容器
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />
<div class="elements odd">
<img src="https://dummyimage.com/600x400/000/fff">
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style sharebtns"
style="display:inline-block; text-align:center;"
data-a2a-url="http://www.example.com/page1.html"
data-a2a-title="Example Page Title">
<ul>
<li><a class="a2a_button_facebook"><i class="fab fa-facebook-f"></i></a></li>
<li><a class="a2a_button_twitter"><i class="fab fa-twitter"></i></a></li>
<li><a class="a2a_button_linkedin"><i class="fab fa-linkedin-in"></i></a></li>
<li><a class="a2a_button_whatsapp"><i class="fab fa-whatsapp"></i></a></li>
<li><a class="a2a_button_email"><i class="fas fa-envelope"></i></a></li>
</ul>
</div>
<!-- AddToAny END -->
</div>
<div class="elements even">
<img src="https://dummyimage.com/1000x600/000/fff">
<!-- AddToAny BEGIN -->
<div class="a2a_kit a2a_kit_size_32 a2a_default_style sharebtns"
style="display:inline-block; text-align:center;"
data-a2a-url="http://www.example.com/page2.html"
data-a2a-title="Example Page Title">
<ul>
<li><a class="a2a_button_facebook"><i class="fab fa-facebook-f"></i></a></li>
<li><a class="a2a_button_twitter"><i class="fab fa-twitter"></i></a></li>
<li><a class="a2a_button_linkedin"><i class="fab fa-linkedin-in"></i></a></li>
<li><a class="a2a_button_whatsapp"><i class="fab fa-whatsapp"></i></a></li>
<li><a class="a2a_button_email"><i class="fas fa-envelope"></i></a></li>
</ul>
</div>
<!-- AddToAny END -->
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
您的代码用于共享 current
页面网址,图片请参见下方或阅读 docs 了解更多
<div>
<img src="https://dummyimage.com/600x400/000/fff">
<img src="https://dummyimage.com/1000x600/000/fff">
</div>
<script async src="https://static.addtoany.com/menu/page.js"></script>
<script>
var a2a_config = a2a_config || {};
a2a_config.overlays = a2a_config.overlays || [];
a2a_config.overlays.push({});
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。