馬上加入Android 台灣中文網,立即免費下載應用遊戲。
您需要 登錄 才可以下載或查看,沒有帳號?註冊
x
[color=var(--ast-global-color-2)][size=2.625]原文網址:https://pse.is/510208site導言網路上有許多教學網站,都帶有外連網址的安全檢測,510208我一度也想做做看,但網路上怎麼也找不到教學,連老舊的版本都沒有!於是我靠自己摸索,成功找到了方法!以下是簡單教學,希望可以讓更多站長們放更多廣告(痾不對,是寫更多好文章/ 在那之前先試試看水溫點擊底下連結看看我自己的版本怎麼樣?
Tips!按鈕部分時候會造成小Bug開始!請定位到以下Github儲存庫 [color=var(--ast-global-color-5)][backcolor=var(--ast-global-color-2)] GitHub儲存庫位址
將所有檔案下載下來,這些檔案會形成以下樣式: 上面會出現調用網站檢查函數失敗或無有效參數,請開發者檢查網站軟體狀況只是因為你沒給他網頁參數,把網址改為以下樣式試試看: [size=0.875]<檔案路徑>?url=https://google.com
你將會看到這樣子: 這樣就成功了,你如果有問題載不了這個檔案,也可以製作以下的代碼貼上: [size=0.875]<!DOCTYPE html><html> <head> <title>外部網站安全檢查</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="style.css"> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-- 檢查使用者索引的網站網址 --> <!-- 調用VT API --> <script> $(document).ready(function() { var url = getParameterByName('url'); if (url) { url = normalizeURL(url); $('#site-url').text(url); $('#confirm-button').attr('href', url); } else { $('#site-url').text('調用網站檢查函數失敗或無有效參數,請開發者檢查網站軟體狀況'); $('#confirm-button').attr('href', 'about:blank'); } $('#confirm-button').on('click', function() { window.location.href = url; }); // 其他程式碼... function getParameterByName(name, url) { if (!url) url = window.location.href; name = name.replace(/[\[\]]/g, '\\$&'); var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'), results = regex.exec(url); if (!results) return null; if (!results[2]) return ''; return decodeURIComponent(results[2].replace(/\+/g, ' ')); } function normalizeURL(url) { if (!/^https?:\/\//i.test(url)) { url = "http://" + url; } return url; } }); </script> </head> <body> <div class="containerSelf"> <div class="content"> <img src="image/logo.svg" width="200px" height="200px"> <h1>您即將訪問以下網站</h1> <p> </p> <p id="site-url">調用網站檢查函數失敗或無有效參數,請開發者檢查網站軟體狀況</p> <p> </p> <button id="confirm-button">確認前往</button> </div> </div> <div class="footer"> <p>© 2023 510208 PenguinBrother. All rights reserved.</p> <a href="https://storyset.com/online">Online illustrations by Storyset</a> </div> </body> </html>
將以上檔案存成index.html檔案,底下這個是style.css的內容 [size=0.875]@font-face { font-family: YaheiConsola; src: url('/font/font.ttf') format('truetype'), url('/font/font.woff') format('woff'), url('/font/font.woff2') format('woff2'); /* 添加其他字型格式,以支援不同的瀏覽器 */}body { font-family: YaheiConsola, 'Courier New', monospace; margin: 0; padding: 0;}h1, h2, p { text-align: center;}.warning { color: red; font-weight: bold;}p#site-url { background-color: #636363; padding: 10px; margin: 0; text-align: center; padding-bottom: 10px; width: 80%; margin-left: auto; margin-right: auto;}h1 { text-align: center;}button { display: block; margin: 0 auto; padding: 10px 20px; font-size: 16px; border: none; border-radius: 4px; background-color: #005813; color: #fff; cursor: pointer;}button:hover { background-color: #1c4b00;}body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: rgb(9, 56, 0); font-family: YaheiConsola, 'Courier New', monospace;}.containerSelf { display: flex; align-items: center; justify-content: center; height: 100vh; width: 90%; margin: 0 auto;}.content { width: 80%; text-align: center; color: lightgray;}h1, p, button { text-align: center;}h1, p { margin: 0;}button { margin-top: 20px; padding: 10px 20px; font-size: 16px; border: none; border-radius: 4px; background-color: #134200; color: #fff; cursor: pointer;}button:hover { background-color: #004216;}.footer { position: fixed; bottom: 0; left: 0; width: 100%; background-color: #333333; color: #ffffff; text-align: center; padding: 20px; z-index: 9999; /* 確保頁尾在最上層 */}.footer p { margin: 0;}a { color: #6699cc; /* 調整顏色值為您想要的淺,如果你這麼自 }@keyframes flashing { 0% { color: red; } 50% { color: transparent; } 100% { color: red; }}.flashing { animation: flashing 1s infinite;}
很好,再來請將它傳進自己的網站空間裡即可,注意不要修改footer中的內容,那是我的版權聲明,我有規定囉! Tips!記得在根目錄下image資料夾放入一個logo.svg來代替原本的圖片檔,如果你這麼做,就可以把底下<a href="https://storyset.com/online">Online illustrations by Storyset</a>這行刪掉啦!Tips!如果要用Noto Sans TC(這個網站的字體)當頁面字體的話,記得在根目錄底下font資料夾放入以下三個檔案:font.ttf、font.woff、font.woff2這三個檔案在Github頁面裡面有,網址上面有給。傳到GITHUB PAGES空間中註冊好了以後,建立一個新的repo,設定如下: 再來會出現Upload Files點下去 然後把剛剛的檔案扔上去,最後按下Commit Changes即可(一直忘記截圖XD) 啟用GITHUB PAGES之後再等一陣子,就可以直接存取了,網址如下: [size=0.875]https://<username>.github.io/<repo name>
- <username>:帳號名稱(我是510208)
- <repo name>:儲存庫名稱(我是safecheck)
- 因此,我就是:https://510208.github.io/safecheck
WORDPRESS網站配置先切到這: [size=0.875]/* * 設定外連網址自動編輯 */function modify_button_link($block, $editor_block_type) { if ($editor_block_type->name === 'core/button') { $block['url'] = 'https://510208.github.io/safecheck/index.html?url=' . $block['url']; } return $block;}add_filter('block_editor_block_edit', 'modify_button_link', 10, 2);function replace_external_urls_with_custom_format($content) { $pattern = '/(<a\s+[^>]*href=[\'"])(https?:\/\/[^\s"\']+)/i'; $replacement = '$1https://510208.github.io/safecheck/index.html?url=$2'; $content = preg_replace($pattern, $replacement, $content); return $content;}add_filter('the_content', 'replace_external_urls_with_custom_format');add_filter('widget_text_content', 'replace_external_urls_with_custom_format');
Alert!貼在最下面!!Alert!底下記得按下儲存設定喔!!結語完成,我也不知道寫啥好,掰掰
|

|