如果想要隱藏課程網站中的任何元素,例如「圖片、文字、按鈕、影片」等等的話,也可以透過一些語法的設定,就可以依照需求將元件隱藏起來
那要如何執行呢?讓我們繼續看下去
備註:為了同步教學,以下環境是使用 Google Chrome 做設定
Step1、在隱藏的元素或工具上按右鍵
以下範例是希望隱藏課程頁面中的購買按鈕,所以在按鈕上面按下「滑鼠右鍵」,並且點擊「檢查」
Step2、尋找按鈕語法
接著會看到瀏覽器跳出一個視窗,一開始有可能在右方,或是在下方,都不會影響操作
如果你有正確的在按鈕上按下右鍵的話,程式碼應該會直接反白到目標的位置上,然後我們往上找到第一個有<DIV > 包起來的程式碼,並且點選他
Step3、複製語法
點到第一個<div> 包起來的語法之後,在右邊就會看到這個網站元素的樣式設定,
我們可以在 { 之後,先加上隱藏的程式碼 「display:none!important;」 來試試看是否會隱藏
如果有正確隱藏的話,那表示選擇的網站元素是正確的,那可以將語法全部選取,並且按下滑鼠右鍵複製
Step4、回到後台新增程式語言
接著我們回到網站後台,點選「新增語法」→「所有程式」→點選「新增程式語言」按鈕,開始新增我們的程式
Step5、貼上程式語法
接著我們在最下方的「程式碼」區塊中,輸入完整的語法,是一段由 <style type=”text/css”> 及 </style>包起來的語法
<style type="text/css">/*這段一定要複製*/
/*下面的語法貼上剛複製的*/
.tutor-lead-info-btn-group{
display:none!important;
}
</style> /*這段一定要複製*/
我們只要將剛在複製的程式碼貼到中間就可以了
例如 .tutor-lead-info-btn-group{ 的地方,並且加上 display:none!important;
最後按下「儲存」按鈕就可以囉,最後再回到網站中去確認一下要隱藏的網站元素是否都有正確隱藏了