discuz - 增加facebook與plurk的推文按鈕到文章裡面

小星

插件名稱: 增加facebook與plurk的推文按鈕到文章裡面
適用版本: 7.2
作　　者: www.scout-bbs.idv.tw
演示: http://www.scout-bbs.idv.tw/bbs/thread-14347-1-1.html

注意:
修改方式可能會受到您所使用的風格,而必須微調相關內容,這個範例的風格為blue(colors)
另外本站有使用url rewrite的功能,因此如果沒有使用的人必須做相對應的修改

把下面兩張圖放到 bbs\images\default 下


接著進入 bbs\templates\default
開啟 viewthread_node.htm

找到

1. <a href="javascript:;" id="share" onclick="showDialog($('sharewin').innerHTML, 'info', '{lang thread_share}')">{lang thread_share}</a>

複製代碼

下面加上

1. <a href="http://www.facebook.com/share.php?u={$boardurl}thread-$tid-1-1.html" id="facebook" target="_blank"><image src="{IMGDIR}/ajaxaction_facebook.png" title="分享到臉書"  width="50" height="55"></a>
   
2. <a href="javascript: void(window.open('http://www.plurk.com/?qualifier=shares&status='.concat(encodeURIComponent(location.href)).concat(' ').concat('(').concat(encodeURIComponent(document.title)).concat(')')));" id="plurk"><image src="{IMGDIR}/ajaxaction_plurk.png" width="50" height="55" title="推到Plurk"></a>

複製代碼

接著開啟 css_script.htm
找到

1. .useraction { height: 50px; width: 110px; clear: both; display: block; margin: 20px auto; }   .nrate { width: 220px; }   .useraction a { float: left; margin-right: 10px; padding: 30px 0 0; width: 45px; height: 20px; text-align: center; background: url({IMGDIR}/ajaxaction.gif) no-repeat 0 0; }   .useraction #share { background-position: 0 -50px; }

複製代碼

取代成

1. .useraction { height: 50px; width: 400px; clear: both; display: block; margin: 20px auto; }
   
2. .nrate { width: 350px; }
   
3. .useraction a { float: left; margin-right: 10px; padding: 30px 0 0; width: 45px; height: 20px; text-align: center; background: url({IMGDIR}/ajaxaction.gif) no-repeat 0 0; }
   
4. .useraction #share { background-position: 0 -50px; }
   
5. .useraction #facebook { padding: 0px 0 0; background-position: 0 -100px; }
   
6. .useraction #plurk { padding: 0px 0 0; background-position: 0 -150px; }

複製代碼

完成

附上我修改的完成檔案,有需要的人請直接套用看看是否能正常顯示

小星

站長大大您好
有關"增加facebook與plurk的推文按鈕到文章裡面"這篇文章
因為在試用的過程中一直沒有成功
我也是使用DZ7.2版本
想再詳細的請教您一下
以下還有幾個問題想請教一下
1.您所指的bbs\images\中的bbs是否等於一般的www資料夾?
2.關於viewthread_node.html，<images src= ... 中的images在PSPad中是紅色粗體字，不清楚是不是語法使用錯誤，請您指導一下。
3.關於viewthread_node.html，" id="plurk"><images src="....中，在前面的部份感覺有些怪怪的，跟前面的語法合不太起來，請您指導一下。
以上三個問題，麻煩站長您為我解惑，謝謝。

上面是一位網友問我的問題,我想在這邊再補充一些內容

1.
假設你的網頁是在root下,bbs就相當於一個資料夾,因此bbs\images就是bbs資料夾裡的images資料夾
反之如果你直接以root為安裝位置,那應該會有一個images的資料夾,所以把圖片放進去即可

2.
images當然是錯誤的,因為html本身就沒有這個標籤,因此應該是image src...,所以可能必須修正一下

3.
在噗浪的部分,我是用開啟新視窗的方法,裡面有用javascript的部分,所以看起來怪怪的,但是事實上就是一個<a href...><image src....></a>的動作而已
plurk會用到javascript是因為傳送網頁內容要發話時,中文字傳過去會亂碼,因此必須用一些轉換字碼的function,而為了方便,所以直接加入javascript

