Creative Commons License 本站文章係採用創用CC「姓名標示-非商業性-禁止改作2.5台灣版」授權條款釋出。個人轉載請注明出處,商用請來信洽談!

sFun1.2 三欄模版主題設計 for F2blog

sFun1.2 三欄模版主題設計 for F2blog (皮肤 skin)






模版名稱:sFun1.2
製作者:Ricky
發佈時間:2009.07.26
最佳顯示:1024×768+
瀏覽器:相容於IE7、IE8、Firefox3、Google、Netscape8、Opera9、Safari4、Maxthon2、IE6(小小走位)
說明:目前F2blog自身並無支援三欄模版,三欄模版使用自定義絕對位置達成 (請參考最下面的使用說明)
v1.1修正內容:
1. 修正以IE外瀏覽器嚴重的錯位走位
2. 調整欄寬適用於1024×768 (原為1200)
3. 重製Flash頂部版頭
v1.2修正內容:
1. 修正相容於大部份的瀏覽器錯位達到最小值
2. 製作非Flash頂部版頭圖
3. Flash版頂部版頭製作可修改blogtitle及bloginfo
4. 欄位細部調整

下載sFun1.2:

[download id="7″]

下載sFun1.2 Flash版:
Flash只差在是用flash製作的版頭, 會動~~其他都一樣.

[download id="8″]

…………………………………………………………………………………
sFun1.2 Flash版,使用說明:
打開模版內flash資料夾內的blogtitle.htm,用筆記本打開即可,修改blog網址、標題、描述內容等,就可在flash頂部版頭裡顯示blog標題及資訊。


 請輸入blog標題
 

請輸入blog描述

修改完後在啟動模版即可。

…………………………………………………………………………………
sFun1.2模版第三欄使用說明:
1. 打開CSS檔typography.css,將CSS檔案內容拉到最下,即可看到『自定義側檔樣式』。
2. 目前看到的都是RICKY自身在用的模組,請自行定義您要顯示的模組【修改名稱】及調整【top值】,其他的值建議不要動,除非您想修改模版。
3. 模塊的名稱請於後台『界面模組』>『模組設定』裡即可看到。

/*--搜尋--*/
 #Side_Search{   /*模組名稱*/
 position: absolute;
 top: 166px!important;    /*調整模組上下位置*/
 left: 807px;
 width: 160px;
 BORDER-RIGHT: #E3E3E3 1px solid;
 padding-left: 5px;
 padding-right: 5px;
 }

註:自定義於第三欄的模組,將不會在出現在於第二欄中。

希望各位F2blog的網友們會喜歡本模版,也記得給RICKY一個評論回應,支持一下小弟囉~!
如果發現有問題,也請高手們不吝指教,最後~開心的使用三欄吧~!



Share Button
喜歡本文章的話~記得按個 "讚" 及 "分享" 貼文哦~
按讚記得按確定哦~分享本文或FB留言時如出現"分享連結似乎不安全"等字樣,請乎略提示!直接分享沒關係的!本站可能被惡意檢舉FB,目前正在向FB提出處置錯誤申請。

迴響

  1. 阿勳 說道:

    標題不見了
    我用的是有flash的
    請大大幫一下

  2. Allie 說道:

    真的好棒!我帶走了,謝謝!

  3. 傑尼斯 說道:

    RICKY
    你幫我修改的CSS
    我想我自己可以先來改看看!不要每次都麻煩你,畢竟我知道改這個真的很麻煩的!
    但…
    如果改不好只好再求教你囉!!

    1. ricky 說道:

      修改CSS並不難, 主要是麻煩
      如果你能學會的話, 對你是有幫助的~

  4. 傑尼斯 說道:

    RICKY真是麻煩您啦!我已經更新你傳給我的CSS囉!
    只是…如果解析度調整到1200×800會發現整個主題全部靠左,
    未能置中是這主題模板小小缺失!
    雖然是這樣,但我有這樣的模板用已經很滿足和喜歡了!

    RICKY期待將來還會有更好的作品發表喔!
    再次謝謝您喔!
    [img]http://wabis.biz/up0015/200907310028459118644394.gif[/img]

    1. ricky 說道:

      其實我以前有做過置中版的三欄, 但是是全版面型的.
      年代久遠,資料不知道丟那去了..哈
      現在用的這個三欄,之前有想過要研究一下置中, 但真的就是懶!!
      而且原本是的寬度很寬,是適用在寬LCD的.
      要不是因為後來你們在論壇上,希望我分享出來,我還真的很懶的修正錯位等等問題…哈…還是懶~~
      也因為這樣,讓我有去修正的動力.
      至少現在看到你說的那個置中三欄,做的不錯~!
      雖然我還沒去研究他的CSS怎麼寫,但我覺得是很好的,應該很適合大部份的人.

      對了小江是誰?

    2. 傑尼斯 說道:

      RICKY你在論壇上看到的小江三欄主題
      小江他有傳給我用!
      這是我國外一個備份部落格目前就用這個模板
      [url=http://janis.net78.net/]http://janis.net78.net/[/url]
      我傳給你去測試改良,希望你可以改得更好看一點!
      [url=http://janis.tw/TJinnStyle.rar]http://janis.tw/TJinnStyle.rar[/url]

    3. 傑尼斯 說道:

      RICKY

      小江=white
      就是論壇常見的那位版主。
      雖然那個三欄也是不錯!
      可是我比較喜歡你這種主體版型的三欄!
      不管怎樣我就等你心血來潮時
      看能不能在改更好一點!或發表新作品囉!

      ps.剛剛發現!套用你幫我修改的CSS,發現在火狐瀏覽器下,三欄的底下欄位有點位置不對耶!有空再麻煩幫我看一下!感恩喔!

  5. 傑尼斯 說道:

    RICKY先謝謝你願花時間幫我修改CSS!

    我對CSS修改真的沒什麼概念!

    所以就依照你的設計理念來改吧!
    我之前的設想的第三欄排列順序請你做參考就好!
    請你不一定照做!因為我不懂三欄的設計理念拉!那只是我的期望,
    期望與現實是有差距的
    這個道理我是懂得的!

    我希望第二欄不要那麼多那麼長就好,
    RICKY我尊重你的專業啦!
    你就參考我的網站
    再看你大概可以再修改的部分再改看看,
    能改就改。有時間再改吧!
    再次謝謝您喔!辛苦你了![razz]

    1. ricky 說道:

      OKOK~今天去騎車太晚回來了,六日這二天找個時間幫你改一下^^

  6. 傑尼斯 說道:

    RICKY我部落格已換成你作的主題佈景了!
    請幫我看看!我只是換掉一張圖片而已!其他就都照你的設定!

    如果您有不錯的建議或要修改
    請再多給我意見!謝謝你!

    1. ricky 說道:

      哇!合成自己的照片…小折耶…..哈~
      我的是美利達登山車~~
      不過最近也有換小折的念頭="=
      …但….沒…..錢…….小折都貴!!

      如果你自己會修改, 可以把上面的連結列加底色, 這樣可以突顯連結列
      你右邊的第三欄, 模塊可以調一下, 如blog上的使用說明
      調整typography.css即可, 也可以把第二欄的東西移到第三欄~!
      因為你有用廣告, 可以把第三欄做為廣告欄~~

      你那裡還是不能留言>_<

    2. 傑尼斯 說道:

      RICKY我對這第三欄的css說明不是很清楚也不在行耶![img]http://wabis.biz/up0015/200907310027291630077660.gif[/img]
      在你有空時可不可以麻煩你幫我調一下!
      你幫我調一次
      再來我應該就會了!(我應該就可以從typography學會怎調了)
      拜託幫忙一下啦![img]http://wabis.biz/up0015/200907310029502360045002.gif[/img]
      我的第三欄(最右邊那一欄)順序希望依次是
      1.用戶面板(userPanel)
      2最新網誌
      3.最新評論
      4.熱門網誌
      5.隨機網誌
      6.交換連結
      7.統計
      8.myplurk
      9.串聯貼紙
      10.blog-orbit
      11.blogupp
      12.webmaster

      [url]http://wabis.biz/up0015/200907310005472251314041.jpg[/url]

      麻煩您啦!謝謝您喔!
      [img]http://wabis.biz/up0015/200907310028459118644394.gif[/img]

    3. ricky 說道:

      哈囉傑尼斯
      先跟您說明一下第三欄其實是很笨的東西,因為使用絕對定位,所以會有一個問題產生
      就是模組模塊必需是固定的,也就是說長度(高度),必需固定!
      不適用在會增加長度的模塊,像是好友連結等等.
      除非你想要每次都去修改CSS.
      不知道你聽懂不懂意思,像是你的最新留言,評論,文章等,如果你在後台設定好前台顯示為10例,那就建議您設好就好,不要修改,因為只要你修改一次, 就必需要重新調整次CSS, 像是好友連結等,只有你有新增連結,模塊就會往下變長跑出一個新的連結,這樣你的第三欄也會跑掉, 需要在調整CSS!!
      所以就是說, 第三欄請放"固定"高度的模塊.

      如果了解了,你在跟我說一次順序!
      還有, 我只能幫用把模組貼到CSS語法裡去,無法幫你設"位置",因為有些模組我並沒有安裝,有些有的模組設定也跟你不同,無法幫你定位好確定的位置,到時還是您要自己一個一個調整,這是比較麻煩的地方(三欄用法)

      所以未來的F2真正三欄, 還是要有會比較好!!

      [color=blue]奇怪!! 你的blog還是不能留言,連評論也不行!![/color]

  7. white 說道:

    RICKY大人愛死你了,抓回家用了,感謝感謝…

  8. 傑尼斯 說道:

    三欄主題佈景我將用在另一個部落並花時間研究!
    如問題較少時再用在現在的部落格!

    RICKY幸好有你跟我說,
    不然我還不知道這幾天為何都沒人留言!
    原來升級部落格新版這麼多問題!

  9. 傑尼斯 說道:

    謝謝RICKY 分享這主題模板!
    我已經裝了!
    但…我不會做FLASH…(殘念)
    裝了後flsh模板後
    上面變空白![img]http://sfun.idv.tw/images/avatars/3.gif[/img]

    1. ricky 說道:

      使用flash記得修改模版flash資料夾內的blogtitle.htm, 如使用說明.

    2. ricky 說道:

      你的blog無法留言!!

      發現你使用時連結列有走位現像, 不知道跟你的廣告欄有沒有關係
      你試著把blog描述欄輸入文字看看.

      我發現你有提供使用者能自由選擇轉換面版的功能
      建議不要用此三欄, 因為現在的三欄是用自定義模組絕對位置來達成的
      所以如果沒設定好, 變來變去是會亂掉的!!