Posted by : Hank Chan 15 June 2017

前言:Weebly 進階版會使用到一些 Html 和 CSS 的基本技巧。如果你沒有這些網頁的基本背景也沒關係,照著這個文章一步一步做也能達陣。

本文大部份翻自於 <How to Remove Free Weebly Footer and Customize with Links>

想必各位使用過 Weebly 的人都知道,Weebly 免費版雖然方便 ,三分鐘內就能快速架站 (不了解如何三分鐘內架站的人,建議參考我的 Weebly in 3 Minutes 網站)。但也因為免費,網站上每個頁面都有 Weebly 的原生廣告,寫著 "Create a Free Website with Weebly" 或是 "Proudly Powered by Weebly"。這些廣告通常都置放在網站的最底下,以頁腳 (footer) 的形式存在。而你也只能升級你的 Weebly 網站到任何一個付費方案才能擺脫廣告。

Weebly 的頁腳 (footer) 廣告

好消息是,本篇文章將會教你如何擺脫這擾人的 Weebly 廣告。首先,進入到 Theme,然後進到左下角的 "編輯 HTML/CSS"。


接著你會看到這一排 HTML 的程式碼。


我們首先會先針對 landing.html,在跟著這篇文章操作完一次後,你可以如法炮製用一樣的方法在 no-header.html 還有其他 html 模板上。 在這個不是很長的 HTML 程式碼裡,你可以在底端找到負責 Footer 的程式碼。它應該長得像這樣


或是這樣

又或是這樣

但無論你所看到的 Footer 版本是那三樣中的任何一種,他們都是 Weebly 在免費版用戶裡置入他們原生廣告的手段。你只需要將下列第一行的程式碼 style="visibility:hidden" 加入你的 footer div 裡面,如下列第三行程式碼一樣,footer 就會消失了

但有時候這樣的做法會留下後遺症,在有些網頁上消失的 Weebly footer 會被難看的白色背景所取代。如果你想要徹底擺脫 footer 的話,可以在原本的 footer div 裡加上 style="display:none" ,像是這樣:

這樣 footer 就會完整地消失了 Hurray~!

題外話:另外如果你想要自己加上你想要的 footer,可以在 Weebly 本來的 footer 程式碼上面加上以下第一到第七行的程式碼

只要在另外稍微修改一下你要的類別,連結,和年份,就變成你網頁專屬的 footer 囉,如下圖所示~ 


p.s. 但切記不要直接刪除你的 Weebly footer code,之後如果使用付費版本還想要用 Weebly 原生的 footer 功能將會很麻煩

延伸閱讀 <如何使用 Partials 來製作 footer >




Leave a Reply

Subscribe to Posts | Subscribe to Comments

- Copyright © Hank Chan 的所思所想 - Skyblue - Powered by Blogger -