無作為
不僅僅是一種態度!

红运快三开奖结果3:wordpress右下角添加多懸浮按鈕以DUX主題為例

红运快三高手计划 www.syvwfz.com.cn 給wordpress程序的網站右下角多添加幾個懸浮功能按鈕吧,默認的基本只有回到頂部一個,這里以dux為例子,給dux主題添加除了回到頂部以外的其他懸浮按鈕。

DUX主題添加懸浮按鈕

DUX 主題右側有個懸浮的工具欄,記得好像是 DUX 4.0之前的版本好像只有“去頂部”與“去評論”兩個按鈕,

DUX 4.1 之后又新增了“QQ咨詢”的按鈕,但是對于想要自定義更多功能的朋友們來說這些似乎還不夠,

這里我以新增“微信公眾號”的例子給大家說一下新增其他按鈕的方式,大家可以照此法添加更多其他功能。

效果圖如下:

首先在修改主題之前還是希望大家先備份一下主題,以防不測!

主題修改的文件主要有:options.php、footer.php 與 main.js 三個文件,下面說下具體步驟。

新增后臺自定義設置按鈕

DUX 主題后臺控制面板是采用的 Options FrameWork 框架實現的,這點我們已經多次提到。這里我們還是按照老習慣將下面這段代碼直接丟到主題的 options.php 文件中去。

// 右側浮動微信浮動
$options[] = array(
'name' => '右側浮動微信公眾號'.'( QGG )',
'id' => 'qgg_float_wechat_open',
'type' => "checkbox",
'std' => true,
'desc' => '開啟'.'');

$options[] = array(
'name' => '微信公眾號識別碼'.'',
'id' => 'qgg_float_wechat_id',
'desc' => '微信公眾號識別碼,非微信公眾號ID。如何獲取請<a rel="nofollow" href="//www.syvwfz.com.cn/link?url=aHR0cDovL2Jsb2cucXVpZXRndW9ndW8uY29t">點擊這里</a> 。',
'std' => 'MzI3ODM5NzM2Mw',
'type' => 'text');

$options[] = array(
'name' => '微信公眾號二維碼'.'',
'id' => 'qgg_float_wechat_img',
'desc' => '此處上傳您的微信二維碼圖片',
'std' => 'https://blog.quietguoguo.com/qggblog/wp-content/uploads/2017/12/weixingongzhognhao.png',
'type' => 'upload');

在后臺可以看到:

獲取自定義 JS 參數初始值

在 footer.php 文件中找到 window.jsui 對應的代碼,添加如下代碼至末尾,注意代碼中標點的使用:

/*微信公眾號浮動 */
 qgg_float_wechat_id: '<?php echo _hui('qgg_float_wechat_open') ? _hui('qgg_float_wechat_id') : '' ?>',
 qgg_float_wechat_img: '<?php echo _hui('qgg_float_wechat_open') ? _hui('qgg_float_wechat_img') : '' ?>'

添加 JS 特效

在 main.js 文件中找到 * rollbar 注釋對應的代碼,在其下添加如下代碼:

/* 微信號公眾號 */
jsui.rb_qgg_float_wechat = ''
if( jsui.qgg_float_wechat_id ){
    jsui.rb_qgg_float_wechat = '<li><a target="_blank" rel="nofollow" href="//www.syvwfz.com.cn/link?url=aHR0cHM6Ly9tcC53ZWl4aW4ucXEuY29tL21wL3Byb2ZpbGVfZXh0P2FjdGlvbj1ob21lJmFtcDtfX2Jpej0nPC9zcGFuPjxzcGFuIGNsYXNzPQ=="pun">+jsui.qgg_float_wechat_id+'==&scene=110#wechat_redirect"><i class="fa fa-wechat"></i><h6 style="top:-60px; width:200px; height:200px"><img src="'+jsui.qgg_float_wechat_img+'" ><i></i></h6></li>'
}

隨后找到?+jsui.rb_comment 這行代碼,在其上添加?+jsui.rb_qgg_float_wechat 添加完成后應為如下這般:

jsui.bd.append('\
    <div class="m-mask"></div>\
    <div class="rollbar"><ul>'
    +jsui.rb_qgg_float_wechat
    +jsui.rb_qq
    +jsui.rb_comment
    +'<li><a href="javascript:(scrollTo());"><i class="fa fa-angle-up"></i></a><h6>去頂部<i></i></h6></li>\
    </ul></div>\
')

如果此處忘記添加的話,前端可能會報“undefined”錯誤。

閑談微信公眾號關注超鏈接的實現及“標識碼”的獲取

本來是希望能夠直接點擊鏈接實現彈出微信公眾號關注頁面的,但是沒有找到相關的接口,這里我們知道,當我們在微信中搜索相關公眾號并點擊“查看歷史消息”會出現關注界面,同時點擊右上角三個點再點擊復制鏈接會獲取到如下這段鏈接:

https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI3ODM5NzM2Mw==&scene=124#wechat_redirect

對于這段鏈接中標紅的 MzI3ODM5NzM2Mw 既是我們所需要的微信標識碼。這里是我的標識碼,每個公眾號都不一樣,大家可自行獲取。

除了上面所說的獲取方式,我們通過電腦瀏覽器打開微信公眾號發布的任意一篇文章,會在瀏覽器地址欄中發現形如下方這段鏈接:

所以說我們也可以通過這種方式獲取標識碼。值得注意的是,上面這種通過超鏈接獲取微信公眾號關注頁面的方式并不能在其他客戶端中使用,僅能在手機微信客戶端打開才有效,所以說大家請自行選用。

歷史上的今天:
贊(7) 打賞
所有免費資源、福利、電影、破解軟件未經允許不得轉載:红运快三高手计划 www.syvwfz.com.cn红运快三高手计划 » wordpress右下角添加多懸浮按鈕以DUX主題為例

留下評論 1

  1. #1

    老無 你怎么不在 無作為 添加???

    Byings2年前 (2018-07-21)回復

無作為-不僅僅是一種態度

登錄/注冊廣告合作

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

微信掃一掃打賞