Ripro美化-头像悬浮窗添加一键复制推广链接

教程开始

第一步打开ripro/子主题的/parts/navbar-hover.php搜索header-bottom，然后在上面添加以下代码【如果子主题没有这个文件的去ripro复制一份】

<!–用户下拉框新增推广链接start–>
<div class=”tg-xinghai” id=”xhrefurl” data-clipboard-text=”<?php echo cao_get_referral_link($current_user->ID)?>” style=”cursor: pointer;”>
<span id=”xhrefurl”><?php echo cao_get_referral_link($current_user->ID)?></span><em>复制推广获取佣金</em>
</div>
<!–用户下拉框新增推广链接end–>

第二步添加样式代码添加到diy.css

/*用户下拉框新增推广链接*/
.header-box .tg-xinghai {
height: 40px;
line-height: 40px;
position: relative;
overflow: hidden;
margin: 10px 0;
border-radius: 5px;
padding-left: 10px;
color: #fff;
background: linear-gradient(125deg,#f90202 0%, #2f49fd 100%);
}

第三步，添加js代码到你任何注册到主题的文件中，

// 推广链接复制功能
function copyArticle(con) {
const range = document.createRange();
range.selectNode(document.getElementById(con));
const selection = window.getSelection();
if(selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand(‘copy’);
}
$(‘#xhrefurl’).click(function () {
copyArticle(‘xhrefurl’)
});

也可以把第二段代码添加到footer.php</html>后面

<script type=’text/javascript’>
// 推广链接复制功能
function copyArticle(con) {
const range = document.createRange();
range.selectNode(document.getElementById(con));
const selection = window.getSelection();
if(selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand(‘copy’);
}
$(‘#xhrefurl’).click(function () {
copyArticle(‘xhrefurl’)
});
</script>