插入表情符號APP ~ 懶人包－❤️灰鴿❤️

使用表情符號貼圖 APP、的另一種選擇

請進來觀看 ~ 免費

啥密系懶人包、當然就是打包回去、不用修改直接貼上就可以使用 ~ 嘍

懶人包的內容 : 就是我目前使用的花卉 ♥ 美食、表情符號貼圖 APP

範例請到樓下觀看 ~

安裝步驟 :

將程式碼複製起來、貼到任何可以寫入的欄位裡

在部落格裡、有哪些地方 ? 可以寫程式碼、樣式表呢 ?

答案 ~ 1. 部落格基本設定>> 部落格描述，側邊欄位設定 >> 2.公告區塊，3.頁尾描述，4.兩旁側欄的自訂欄位。

位置如下圖所示 ~

說明一下 : 這個程式、我使用了自訂的代碼 ~ [Qz::] ~ ，所以和痞客邦的留言插入表情符號APP、一點瓜葛也沒有

因此~ 這個程式APP是無法在你的管理後台、顯示表情符號貼圖的....

倘若、你覺得懶人包的圖片甭甲意，也可以選用我格子裡其他、所有的任何一本相簿

以下~ 是本格子開放可使用的9本表情符號圖片、相簿的 id

icon-1 麥啦風 set_id=7410921，icon-2 水窈姬 set_id=13321966，icon-3 ㄚ子 set_id=13874362

icon-4 洋蔥頭 set_id=13874365， icon-5 歡喜猴 set_id=13874386，icon-6 喵喵 set_id=13888006

icon-7 ☆ 花卉 set_id=5931114， icon-8 ♥ 美食 set_id=13874467，icon-9 Top100 set_id=15175972

icon-1

icon-2

icon-3

icon-4

icon-5

icon-6

icon-7

icon-8

icon-9

目前尚未建立 : 空白

icon-10

假如 ~ 你想使用自己的相簿，請參閱(使用) 這篇 >> 隱藏式 / 表情貼圖 Ver : 1.0

(可以和P客的留言插入表情符號一同使用 )

什麼是使用者 id ? 就是你在P客邦的登入帳號啦!!，什麼是相簿的ID，要如何知道相簿的id ?

打開相簿或相簿管理後台，然後看網址列最後面的那串數字就是相簿的 ID 、如下圖紅色圈圈所標示

假如 ~ 你想選用我格子裡其他的相簿當作來源、只需要修改到程式內容、如下紅字

<script type="text/javascript">

var Stid = ["5931114","13874467","15175972"]; 相簿的 ID

若要新增一個側邊欄位 : 請到 http://panel.pixnet.cc/blog/sidecolumn 點選右上角 [新增版位]

[自訂標題] 建議填上  、這是註解的寫法、網頁上是不會看到你愛我這串文字的

　　　複製下面區塊內的程式碼、貼到側邊欄位的 [自訂區塊內容] 或其他的欄位裡 ~ 最後記得要按下右下角的[儲存版面]

<style type="text/css"></style>


<div id="panel">
<div class="slider">
<div id="itemA"></div>
<div id="MenuA" class="Menu">花卉 ☆ Flower</div>
</div>
<div class="slider">
<div id="itemB"></div>
<div id="MenuB" class="Menu">美食 ☆ Food</div>
</div>
<div class="slider">
<div id="itemC"></div>
<div id="MenuC" class="Menu"> ☆ Top 100<button style="float: right;">隱藏</button></div>
</div>
</div>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript"> // ![CDATA[

var jq3x = $.noConflict();

if(document.getElementById('article-main')){

jq3x(function(){

var Stid =["5931114","13874467","15175972"];
var reg=new RegExp('https?://pic.pimg.tw/e717/(.+)?','i');

jq3x('#comment_form').after
('<div style=" width: 200px; margin:50px auto;"><div id="emotion-icon" style="margin-top: -50px; cursor: pointer; float:left;"><b style="color:#ff00f0;">灰鴿 </b> ❤️ 表情符號</div></div>');

jq3x("#panel").on('click',"img.emo-item",function(){ Paste(jq3x(this),'[Qz::',']',reg);});

jq3x("#emotion-icon").click(function(){jq3x("#panel").fadeToggle(1200)});
jq3x("#panel button").click(function(){jq3x("#panel").fadeToggle(1200)});

jq3x("#emotion-icon").one('click',function(){

jq3x.each( ['#itemA','#itemB','#itemC'], function( inx, itm) {

jq3x.getJSON('https://emma.pixnet.cc/album/elements?callback=?',{user:'e717',set_id:Stid[inx],trim_user:1,with_detail:1,page:1,per_page:107})
.done(function( data) {jq3x.each( data.elements, function( i, item) {

jq3x(itm).append( '<img src="https://pic.pimg.tw/e717/'+ item.original.match(reg)[1]+'" class="emo-item" />');
});

jq3x(itm).append( '<span>隱藏式 / 表情貼圖 Ver : 2.1</span> ');
});

}); });

});

var X_Var = setInterval(X_Timer ,800);
function X_Timer() {

if(jq3x('#comment-text ul').length>0) { R_emo(); clearInterval(X_Var);}
}

}

var R_emo = function () {

var com_txt = jq3x('#comment-text') || document.getElementById('comment_text');

com_txt.find('li.reply-text,li.post-text').html(function(index, text)
{ return text.replace(/\[Qz::([^\]]+)\]/g,'<img align="absbottom" src="https://pic.pimg.tw/e717/$1" />');

});

};

var Paste = function(ts,start,end,Rx){
var MyStr = start + ts.attr('src').match(Rx)[1]+end;
MyComm = document.getElementById('comment_text');

if(MyComm.selectionStart || MyComm.selectionStart == '0'){
    var startPos = MyComm.selectionStart;
    var endPos = MyComm.selectionEnd;
        MyComm.value = MyComm.value.substring(0, startPos) + MyStr +
        MyComm.value.substring(endPos);
    }
        else{ MyComm.value += MyStr; }
startPos+= MyStr.length;
MyComm.setSelectionRange(startPos,startPos);
MyComm.focus();};

// ]]>
</script>

※ 此APP軟體、由本人無料授權，可以任意複製、轉貼、修改、分享。