竹貓星球

虛擬網路的真實天堂
https://phpbb-tw.com/phpbb/

[分享]縮圖外掛 Resize Posted Images for phpbb3

https://phpbb-tw.com/phpbb/viewtopic.php?f=116&t=50098

第 1 頁 (共 1 頁)

[分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-01-01 05:07
由 SCR
參考外掛:Resize Posted Images Based on Max Widt 2.4.5

因為 phpbb 3.0 已將 "附加檔案" 的功能給內建了,所以未來使用這功能的討論區將會更多,但針對附加在文章裡面的圖片如果尺寸過大時,依然還是會把整個版面給撐大.
原本 Resize Posted Images Based on Max Widt 2.4.5 這個縮圖外掛是裝在 2.0.* 版本的,剛剛我把他給改了一下安裝的方法,也成功的裝進 phpbb 3.0 內.在此分享給大家.

原始檔頭

代碼: 選擇全部

############################################################## 
## MOD Title: Resize Posted Images Based on Max Width 
## MOD Author: spooky2280 < webmaster@christianfecteau.com > (Christian Fecteau) http://portfolio.christianfecteau.com/ 
## MOD Description: This MOD resizes images within posts to make it so they don't break your layout. Images resized are made 
## clickable and openable in a popup in full-size. You can specify a different max width for each of your themes. 
## Images that do not exceed the max width are left as is. See the MOD in action: http://christianfecteau.com/rmw 
## 
## MOD Version: 2.4.5 
## 
## Installation Level: Easy 
## Installation Time: 5 Minutes (1 minute with EasyMod)
底下是我的修改方法

代碼: 選擇全部

修改文件:6
styles/prosilver/template/attachment.html
styles/prosilver/template/overall_footer.html
styles/prosilver/template/overall_header.html
styles/prosilver/template/simple_footer.html
styles/prosilver/template/simple_header.html
language/語系/common.php

新增文件:1
rmw_jslib.js

開始

代碼: 選擇全部

---- [ 複製 ] -----
templates/rmw_jslib.js  到  styles/prosilver/template/rmw_jslib.js


----- [ 開啟 ] -----
styles/prosilver/template/attachment.html


----- [ 尋找 ] -----
			<dt class="attach-image"><img src="{_file.U_INLINE_LINK}" alt="{_file.DOWNLOAD_NAME}" onclick="viewableArea(this);" /></dt>


----- [ 置換 ] -----
			<dt class="attach-image"><img resizemod="on" onload="rmw_img_loaded(this)" src="{_file.U_INLINE_LINK}" alt="{_file.DOWNLOAD_NAME}" onclick="viewableArea(this);" /></dt>


----- [ 開啟 ] -----
styles/prosilver/template/bbcode.html

----- [ 尋找 ] -----
			<!-- BEGIN img --><img src="{URL}" alt="{L_IMAGE}" /><!-- END img -->


----- [ 置換 ] -----
			<!-- BEGIN img --><img resizemod="on" onload="rmw_img_loaded(this)" src="{URL}" alt="{L_IMAGE}" /><!-- END img -->


----- [ 開啟 ] -----
styles/prosilver/template/overall_footer.html


----- [ 尋找 ] -----
</body>


----- [ 之前新增 ] -----
<div style="display:none" id="resizemod"></div>


----- [ 開啟 ] -----
styles/prosilver/template/overall_header.html


----- [ 尋找 ] -----
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>


----- [ 之後新增 ] -----
<!-- start mod : Resize Posted Images Based on Max Width --> 
<script type="text/javascript"> 
//<![CDATA[ 
<!-- 

var rmw_max_width = 700; // you can change this number, this is the max width in pixels for posted images 
var rmw_border_1 = '1px solid'; 
var rmw_border_2 = '1px dotted'; 
var rmw_image_title = '{L_RMW_IMAGE_TITLE}'; 

//--> 
//]]> 
</script> 
<script type="text/javascript" src="{T_TEMPLATE_PATH}/rmw_jslib.js"></script> 
<!-- fin mod : Resize Posted Images Based on Max Width -->


----- [ 開啟 ] -----
styles/prosilver/template/simple_footer.html


----- [ 尋找 ] -----
</body>


----- [ 之前新增 ] -----
<div style="display:none" id="resizemod"></div>


----- [ 開啟 ] ----- 
styles/prosilver/template/simple_header.html


----- [ 尋找 ] -----
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>


----- [ 之後新增 ] -----
<!-- start mod : Resize Posted Images Based on Max Width --> 
<script type="text/javascript"> 
//<![CDATA[ 
<!-- 

var rmw_max_width = 700; // this max width is used in the Topic Review iframe when posting 
var rmw_border_1 = '1px solid'; 
var rmw_border_2 = '1px dotted'; 
var rmw_image_title = '{L_RMW_IMAGE_TITLE}'; 

//--> 
//]]> 
</script> 
<script type="text/javascript" src="{T_TEMPLATE_PATH}/rmw_jslib.js"></script> 
<!-- fin mod : Resize Posted Images Based on Max Width --> 


----- [ 開啟 ] -----
language/語系/common.php


----- [ 尋找 ] ----- 
));


