源碼給你,零基礎搭建一個免費的網址導航站


大疫當前,不出去添亂是最起碼的素養,如果再能有所收獲就很完美了

宅在家里就想着把自己之前未完成的想法一個一個都給實現了,也算是給這個漫長的假期一個交代

網址導航便是其中完成的一個,話不多說直接看效果

導航地址:https://nav.ops-coffee.cn,全站自適應兼容移動端

這個導航站匯聚了咖啡君多年的收藏,除了一些耳熟能詳的站點外,還收藏了許多非常有趣的網站,例如:中國妖怪百集,其收藏了大量古人文獻中的妖怪,非常詳細的記錄了各個妖怪的出處,描述甚至圖片等,讓你對中國妖怪文化有一個整體的了解,茶余飯后消遣一下很有意思,類似的網站還有,期待你的探索

導航站的另一個特色是收藏了大量的咖啡君平時用到的非常好用的工具軟件,大部分都是在線的,無需下載安裝,包含了文檔協作、共享,圖片、音頻、視頻處理,格式轉換,文件傳輸,各網站視頻下載等等,兼職就是一個工具百寶箱

如果你覺得網站這些與你的使用習慣不符,或者想添加一些自己收藏的網站,那么源碼給你,只需要簡單的修改就可以變成符合自己使用習慣的獨一無二的導航

如何修改

導航站采用純靜態構建,下載源代碼后只需要修改html文件中的li代碼塊即可,li代碼塊結構如下:

<li>
  <a class="nav-item clearfix" href="https://music.163.com/" target="_blank">
    <div class="nav-img"
      style="margin-bottom:40px;background-image: url(/images/icon/m163.png);">
    </div>
    <div class="nav-name">網易雲音樂</div>
    <p>音樂社區,不止是播放器</p>
  </a>
</li>

僅需修改四個地方,分別對應了網站的四個關鍵信息:

修改https://music.163.com為對應網站的URL地址

修改/images/icon/m163.png為對應網站的Logo地址

修改網易雲音樂為對應網站的名稱

修改音樂社區,不止是播放器為對應網站的描述

如何發布

借助Github Pages即可實現免費發布網站,隨時隨地使用導航,具體方法如下:

新建一個github倉庫,倉庫名稱為xxx.github.io,xxx為你的github用戶名

將已經修改好的導航站代碼上傳至新建的倉庫中,然后你就可以通過xxx.github.io來訪問導航站了

如果不確定訪問的域名可以點擊倉庫的Settings,拉到GitHub Pages段查看

Your Site Published at后邊跟的便是你的域名

當然在這里你也可以綁定自己的域名,例如咖啡君就綁定了nav.ops-coffee.cn,同時可以強制啟用HTTPS協議,無需單獨申請證書,且也不用擔心證書過期問題,這一些Github都幫你做了,並且還是免費的

Github Pages免費好用還穩定,唯一的缺點是訪問稍慢

源碼地址

掃描下方二維碼,關注公眾號,后台回復08,獲取源碼地址

導航站剛剛上線,資源還在持續更新中,如果你有什么酷站推薦或者意見建議歡迎給我留言


掃碼關注公眾號查看更多實用文章

相關文章推薦閱讀:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM