[密技] 在Blog文章裡加入FB推文的『讚』按鈕~語法版 @ 『嵐設』-設計教學部落

！『嵐設』免費電子報訂閱募集中！

Jul 28 Wed 2010 18:33
[密技] 在Blog文章裡加入FB推文的『讚』按鈕~語法版

‧覺得文章不錯請給我一個『讚』作為鼓勵喔！

最近幾篇文章設計嵐都在文章裡加入了Facebook推文的『讚』按鈕~也感謝所有朋友的支持，時常不吝嗇的給予設計嵐所寫文章的肯定，讓我的文章提升了曝光率；當然，好用的東西怎麼可以自己藏私呢？所以今天就來篇教學，讓大家也可以在自己的文章中放入『讚』按鈕，讓大家也都可以幫你推文喔！

其實網路上已經有許多的教學，但是大部分的教學都是要大家連到Facebook的相關頁面進行設定去取得程式碼，然後貼上，今天設計嵐特別大放送，不用這麼麻煩的連來連去，直接分享程式碼，大家修改一下就可以了。是不是佛心來著的啊！？..^^..如果是...要記得也幫這篇文章按一下『讚』喔！哇哈哈哈！

1.複製以下的語法：

<p><strong><span style="color: #ff0000;">‧覺得文章不錯請給我一個『讚』作為鼓勵喔！</span></strong></p> <p><iframe src="http://www.facebook.com/plugins/like.php?href=『在此手動貼上文章的網址』&show_faces=true&width=450&action=like&font=arial&colorscheme=light&height=35" scrolling="no" frameborder="0" style="width: 450px; height: 100px; overflow: hidden;"></iframe></p>

2.接著在發表新文章的時候，按以下按鈕進入HTML編輯模式。

3.在HTML原始程式碼編輯器貼上語法，貼上後按下『更新』。

4.接著繼續完成文章的攥寫並且將文章發布出去。

5.完成發布之後就會有該文章的專屬網址，接著請複製文章的網址。

6.複製完成後再回到文章修改的HTML程式碼編輯器畫面，將複製好的網址貼到語法內，也就是將『在此手動貼上文章網址』取代為文章的網址，然後『更新』就完成嚕！

◎補充說明：

如果大家覺得貼上後推文的範圍尺寸太大，可以自行修改語法裡面的width和height的數值~~不過請注意，要修改正確喔！簡單一句：『請修改width=450;的450數字，以及height=100;的100數字』，各位可以多多測試將這兩個數字改成你們自己喜歡的尺寸，其他的語法就不要亂動嚕.^^.乖~~

不過設計嵐介紹的這麼方法有一個大缺點，那就是『無法自動抓取每篇文章的網址』，因此只好每次發表新文章時就要手動將整個過程進行一遍，這個問題在Google的Blogger有解決之法，但是在其他的部落格則尚待解決，一旦有了解決方法會立刻分享給大家，在此之前就請大家辛苦一下嚕！

ps.如果有各方高手知道解決方法，也歡迎提供！讓小弟的分享可以更完美~~功德無量喔..XD

Posted by 設計嵐 at 痞客邦 PIXNET 留言(58) 引用(0) 人氣()

Forward by E-mail Forward to Guestbook

全站分類：Digital Life
Personal Category:部落格密技
Previous post in this category: [教學] 為自己的部落格文章內容圖片加上拍立得的外框效果
Next post in this category: [部落格密技] 還在哀怨Blog文章沒人氣？讓『萬能推文器』推你一把！
上一篇： [分享]26種免費英文字型下載網站介紹與教學
下一篇： [圖文] 嵐設大辭堂#2~『三長兩短』的由來!!

▲top

Trackbacks (0)

留言列表 (58)

Post Comment

#1 櫻桃小女王 on 2010/07/28 20:13
好棒的分享~可是要從哪裡看到有多少人按讚阿！
你看看我這篇文章的最上面(文章標題下面)就會看到有幾個人按『讚』嚕！
設計嵐 replied in 2010/07/28 20:26

#2 夢哩 on 2010/07/28 20:27
還不錯的分享XD
可是我部落格沒放FB＝　＝
可愛的夢哩~~^^..這個跟您blog有沒有放FB沒有關係喔~~只要按讚的人有FB帳號就可以，而按了讚之後在那個人的FB個人狀態會出現這個訊息~~等於也是幫你的文章增加曝光度喔~~因為其他人可以透過該訊息點選連到你的文章..^^..所以還是可以放上這個按鈕讓大家幫忙推文!!
設計嵐 replied in 2010/07/28 20:36

