最新文章

本日人氣:99999
累積人氣:999999

產業新聞

本日嚴選

Youtube

0002

最近部落格的朋友紛紛詢問該怎麼於部落格中使用廣告輪播,所以.....就來個"超簡單"教學吧!因為真的很簡單啦!往下看先....


  


 

想要隨時知道有那些新奇好物與特價嗎?快案個讚加入我的粉絲團唷 ^^ 喜歡我分享的文章嗎?歡迎給我的粉絲團一個讚鼓勵一下唷 ^^

一、請先下載底下這一串輪播程式碼

下載的連結請點這裡:點我下載,快點我下載 ^^

二、打開連結之後,會出現程式碼!

請用您的鼠兒將它們全部複製即可!更懶惰一點的作法,則是點右上角的下載,將文件直接打包到電腦中....

0008

三、要編輯什麼呢?

原則上有兩個!

1、顯示的圖片尺寸(像素大小)

2.要「輪播的照片」以及「對應的網址」....

0005

這個地方有一點"苦工",就辛苦的剪剪貼貼吧!(你應該也不會常常更換吧,這裡要貼的應該是一些強打的主題,而不是每一篇文章都要輪播)

輪播的圖片,建議不要太多

真的不要太貪心!輪播圖片的數量控制在 5~7 則比較剛好,要再多也可以啦,就是不斷的把上面那一行網址重複進行複製即可!

最多可以到 26 個,超過的話版面就會跑掉!(不過還是建議控制在 10 個以內,不然數量太多也很拖累網頁瀏覽速度) ^^

改好之後呢?放到你的部落格上吧!

下面以「痞客邦」為例 (其他部落格平台,也是將程式碼插入區塊即可)。

程式碼要放在哪裡呢?就....就......就放在你想呈現的位置咩(這完全是廢話),像小旭是放在「內容欄」的"公告板塊"中,這樣就會秀在我的版面上方,而且"每篇文章"上面都可以看到這個輪播!

要放那裡,真的隨便您,你想把要輪播的圖片做一個小正方形圖片,然後插在左邊或右邊的側欄,這樣也是可以的呀 (創意隨人發揮) ^^

0001

找到要放的欄位之後,將剛剛編輯好的程式碼,直接複製貼入就可以存檔收工了!

0003

最後,要提醒您的是,要輪播的圖片請注意"圖片尺寸"的問題,也就是圖片的像素!

圖片的尺寸盡量符合您的版面,以免破圖或是圖片擠壓變形,甚至連出現都不會出現!

等不及要試試看了嗎?

注意!

如果您有使用「圖片延遲」的話,輪播圖片將會"不定時"不出現.....

這必須關閉痞客邦的圖片延遲的功能才能解決!而這是圖片延遲所造成的影響,就看您要留輪播還是要留圖片延遲了!可惡,張飛跟岳飛難道就不能在一起嗎?(丟筆)

資料與程式碼作者來源:

男丁格爾's 脫殼玩

如果您覺得這一篇文章對您有幫助,可否為我按個讚或加入 ifans 粉絲團呢 ^^

加入 ifans 的 Google+ 專頁

 

文末叮嚀:

1.如果您喜歡這篇文章,歡迎按按右上角的""或"分享"唷 ^^ 
2.本文章屬本站著作權,可用網址分享轉貼,但嚴禁整篇盜取或全文轉載。
3.順手回應留言,也算是給我一點小小的動力與互動,非常感謝您! ^^

林小旭 發表在 痞客邦 PIXNET 留言(15) 人氣()


留言列表 (15)

發表留言
  • bigsishead
  • 謝謝您提供的教學文^^
  • bigsishead
  • 您好,想請教一下我照您的方法修改了部分語法,最後用800*300的大小,不過不知道為什麼窗格上方及左邊會有一部分是空白的,跳第二張時,則會有第一張遺留下的照片邊邊,我不知道哪邊可以調整,可以麻煩您教教我嗎?謝謝^^
    http://www.bigsishead.com/
  • jason
  • 感謝大大分享!!好實用!
  • Amanda
  • 太棒了,感謝分享,已經成功安裝。
    不過右邊空白還不曉得該怎麼填補上。
  • Leona
  • 好實用,晚上來試試~~
  • 訪客
  • 網址失聯
  • W親子館
  • 非常好的教學,晚上回家趕快試試
  • goldrain720127
  • 分享都好實用喔!我去試試!