----- [ 之前新增 ] -----
'RMW_IMAGE_TITLE' => '點擊檢視原尺寸圖片', //mod : Resize Posted Images Based on Max Width


----- [ 清除暫存檔 ] -----
cache 目錄下所有檔案請清除!


----- [ 儲存並關閉所有檔案 ] -----
ps:如果不喜歡顯示的圖片框有捲軸的話,可以修改
styles/prosilver/template/attachment.html

代碼: 選擇全部

---- [ 尋找 ] -----
<dt class="attach-image">

----- [ 置換 ] -----
<dt>

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-01-01 16:59
由 心靈捕手
SCR 寫:因為 phpbb 3.0 已將 "附加檔案" 的功能給內建了,所以未來使用這功能的討論區將會更多,但針對附加在文章裡面的圖片如果尺寸過大時,依然還是會把整個版面給撐大.
其實, 可以不用修改檔案的.

如果您系統啟用 GD 模組, 或安裝 Imagemagick 軟體,
只要設定 'ACP / 一般 / 附加檔案設定 / 建立縮圖: 是' 即可.

TEST & DEMO:
http://wang5555.dnsfor.me/test/phpBB3/viewt ... p?f=5&t=16

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-04-24 23:39
由 peter37
請問原始檔這一部分有做修改，請問 phpBB 3.01 是否也要作修改?

#
#-----[ OPEN ]------------------------------------------
#
templates/subSilver/bbcode.tpl
#
#-----[ FIND ]------------------------------------------
#
# around line 56
#
<!-- BEGIN img -->
#
#-----[ IN-LINE FIND ]------------------------------------------
#
<img
#
#-----[ IN-LINE AFTER, ADD ]------------------------------------------
#
# should look like: <img resizemod="on" onload="rmw_img_loaded(this)" src="{URL}" border="0" />
#
resizemod="on" onload="rmw_img_loaded(this)"
#

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-04-25 17:03
由 peter37
您好

我是用 phpBB3 3.0.1 subsilver2 如果照這樣做修改，在 IE6 或 IE7 瀏灠器下開啟縮圖時會出現問題，開啟縮圖時，無法直接開啟大圖，而是會顯示下載檔案，或是出現底下的訊息

"Internet Explorer 正在執行 (但是己停用附加元件)"

"為了協助保護您的資訊安全性，Internet Explorer 己封鎖這個網站下載檔案到您的電腦。其他選項請按這裡..."

如果是使用其他非 IE 的瀏覽器，開啟縮圖時，則不會出現問題，不知道有沒有辦法修正? 先謝回覆。

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-04-29 00:36
由 hollowaysxp
縮圖專用的JS檔在此下載rmw_jslib.js

以下縮圖程式安裝方法來自竹貓星球SCR的做法，與本人hollowaysxp小修改完成的，hollowaysxp我修改了對於BBCode的[img]語法縮圖，原本只能針對論壇附加檔縮圖。
原文請看這：[分享]縮圖外掛 Resize Posted Images for phpbb3
以下請看

代碼: 選擇全部