#3 櫻桃小女王 on 2010/07/28 20:31
看到了看到了~謝謝~因為~剛剛沒有人按~所以我看不到數量~
好實用喔~
那就...
1.也請您幫我按一下讚吧..XD
2.要常常來逛逛喔~~
3.快到您自己的文章加上去吧!!讓大家也幫您推『讚』！

設計嵐 replied in 2010/07/28 20:37

#4 櫻桃小女王 on 2010/07/28 20:41
可是...我的怎麼有亂碼出現啊?
http://chiencherry.pixnet.net/blog/post/26919556
沒有阿~一切正常~~我去幫你推文過了~~你去看看.^^..貼上語法有時候會因為轉換的關係出現奇怪的東西~~別理他~~也別亂刪亂改~~在正確地方貼上网址即可~~^^
設計嵐 replied in 2010/07/28 20:45

#5 夢哩 on 2010/07/28 20:55
原來如此~
我搞錯了＝　＝

那個讚我設定好後在後台看有點類似一張圖
可是它明明是一小串話
怎這麼大一張0.0?
可以讓他範圍變小一點嗎?
耶~懂我再說啥嗎?
我懂..^^..你可以回到HTML編輯器..語法裡面有width和height可以自行修改..^^..我惠改比較大的數字是因為如果推文的人是你FB上的朋友~~會看到頭像喔~~所以我有留下頭像的顯示範圍~~你可以自己改尺寸~~有問題歡迎再問我我教你改..^^
設計嵐 replied in 2010/07/28 21:09

#6 小物 on 2010/07/28 20:56
嵐寫一篇教學文都要花多少時間阿
感覺要截圖又要寫字
如果是我一定要超久的= =+
恩~~不一定耶~~看心情..心情好寫很快..心情不好寫很慢..XD..沒啦我亂說的!!
要看主題嚕~~有些主題要寫很久~~有些就很快~~不一定的..但是截圖因為有專門截圖的軟體所以這項工作倒是很easy..^^..
設計嵐 replied in 2010/07/28 21:07

#7 ddloveaa on 2010/07/28 20:58
謝謝啦 ^^ 還特地寫一篇教學文~~

希望能夠早日有更方便的密技啊 :D
我會努力尋找解學方法..^^Y
設計嵐 replied in 2010/07/28 21:05

#8 夢哩 on 2010/07/28 21:17
有有有~我看到了XD
剛剛自己試推了一下…

我也有推你的這篇唷XD
可是怎只看到我自己的頭像＝　＝
因為你是你自己的朋友阿~~你和我不是FB上的朋友~~所以我看不到你的頭..你看不到我的頭..XD...就是這樣~~如果咱兩互為朋友就可以看到互相的頭..6^^
設計嵐 replied in 2010/07/28 21:34

#9 gemini on 2010/07/28 22:40
請問一下，是不是每個人只要有facebook帳號都可以直接使用這個按『讚』的功能，還是要先在FB上先設一個粉絲團？
不需要有粉絲團喔~~您只要照我這篇文章教學在您的文章上設定即可~~(即使您本人沒有FB帳號也無所謂)..這個的關鍵在於按『讚』的人要有FB帳號~~您按一下我的文章上的『讚』就會知道嚕^^...
設計嵐 replied in 2010/07/28 23:22

#10 恩爸比 on 2010/07/28 22:49
這好像不錯喔哈來研究一下
恩恩..^^..有問題歡迎一起討論喔!!..
設計嵐 replied in 2010/07/28 23:23

#11 恩爸比 on 2010/07/28 23:40
呵呵不錯玩呢
連同論壇的文章我也有試出來了感謝感謝
恭喜您喔..^^Y
設計嵐 replied in 2010/07/28 23:48

#12 恩爸比 on 2010/07/28 23:58
呵呵打算來寫個產生器就不用教其他的蟲友了~.~
蟲??@@?...不過產生器這idea...Cool~~^^...期待!!
設計嵐 replied in 2010/07/29 00:06

#13 MimiFire on 2010/07/29 00:00
感謝分享喔!!^^ 好文大家推推啦!!
Fire大大~您也在文章上放上按鈕~~小弟一定去支持並且推文的..^^Y
設計嵐 replied in 2010/07/29 00:07