不知道這樣是否有回答到網友的問題,可以發短訊告知或是回覆本文
謝謝

mkfeng

小星您好:感謝您提供的資料，我目前是已經可以張貼分享到facebook，可是內容沒有像您的分享這樣豐富，有logo圖、短文章、連結等，我分享後只有單純的網址，而且還會連結失敗(網址/thread-xxxx-1-1.html)，想請您指導一下。

小星

小星您好:感謝您提供的資料，我目前是已經可以張貼分享到facebook，可是內容沒有像您的分享這樣豐富，有log ...
mkfeng 發表於 2010-6-2 14:26

我已經傾囊相授了,另外我也不太懂你的問題在哪

首先我先說明我有用 url write ,這個是用來讓網址靜態化(就是變.html結尾)

另外就是如果風格不同,可能會造成一些差異,所以我不知道你是否遇到風格問題
這一點就必須對程式碼有一點概念,這樣才追蹤的出來大概要改哪裡,或是怎麼設定

因此我只能說我對你的問題,心有餘但是力不足....

nedino

回復 3# mkfeng

偶然逛到這裡看到您的問題
我簡單的說明一下改程式碼的做法

我看了一下本來裡面要修改的方式就是靜態化的頁面
因此我們要做的部分就是定義位置,讓網址可以被找到

我把寫法貼在下面
開啟 viewthread_node.htm
找到

1. <a href="http://www.facebook.com/share.php?u={$boardurl}thread-$tid-1-1.html" id="facebook" target="_blank"><image src="{IMGDIR}/ajaxaction_facebook.png" title="分享到臉書"  width="50" height="55"></a>
   
2. <a href="javascript: void(window.open('http://www.plurk.com/?qualifier=shares&status='.concat(encodeURIComponent(location.href)).concat(' ').concat('(').concat(encodeURIComponent(document.title)).concat(')')));" id="plurk"><image src="{IMGDIR}/ajaxaction_plurk.png" width="50" height="55" title="推到Plurk"></a>

複製代碼

改成

1. <a href="http://www.facebook.com/share.php?u={$boardurl}viewthread.php?tid=$tid" id="facebook" target="_blank"><image src="{IMGDIR}/ajaxaction_facebook.png" title="分享到臉書"  width="50" height="55"></a>
   
2. <a href="javascript: void(window.open('http://www.plurk.com/?qualifier=shares&status='.concat(encodeURIComponent(location.href)).concat(' ').concat('(').concat(encodeURIComponent(document.title)).concat(')')));" id="plurk"><image src="{IMGDIR}/ajaxaction_plurk.png" width="50" height="55" title="推到Plurk"></a>

複製代碼

應該就可以了
真正動到的部分只是取代掉靜態化的程式碼部分
{$boardurl}thread-$tid-1-1.html
改為
{$boardurl}viewthread.php?tid=$tid

只是借花獻佛,還是要感謝版大的分享!

xgameover

回復 1# 小星

請問我裝了  facebook和plurk 之後  

http://twdudu.com/thread-247-1-1.html

為什麼沒有置中......好像靠左邊，請大大幫忙看一下  謝謝

小星

回復  小星

請問我裝了  facebook和plurk 之後  



為什麼沒有置中......好像靠左邊，請大大幫忙看 ...
xgameover 發表於 2010-7-28 04:57

這部分我想跟風格有關係(可能要自己微調尺寸),當然如果你也放上支持與反對的按鈕,我想應該就可以看到置中的效果了

xgameover

回復 7# 小星

可以教我怎麼調整嗎？應該跟風格沒有關係，但也不太想裝頂和踩

xgameover

回復 7# 小星

請問哪裡有支持和反對的按鈕呢？

我在貴站的Dvbbs論壇 / Discuz論壇 版塊裡都找到的說。

小星

回復  小星

請問哪裡有支持和反對的按鈕呢？

我在貴站的Dvbbs論壇 / Discuz論壇 版塊裡都找到的說。
xgameover 發表於 2010-7-28 19:46

進入後台找到 全局/論壇功能/主題評價

啟用主題評價