SCLUB免費論壇申請-使用者論壇's Archiver

征雪 發表於 2011-7-8 08:00

弱弱的美化筆記、

[i=s] 本帖最後由 征雪 於 2011-7-8 08:14 編輯 [/i]

[color=sienna]修改論壇Ico。

首先至製作Ico的網頁製作一個Ico / 敝人是都使用 : [/color][url=http://www.favicon.cc/][color=sienna]http://www.favicon.cc/[/color][/url]
[color=sienna]> 製作完成後請下載檔案 - 另外上傳至網頁空間。將上傳後的Ico網址複製下來貼到筆記本。

然後登入後台 - 界面 > 模板管理 > 找到header > 在<head>
下方加入 :[code] <link href="Ico連結" rel="shortcut icon" type="image/x-icon/" >
[/code][/color]
[color=sienna][/color]
[color=sienna]記得把Ico連結換成剛剛複製下來的Ico網址。


修改發帖、回復鈕。

不需要另外把語法貼在其它地方 / 因為模組本身已經有控制這地方的代碼 - 將語法貼在其它地方有可能造成有些部分無法修改或是產生bug。

登入後台 - 界面 > 模組管理 > 找到css_common > 然後點開瀏覽器上工具列的 編輯 > 尋找這個頁面的資料 , 打上 reply , 它會自動跳到關鍵字處 稍微下面一點點 就可以找到 :[code].replybtn { background-image: url({IMGDIR}/reply.gif); }
                .postbtn a, .replybtn a { display: block; padding-left: 5px; color: #C77D28; letter-spacing: 5px;font-weight:700; }
                .postbtn a:hover, .replybtn a:hover { text-decoration: none;color: #995D18; }[/code]先在.replybtn的前面空一格加上.postbtn, 才會兩個鈕都修改到。
如果只是要換掉圖片 / 就把[code]{IMGDIR}/reply.gif[/code]換成自己要的圖片網址即可。
若不想使用背景圖片 / 就把[code]background-image: url({IMGDIR}/reply.gif);[/code]刪掉,改成背景色及字體的設定。
例如 :[code]background:#000000;
color:#ffffff;
font-family:verdana;
font-size:11px;
font-weight:700;[/code]依序分別是 背景色彩、字體色彩、字型、字體大小、字體格式。如果不要粗體就把700都改成400 /
(敝人編輯一般部落格css時都是用bold和normal做設定,不過看了模組的語法都是用700和400 / 還算是初學者不是很清楚這中間的用意和差別 所以想說還是照著來就好。)[code].postbtn a, .replybtn a[/code]是控制兩個鈕的連結 / 不過基本上因為它是發帖和回復 所以本身就是個連結,這裡修改的話馬上就會顯現出來。
不過在這裡只要更改色碼就好了..其它的視個人需要而定。
稍微解釋一下 display是指表現方式,block就是以一個區塊表示。padding-left指的是在此區塊內左邊的間距,如果是margin的話就是此區塊與別的區塊的間距。
letter-spacing是指字元間的間距,間距越大字和字分得越開。它這裡是使用px,也可以用pt(個人習慣用pt / pt的每個單位尺度比px的大上一些。)
.postbtn a:hover, .replybtn a:hover 就是滑鼠移到發帖或回覆鈕上的效果。
這裡可以不更動 / 如果想要移上去有變化 就改一下此處的背景或字體顏色吧。

[/color][color=sienna]不要跟上面兩條的色碼一樣,不然會看不出來。
[/color]
[color=#a0522d]補充一下色碼的選擇器 : [url=http://abowman.com/google-modules/color-chooser/]http://abowman.com/google-modules/color-chooser/[/url][/color]
[color=sienna]

橫版版塊增加圖示。

發現設定子板塊橫排的時候竟然沒有圖了 .
所以就只好自己加。

登入後台 > 界面 > 模版管理 > 找到discuz 然後也是使用尋找頁面資料 - > 找到 : <th width="$cat[forumcolwidth]"{$forum[folder]}>
然後改成 :[code]
<!--{if $forum[icon]}-->
<td width="$cat[forumcolwidth]"{$forum[folder]}>{$forum[icon]}
<!--{else}-->
<th width="$cat[forumcolwidth]"{$forum[folder]}>
<!--{/if}-->
[/code]這樣自己在板塊裡設定的板塊圖示就會在橫排也顯現出來了。
備註 : 板塊圖示設定方式 - 登入後台 > 板塊 > 板塊管理 > 編輯 裡面就有板塊圖示的部分 / 貼上相對或絕對地址即可。

其它基本美化都可以在風格管理的高級模式進行設定。
基本的一些字體大小、字型、顏色等等 .. 可以在 css_common裡body標籤做設定。

a標籤是連結,a:hover標籤是滑鼠移上連結時。


題外話 :

內容什麼的都沒有內收。不用回覆就可以看得到 - 因為敝人不是很喜歡回覆者直接打個 感謝大大 什麼的 ..這種沒有意義的發言。

論壇通常基本設置字數是10 然後想看帖的就打 感謝大大~~~~~~ 10個字剛好過關。
如果字數設置是20 那麼就變成 感謝大大~~~~~~~~~~~~~~~~ 20個字又剛好過關了。

如果是這樣的話,那不如不回。說真的。



[/color]

繽紛色彩 發表於 2016-9-25 12:50

看來幾好玩
可惜我還是不懂得使用

頁: [1]

Powered by Discuz! Archiver 7.2  © 2001-2009 Comsenz Inc.