#14 米菲 on 2010/07/29 01:12
看起來挺不錯的耶!!
我也來試試看 XD (謝謝分享)
不客氣~~我也會去幫你推文的喔!!!
設計嵐 replied in 2010/07/29 09:55

#15 七先生與艾小姐 on 2010/07/29 09:02
一直對這個東西感到很好奇～
原來是每一篇文章都得加入啊～
感覺好累說.....（我是大懶鬼～嗚嗚～）

但很謝謝嵐的分享哦！超仔細的啦！^O^
不客氣.^^..寫教學文章就是要讓大家看懂...不然寫了就沒有意義了..XD
設計嵐 replied in 2010/07/29 09:54

#16 七先生與艾小姐 on 2010/07/29 09:18
我剛剛很認真的照做了～
結果其實還好，不會花很多時間ㄟ！
以後有心王張只要複製貼上就好了～
耶！超謝謝嵐的啦！！！
因為動作很固定~~每篇文章都加..大概做個兩三次就熟得不得了了..^^..速度會很快~~像我自己就已經很習慣了..XD..
p.s.與法部分複製貼上..不過記得要改文章網址喔^^
設計嵐 replied in 2010/07/29 09:54

#17 炘a on 2010/07/29 09:27
很不錯喔>O<推一下
不過我FB的身分要隱藏一下~嘻嘻
因為"炘a"是網路分身XDD
改天再用分身FB加你^~^
加不加FB朋友倒是還好啦~~重點是妳可以把這個推文按鈕放到你的文章中~~讓大家當你推推..^^
設計嵐 replied in 2010/07/29 09:52

#18 Anthony on 2010/07/29 11:24
感覺還滿實用的...
謝謝分享啊~
不客氣..^^
設計嵐 replied in 2010/07/29 14:21

#19 gemini on 2010/07/29 12:40
很實用的分享,我也幫你按讚了,
不過按完後,好像只是會在自己的塗鴉牆上留言而已，並沒有變為你的粉絲，是因為你沒設粉絲團？
您完全弄錯了這個按鈕的目的了，這個按鈕跟粉絲團一點關係都沒有~~這個按鈕是用來推文的~~按了讚的人.就會在他的FB個人資訊出現一個訊息，這樣的好處是...你幫我按讚，我的文章連結就會出現在你FB的個人檔案訊息中~你的其他FB朋友可能就會看到訊息而連過來看我的文章..^^..了解媽??這是用來幫忙推文增加曝光率的按鈕!!
至於粉絲團，如果您想加入『嵐設』粉絲團，您可以在我的blog右上角有一個歡迎加入粉絲團的側邊欄位，要按那邊的『讚』就會加入我的粉絲團了..^^..
以上~~有問題歡迎在問我喔.^^
設計嵐 replied in 2010/07/29 14:12

#20 ☆故事☆ on 2010/07/29 13:17
謝謝喔～
這方式真的不錯用
真的很方便
我也用類似手法貼google廣告可以再加上去囉～
好用就好~~^^
設計嵐 replied in 2010/07/29 14:08

#21 噴你飯 on 2010/07/29 13:19
看不懂....看不懂...我是CSS白癡....
哪裡不懂!?哪裡不懂!?跟我說~~我教你~~^^
設計嵐 replied in 2010/07/29 14:08

#22 小魔女 on 2010/07/29 17:21
謝分享,
不客氣!!^^
設計嵐 replied in 2010/07/29 18:39

#23 mozaiyang on 2010/07/29 17:53
黑默：感覺真不錯
可是我沒太用fb>///<呵
沒關係啦~~^^...黑默的圖文創作文章不用這個大家也都說『讚』了!!
設計嵐 replied in 2010/07/29 18:38

#24 恩爸比 on 2010/07/29 22:43
請問一下，我要寫篇文章介紹讚語產生器，可以連結到這篇文章嗎^^
當然阿~~^^...我還要謝謝您連結我的文章呢..^^
設計嵐 replied in 2010/07/29 23:19

#25 恩爸比 on 2010/07/29 23:35
呵呵已經寫好囉待會測試去
要不要先給您一份 :p
這事一定要的阿~~我要我要我要!!!^^...謝謝~~~
設計嵐 replied in 2010/07/29 23:54

Private Comment

Private Comment