因為 phpbb 3.0 已將 "附加檔案" 的功能給內建了,所以未來使用這功能的討論區將會更多,但針對附加在文章裡面的圖片如果尺寸過大時,依然還是會把整個版面給撐大. 
原本 Resize Posted Images Based on Max Widt 2.4.5 這個縮圖外掛是裝在 2.0.* 版本的,剛剛我把他給改了一下安裝的方法,也成功的裝進 phpbb 3.0 內.在此分享給大家. 

hollowaysxp:目前修改為支援BBCode的[img]縮圖，附件檔縮圖交給phpBB3.0.1後台縮圖吧！

原始檔頭
代碼: 選擇全部
############################################################## 
## MOD Title: Resize Posted Images Based on Max Width 
## MOD Author: spooky2280 < webmaster@christianfecteau.com > (Christian Fecteau) http://portfolio.christianfecteau.com/ 
## MOD Description: This MOD resizes images within posts to make it so they don't break your layout. Images resized are made 
## clickable and openable in a popup in full-size. You can specify a different max width for each of your themes. 
## Images that do not exceed the max width are left as is. See the MOD in action: http://christianfecteau.com/rmw 
## 
## MOD Version: 2.4.5 
## 
## Installation Level: Easy 
## Installation Time: 5 Minutes (1 minute with EasyMod) 


底下是我的修改方法
代碼: 選擇全部
修改文件:5
styles/prosilver/template/overall_footer.html
styles/prosilver/template/overall_header.html
styles/prosilver/template/simple_footer.html
styles/prosilver/template/simple_header.html
styles/prosilver/template/bbcode.html
language/語系/common.php

新增文件:1
rmw_jslib.js



開始
代碼: 選擇全部
---- [ 複製 ] -----
複製 rmw_jslib.js  到  styles/prosilver/template/rmw_jslib.js

----- [ 開啟 ] -----
styles/prosilver/template/overall_footer.html


----- [ 尋找 ] -----
</body>


----- [ 之前新增 ] -----
<div style="display:none" id="resizemod"></div>


----- [ 開啟 ] -----
styles/prosilver/template/overall_header.html


----- [ 尋找 ] -----
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>


----- [ 之後新增 ] -----
<!-- start mod : Resize Posted Images Based on Max Width --> 
<script type="text/javascript"> 
//<![CDATA[ 
<!-- 

var rmw_max_width = 800; // you can change this number, this is the max width in pixels for posted images 
var rmw_border_1 = '1px solid'; 
var rmw_border_1 = '1px dotted';
var rmw_border_2 = '1px solid'; 
var rmw_border_2 = '1px dotted'; 
var rmw_image_title = '{L_RMW_IMAGE_TITLE}'; 

//--> 
//]]> 
</script> 
<script type="text/javascript" src="{T_TEMPLATE_PATH}/rmw_jslib.js"></script> 
<!-- fin mod : Resize Posted Images Based on Max Width -->


----- [ 開啟 ] -----
styles/prosilver/template/simple_footer.html


----- [ 尋找 ] -----
</body>


----- [ 之前新增 ] -----
<div style="display:none" id="resizemod"></div>


----- [ 開啟 ] ----- 
styles/prosilver/template/simple_header.html


----- [ 尋找 ] -----
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>


----- [ 之後新增 ] -----
<!-- start mod : Resize Posted Images Based on Max Width --> 
<script type="text/javascript"> 
//<![CDATA[ 
<!-- 

var rmw_max_width = 800; // this max width is used in the Topic Review iframe when posting 
var rmw_border_1 = '1px solid'; 
var rmw_border_1 = '1px dotted';
var rmw_border_2 = '1px solid'; 
var rmw_border_2 = '1px dotted'; 
var rmw_image_title = '{L_RMW_IMAGE_TITLE}'; 

//--> 
//]]> 
</script> 
<script type="text/javascript" src="{T_TEMPLATE_PATH}/rmw_jslib.js"></script> 
<!-- fin mod : Resize Posted Images Based on Max Width --> 

----- [ 開啟 ] -----
styles/prosilver/template/bbcode.html


----- [ 尋找 ] ----- 
<!-- BEGIN img --><img

----- [ 同行加上 ] -----
#################
##這行是加入對於BBCode對[img]縮圖，加入後變成
## <!-- BEGIN img --><img resizemod="on" onload="rmw_img_loaded(this)" src="{URL}" alt="{L_IMAGE}" /><!-- END img -->
#################
 resizemod="on" onload="rmw_img_loaded(this)"

