📌  相关文章
📜  如何在网站上添加whatsapp分享按钮?(1)

📅  最后修改于: 2023-12-03 14:52:58.111000             🧑  作者: Mango

如何在网站上添加whatsapp分享按钮?

如果你在开发网站时需要添加whatsapp分享功能,这里提供两种方法:

方法一:使用whatsapp API
  1. 首先,在你的html代码中添加以下代码:
<a href="whatsapp://send?text=分享内容">分享到whatsapp</a>
  1. href属性的值中,将text后的内容换成你需要分享的内容即可。
方法二:使用第三方库

如果你不想自己编写代码,也可以使用第三方库来实现:

  1. 在你的html代码中添加以下代码:
<a href="javascript:;" id="whatsapp-share-btn">分享到whatsapp</a>
  1. 引入jquery和whatsapp组件:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/rafaelbotazini/floating-whatsapp/dist/floating-wpp.min.js"></script>
  1. 在js代码中初始化whatsapp组件:
$(function () {
  $('#whatsapp-share-btn').floatingWhatsApp({
    phone: '你的电话号码',
    message: '分享的内容',
    showPopup: true
  });
});

在以上代码中,phone的值是你的电话号码,message的值是你需要分享的内容。

以上两种方法任选其一都可以在网站上添加whatsapp分享按钮。

返回markdown格式:

## 如何在网站上添加whatsapp分享按钮?

如果你在开发网站时需要添加whatsapp分享功能,这里提供两种方法:

### 方法一:使用whatsapp API

1. 首先,在你的html代码中添加以下代码:

```html
<a href="whatsapp://send?text=分享内容">分享到whatsapp</a>
  1. href属性的值中,将text后的内容换成你需要分享的内容即可。
方法二:使用第三方库

如果你不想自己编写代码,也可以使用第三方库来实现:

  1. 在你的html代码中添加以下代码:
<a href="javascript:;" id="whatsapp-share-btn">分享到whatsapp</a>
  1. 引入jquery和whatsapp组件:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/rafaelbotazini/floating-whatsapp/dist/floating-wpp.min.js"></script>
  1. 在js代码中初始化whatsapp组件:
$(function () {
  $('#whatsapp-share-btn').floatingWhatsApp({
    phone: '你的电话号码',
    message: '分享的内容',
    showPopup: true
  });
});

在以上代码中,phone的值是你的电话号码,message的值是你需要分享的内容。

以上两种方法任选其一都可以在网站上添加whatsapp分享按钮。