Element XD lab
哥教的不是CG,是偷雞
快速導引
顯示具有 facebook 標籤的文章。 顯示所有文章
顯示具有 facebook 標籤的文章。 顯示所有文章

【一行碼解決FB讚與Google+1小按鈕的對齊問題】


(左圖,自己裝小按鈕的時候,會發生不對齊的現象,不由自主會把頭歪一邊)
(右圖,貼一行程式碼就解決了)

【Blogger + FB】兩分鐘幫Blogger設定好Facebook的OG(Open Graph)

我們在Facebook分享網站連結的時候,都希望能自動出現『縮圖』、『文章標題』、『網址』、『網站名稱』,最好還有『文章摘要』,這個需求,在Blogger裡面可以利用Facebook提供的OG工具(Open Graph)來解決。

(FB上面分享網址,希望自動出現文章相關資訊時,需要自行設定OG)

【Blogger】手機發文之後自動分享到Facebook

這一篇的出發點是,我們能不能利用每天固定的零碎時間來經營部落格?

在每天通車這樣的大量零碎時間中,手機通常只能消磨時間,或者打打遊戲上上FB,對於時間寶貴的部落客來說,浪費掉挺可惜的。

偶爾有心得也只能用Facebook發個短文,如果想要寫一篇Blogger文章,通常是記載零星筆記回去才整理,或是乾脆下載手機版Blogger App來發文。

【Blogger】一次裝一整排分享按鈕的ShareThis,再加上反反盜拷解法

裝分享按鈕說複雜倒也不會,但是搞了半天才裝好一個,如果要把好幾個按鈕要裝在一起,又會出現大小不一致排排站不好看的樣子。

我在摸索不同的分享按鈕時,無意間找到了這個東西,如上圖紅框框處,只要幾個步驟就裝完一整排的分享按鈕,完全不用動到自定HTML,看起來排在一起挺協調,而且還有好多不同種類可以選擇,竟然還有Evernote,真是太有趣了趕快看下去。

【Blogger】在文章頭尾安裝『Facebook讚』按鈕 - XFBML版


一個讚按鈕寫了三篇文章會不會太扯?


不會不會,在我的測試中,
HTML版安裝方便,按下去讓人數加1
IFRAME版速度快一點,按下去讓人數加1
這一篇的XFBML按下去讓人數加1,再多了一個好功能,如下圖的留言框

【Blogger + FB】在文章頭尾安裝『Facebook讚』按鈕 - iframe版


延續這一篇【社群】在文章頭尾安裝『Facebook讚』按鈕 - html版
如果是第一次安裝讚按鈕,請參考上面文章的前三步,第四步改以本篇的代碼貼到對應位置即可。

在實際測試下,我發現html版的載入速度稍慢,於是想測試iframe版,發現速度比較快,於是提出來做個分享。

【Blogger + FB】安裝『Facebook推薦』框


Facebook推薦框的安裝跟前兩篇「Facebook」外掛一樣,基本步驟有四

1.取得fb:app_id、fb:admins的兩串數字
2.將上面兩串數字替換掉以下對應的數字,置入<head>這一行之後
<meta content='724021988' property='fb:admins'/>
<meta content='545652602172637' property='fb:app_id'/>
3.在<body 這一行後面置入代碼
4.選擇放推薦框的位置,置入代碼

如果之前依照上述方式安裝過「讚」或者「留言板」,表示前三步驟都已經做過了,那直接執行以下步驟就好了。

如果是第一次安裝,請到這邊看一下「前三步驟快速複習」

【Blogger + FB】在文章頭尾安裝『Facebook讚』按鈕 - html版

就像Google+1按鈕一樣,如果我們想為每一篇文章加上Facebook按鈕的話,應該怎麼做呢?


基本步驟有四
1.取得fb:app_id、fb:admins的兩串數字
2.將上面兩串數字替換掉以下對應的數字,置入<head>這一行之後
<meta content='xxxxxxxxx' property='fb:admins'/>
<meta content='xxxxxxxxxxxxxxxxxx' property='fb:app_id'/>
3.在<body 這一行後面置入代碼
4.選擇放留言板的位置,置入代碼


前三步驟請按照這一篇的方式安裝過Facebook留言板,基本上是通用的。

【Blogger + FB + G+】Facebook、Google +與預設Blogger留言板並存的方法


才剛開張,瀏覽數不到800,而其中一大半是自己更新文章與修改後台造成的,另一大半是網路機器人爬的,實際來捧場的人寥寥可數,這樣裝三個留言板是為了展現站長的幽默感嗎?

不是這樣的啦XD

【Blogger + FB】安裝並管理facebook留言板

安裝facebook留言板說簡單也不太簡單,有時候幾個小地方難搞令人沮喪,這裡整合了幾篇教學的精華部分,一次以圖解說明如何安裝與管理。

技術提供:Blogger.


Adobe (47) After Effects (43) Element 3D (40) 後製 (33) 教學 (28) blogger (26) 硬體 (13) 社群 (11) 部落客 (11) facebook (10) Apple (9) 小按鈕 (7) 測試 (7) Cinema 4D (6) Element 3D 從零開始 (5) google plus (5) 小工具 (5) 精華 (5) 判斷式 (4) 作品集 (3) 文章 (3) Autodesk (2) MacBook Pro (2) maya (2) slider (2) 備份 (2) 兒時記趣 (2) 搜尋 (2) 留言板 (2) 行動 (2) 課程 (2) BackLight (1) DIY (1) Document Cloud (1) Heat Distortion (1) IFTTT (1) Mega Tool (1) Newton 2 (1) Premiere (1) iPhone (1) og (1) open graph (1) scripts (1) 改裝 (1) 範本 (1) 簽名檔 (1) 繼續閱讀 (1) 雜記 (1) 雜項 (1) 駭客 (1)

聯絡


聯絡表單

名稱

以電子郵件傳送

訊息

© thephilko.com All Rights Reserved