----- [ 開啟 ] -----
language/語系/common.php


----- [ 尋找 ] ----- 
));


----- [ 之前新增 ] -----
'RMW_IMAGE_TITLE' => '點擊檢視原尺寸圖片', //mod : Resize Posted Images Based on Max Width


----- [ 清除暫存檔 ] -----
cache 目錄下所有檔案請清除!


----- [ 儲存並關閉所有檔案 ] -----





這裡是原SCR又補充的部分~這邊我hollowaysxp可沒做
ps:如果不喜歡顯示的圖片框有捲軸的話,可以修改
styles/prosilver/template/attachment.html

代碼: 選擇全部
---- [ 尋找 ] -----
<dt class="attach-image">

----- [ 置換 ] -----
<dt>
文章內看到的var rmw_max_width = 800;可自行修改，800是把圖的寬縮成800個像素，原本SCR是用700，BNW好像是用660。

完全遵照上述的外掛修改成功的網站範例在此：NITCS論壇::拉亞漢堡早餐-桃園市經國路上長榮店

上面有問到的問題應該是bbcode.tpl沒做的話，那[img]的代碼就不會被縮圖，所以參考看看吧！

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-04-29 01:34
由 peter37
縮圖外掛 Resize Posted Images for phpbb3

這一個從 phpBB2 更改而來的縮圖外掛, 如果您的圖片是利用 Attachment 上傳時,當您瀏覽器為 IE ,點擊縮圖 (原圖直接縮圖) 拉大圖時,圖片將會變成下載, 這是因為 phpBB3 使用 Attachment 上傳會將圖片網址加密 (MD5) 所以 IE 開啟 Attachment 的 [img] bbcode 語法直接縮圖的圖片時, 將會變成下載.

hollowaysxp 您的 [img] 縮圖用 ie 可以拉大圖, 那是因為您的圖片是外連, 圖片網址沒有經過 MD5 加密, 所以 ie 可以直接點擊縮圖拉大圖, 而不會變成下載. :-D

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-04-29 09:52
由 hollowaysxp
這個我剛剛試過了，所以我把原SCR大的附加檔縮圖地方取消掉，附加檔這部分心靈捕手大說可用後台的縮圖程式去縮。 :mrgreen:

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2008-08-29 08:06
由 ckenin
心靈捕手 寫:
SCR 寫:因為 phpbb 3.0 已將 "附加檔案" 的功能給內建了,所以未來使用這功能的討論區將會更多,但針對附加在文章裡面的圖片如果尺寸過大時,依然還是會把整個版面給撐大.
其實, 可以不用修改檔案的.

如果您系統啟用 GD 模組, 或安裝 Imagemagick 軟體,
只要設定 'ACP / 一般 / 附加檔案設定 / 建立縮圖: 是' 即可.

TEST & DEMO:
http://wang5555.dnsfor.me/test/phpBB3/viewt ... p?f=5&t=16
我是使用N.Design風格 照心靈大方式在後台開啟縮圖 但沒任何效果
清除快取 跟重新整理風格都做過
但是轉換到prosilver風格且開啟縮圖 就會有視窗條出現 (應該是縮圖成功吧)
若關閉縮圖 視窗條消失 版面就會被撐大

所以反覆交叉實驗 認為這方法只適用初始風格prosilver 才會成功
若選用個人風格 需要"文中縮圖"功能 建議參考心靈大Easy Resize Posted Images 外掛

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2009-03-21 17:05
由 過山雲
這個我也覺得很好的功能

不過是有通過官方認證的外掛嗎?

Re: [分享]縮圖外掛 Resize Posted Images for phpbb3

發表於 : 2009-09-14 09:56
由 拉拉蹦
想請問一下，此外掛跟 http://phpbb-tw.net/phpbb/viewtopic.php?t=41910 所提到的 MW3 是否一樣？

如果圖片是連結到 flickr 之類的網站，是否可以自動順應版面寬度而縮小呢？謝謝！
所有顯示的時間為 UTC+08:00
第 1 頁 (共 1 頁)

Powered by phpBB® Forum Software © phpBB Limited

正體中文語系由 竹貓星球 維護製作