XOOPS輕鬆架

Tad老師您好

初接任網管老師，還在摸索學習如何架設校網。

想請問Tad老師，關於本站消息的部分，

用手機瀏覽的時候，不知道圖片有辦法自動縮小嗎？

如果可以的話，想請教老師要如何修改呢？

使用school2015

http://163.27.182.2/xoop/

感謝老師的協助

0 0

• 
  1) IMG_2105.PNG

當使用ckeditor編輯器插入圖片時，ckeditor會把圖片寬高以style樣式寫入，幾個解法提供討論：

1.使用CSS強制變更寬高比

例如當畫面小於一定尺寸後進行調整

可惜tadnews內文區塊沒有指定class或id，未避免影響其他模組或區塊，自行在樣板加入id

@media (max-width: 767.98px) {

  #ID img {

    max-width: 100%;

    height: auto !important;

  }

}

2.自行在ckeditor圖片編輯頁「進階」「樣式表類別」加入img-fluid或img-responsive

但因為高度寫在style裡，縮小後圖片比例會不對

3.ckeditor自動加入樣式class

參考：https://gist.github.com/fabiomaggio/c2f4b84756cb4d82c0ae

在tadtools CkEditor.php裡加入上方程式碼

會自行加入樣式，並且把寬高從style改用width跟height設定

只是第11行要視佈景支援bootstrap3或4變更樣式為img-responsive或img-fluid

4.採用ckeditor plugin

目前沒成功過，可能要更換ckeditor版本

0 0

不用那麻煩啦～

編輯該文章

點一下圖片

選CKeditor編輯器工具列上的「樣式」→「自適應圖片」

儲存，搞定

0 1

感謝兩位老師的協助，已解決。

0 0