#28 649 on 2010/07/30 09:17
好棒ㄚ
我也來放個讚看看
這是一定要放的.^^..放好後我去幫你推文!!
設計嵐 replied in 2010/07/30 09:41

#29 potato on 2010/07/30 09:32
感謝分享~我試驗成功囉~^^
恭喜你喔..^^..我會常常去幫你推文的~~也歡迎你常來幫我推推喔~~~^^
設計嵐 replied in 2010/07/30 09:40

#30 earthmax on 2010/07/30 12:02
我有個問題~
如果想更改字的顏色或是把底色改成透明(和文章底色相同)
要從哪裡改呢??
在語法中有一個#ff0000..你只要修改這個...將她改成其他顏色的代碼就可以...這個代碼是網頁色彩十六進位法的代碼~~你可以上網查一下就可以查到其他顏色的代碼..照著打上去修改即可~~~^^
設計嵐 replied in 2010/07/30 16:31

#31 千千媽咪 on 2010/07/30 15:44
好讚唷~
晚點有時間再來放這個~ ^0^
有任何問題歡迎詢問喔..^^..
設計嵐 replied in 2010/07/30 16:28

#32 小豬豬 on 2010/07/30 16:55
請問我貼上語法後,為什麼人數會這麼多啊?
http://june60.pixnet.net/blog/post/10923890
@@?...你的網址貼錯了~~你要仔細看我文章的教學~~將該篇文章專屬的網址貼到語法裡~~每篇文章都有屬於自己的網址哩~~~請將我語法中『....』的地方改貼成您的文章網址~~試試看~~^^
設計嵐 replied in 2010/07/30 18:08

#33 小猴子麻 on 2010/07/30 21:03
好棒喔~
謝謝分享~打包嘍^^
不客氣~~^^..夾去配~~~XD
設計嵐 replied in 2010/07/30 21:54

#34 soho1 on 2010/07/30 22:12
我拿去用摟!

#35 MRT on 2010/07/30 23:57
這個好棒喔～我也要捧走了
謝謝你的無私教學喔～！
不客氣~~好文大家推呀~~^^...您寫得好文章也一定要讓更多人推才行!!
設計嵐 replied in 2010/07/31 10:37

#36 Grace on 2010/07/31 01:33
好棒的教學，Grace改天來試試
謝謝你的分享...
不客氣..^^
設計嵐 replied in 2010/07/31 10:36

#37 小豬豬 on 2010/07/31 02:17
原來是這樣,我終於弄好了,可以幫我測試一下嗎?謝謝
當然可以幫您測試嚕..^^..
設計嵐 replied in 2010/07/31 10:21

#38 Alina on 2010/08/02 00:24
謝謝你喔!
我也放上去了嘿!^^
不客氣喔.^^..設計嵐會去幫您推文的~~
設計嵐 replied in 2010/08/02 10:26

#39 天秤女~佳佳 on 2010/08/03 10:18
這篇寫的好
來用看看
我+你msn喔
我有加入你的粉絲團
謝謝你的支持喔~~我MSN比較少上～不過我也會把你加入的.^^..要常常來逛逛喔~~一起討論交流!!
設計嵐 replied in 2010/08/03 11:41

#40 千千媽咪 on 2010/08/03 15:55
昨天我有試著用,不知道是我用的不對,還是怎麼的~
怎麼讚的那兩行和文章有一段空白咧 >"<
所以又沒放了
哈哈~~我知道你的問題啦~~因為你是直接用我的語法貼上沒有修改~~您可以參考樓上#5篇迴響，我有做過解答喔~~您只要依照您自己的喜好修改width和height的值~~就不會留那麼大的空白了~~^^
設計嵐 replied in 2010/08/03 20:18

#41 Alina on 2010/08/04 10:36
老師!不好意思ㄋㄟ
我來打擾一下嘿XD

好心的格友跟我說我的語法貼錯了!>"<會出現錯誤訊息，這樣在FB時開不出網頁說，她自己是發現~那個網址改掉後，後面有一個「&」不小心會被刪掉~建議我也去看看是不是也是一樣的問題~

不過我到我的後台去看~並沒有刪掉那不該刪的符號耶!
啊~~我真的不太懂說XD
我大概知道您的問題~~可是這很難說明~~我建議你重新複製一次我的語法~~然後照我的教學(要仔細看)...只將網址貼到該貼的地方其他都不可以有任何更動~~這樣就會對了..再試試看..如果還是有問題~~我在看看要怎麼幫你~~
設計嵐 replied in 2010/08/04 12:04

#42 程程媽咪 on 2010/08/04 18:09
我也有問題~
可以看到是那些人幫我按了讚嗎？
在你自己的facebook帳號登入的情況下~~你可以看到幫你推文的『facebook朋友』的頭像~~也就是已經是你FB上的朋友推文可以看見~~其他不是你FB朋友的人推則無法知道~~
設計嵐 replied in 2010/08/04 18:18

#43 梓喵 on 2010/08/06 09:32
好用不過我剛試了一下他出現錯誤ㄋ!!
您應該是有不小心刪除掉了某個語法裡面的文字~~沒關係~~重新複製我的語法一次然後注意：只要將我語法中的『.......』(包含『』)給刪掉用您文章的網址取代即可~~其他都不需要動也要小心不要刪掉或取代了多餘的文字..這樣就不會有錯誤訊息了..^^
設計嵐 replied in 2010/08/06 11:13

#44 kathy happiness on 2010/08/06 12:46
會了!超開心的啦!
您開心!!我更開心啦!!我會努力去幫您推文的..^^...加油!
設計嵐 replied in 2010/08/06 14:07

#45 梓喵 on 2010/08/08 12:16
謝謝老師我會了我不小心把'&"刪掉了哈哈哈 3Q
OK的~~^^....不要客氣!!有成功就好!!!恭喜!!!
設計嵐 replied in 2010/08/08 13:42

#46 XFISH on 2010/08/10 12:07
呵呵前陣子也研究了這個好久
但是因為沒有辦法自動抓取文章網址所以做罷
不過感覺不錯～～～可以借我分享嗎？
歡迎引用喔~~^^....記得註明出處來源即可~~
設計嵐 replied in 2010/08/10 16:57

#47 千千媽咪 on 2010/08/10 23:41
用好囉~~ ^^
謝謝設計嵐唷~
不客氣.^^..我會常去幫千千媽咪推文的.^^..
設計嵐 replied in 2010/08/11 01:19

#48 XFISH on 2010/08/12 09:50
^^b 感謝～
對了我有把你加入我的交換連結以及聯撥裡嚕
http://xfish.pixnet.net/blog/post/5580040
希望可以跟你交換連結科科
這是我的交換連結～～～
http://blog.pixnet.net/xfish/post/5269242
我非常樂意..^^...謝謝您的抬愛~~我立刻加上!!
已經加上去嚕..^^.
設計嵐 replied in 2010/08/12 11:53

#49 靓媽~雪 on 2010/08/15 00:44
忽然想到這篇文章,原來藏在這裡
呵呵!找好久~
剛剛用了很謝謝你耶~
呵呵~~不客氣~~以後您要找文章可以利用側邊欄位的『文章搜尋』喔..輸入關鍵字就可以快速找到了~~^^
設計嵐 replied in 2010/08/15 09:59

#50 ddloveaa on 2010/08/22 11:24
Hello嵐哥~~ 我剛剛意外找到一個超方便，每篇自動加讚的方法耶
你可以到這個網址看看唷 ^^
http://nico.pixnet.net/blog/post/31859297

超簡單就弄好了 ^^ 希望也有解決你的麻煩啦 ^^
挖~~感謝分享~~您更有佛心~~我也代替所有人跟你說謝謝喔~~以琳一定會愛你的..>///<..
設計嵐 replied in 2010/08/22 11:58

#51 菜小咩 on 2010/12/08 14:44
感謝版主的分享
小咩今天操作成功
也連結了版主的貼紙
O(^_^)O
很高興我的教學文章對你有幫助喔..^^...也謝謝你分享我的貼紙..^//^..
設計嵐 replied in 2010/12/10 11:08

#52 騎車撞到床 on 2010/12/11 21:19
感謝大大分享小弟照著教學操作已經成功!!
部落格新手學習中~感謝版主!!

#53 張詞 on 2011/04/16 21:17
剛剛按照您上面方式，到YaHOO 的部落格用，只出現
『覺得文章不錯按讚』而沒有
讚的按鈕
這樣阿~~~會不會是Yahoo部落格不支援此語法??1抱歉因為我沒有用Yahoo的blog...所以不太確定@@
設計嵐 replied in 2011/04/18 20:14