• 關於林人青
  • 聯絡林人青
林人青 ReOpen
生活分享 / 隨心經營 [email protected]
  • 首頁
  • 小日常
    • 瘋吃喝
    • 愛漂亮
    • 顧健康
  • 求新知
    • 數位學習
    • 冷熱知識
  • 假文青
    • 正經話
    • 隨意聊
  • 視聽室
    • 電影戀
    • 小電台
  • 女子遊
    • 閒晃誌
    • 旅行誌
數位學習求新知

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

by 林人青 2022-03-08
written by 林人青 2022-03-08
2.7K

文章最後更新於 2023 年 7 月 5 日

林人青 ReOpen > 求新知 > 數位學習 > WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

%E5%9C%961%E6%83%85%E5%A2%83%E4%B8%BB%E5%9C%96 3

Favicon網站小圖示更換,大概是架站容易忽略的小細節之一,看似小小的icon圖示,想不到學問也有點多,不過因為是採用Soledad佈景主題,進入外觀/自訂當中上傳檔案即可,也算是蠻方便的。和我一樣使用Soledad佈景主題(或者佈景主題都一樣吧?)直接點擊目錄看設定位置吧~

學習WordPress架站推薦購入網站帶路姬所著「用WordPress打造賺錢副業」

博客來 ︱ 金石堂︱ momo ︱ 誠品線上 ︱ 誠品蝦皮

∣ 購買soledad佈景主題 ∣

∣ 更多WordPress佈景主題 ∣

➡ 我從Bluehost搬家到Cloudways

➡ 購買最多人推薦的Cloudways主機服務

最多人推薦的主機服務商Cloudways

內容目錄
  1. Favicon網站小圖示是什麼?
  2. Favicon圖示轉換/產生器
  3. 如何加裝Favicon網站小圖示?
  4. Soledad佈景主題Favicon設定位置
  5. 結語

Favicon網站小圖示是什麼?

Favicon是個縮寫,引述維基百科說法:

Favicon是favorites icon的縮寫,亦被稱為website icon、page icon或urlicon。

Favicon是與某個網站或網頁相關聯的圖示。網站設計者可以多種方式建立這種圖示,而目前也有很多網頁瀏覽器支援此功能。

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

就是位在瀏覽器分頁、網址上方的小圖示,做得清楚得化識別度還蠻高的,像是FB、IG、YT,如果沒換就是WP原本的logo,換上自己的小icon之後專屬感倍增。

Favicon圖示轉換/產生器

按照Google的規範和語法,又是一長篇敘述,不過可以得知圖示就是要正方形,且邊長為 48 像素的倍數,例如 48 x 48 像素、96 x 96 像素、144 x 144 像素等等,如為 SVG 檔案則不限定尺寸。

同時要轉換為ico格式的圖片。

➡ 看Google說明

網站的圖示我覺得比起logo難設計,因為實在太小了,又要簡潔明瞭,甚至要去背才好看,不然設計繁複也看不出來是什麼,不想在這上面琢磨太多,所以就使用免費的圖示產生器。

想購買或採用免費版自行設計也有線上icon服務可參考

➡ flaticon

順便安利一下,這家flaticon的icon服務系出freepik圖庫,也有簡報模板,無論圖庫/簡報模板/icon都有免費和付費版本,質感都很好!

∣ 延伸閱讀 ∣

➡ 圖庫推薦∣論圖庫購買之必要和分享6個商用圖庫(付費/半免費/完全免費)∣shutterstock /Alamy /yayimages /freepik /xframe/ pexels

➡ 模板推薦∣論購買簡報模板之必要:推薦超強的envato market(Google/Keynote/ PowerPoint)和5個免費/半免費簡報模板網站

favicon.io是受到多數網友好評推薦的線上產生/轉換器,文字/圖檔/表情符號都支援,有設計好的圖案就上傳轉換為ico格式。

➡ 前往favicon.io

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

我個人選擇用文字製作就好,林人青 LinRenChing,就簡單以L製作。

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

除了檔案可下載,下方也有link標籤可複製

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

∣ 購買soledad佈景主題 ∣

∣ 更多WordPress佈景主題 ∣

➡ 我從Bluehost搬家到Cloudways

➡ 購買最多人推薦的Cloudways主機服務

最多人推薦的主機服務商Cloudways

如何加裝Favicon網站小圖示?

方法有2,一是放在根目錄、一是以link標籤在head塞入程式碼。

對我而言都很複雜,因為先前塞過一些標籤驗證似乎都不成功,新手沒事不想也不敢亂碰這些。

以下文章可參考,WordPress也有外掛可使用。

如何給網站設置favicon.ico圖標

有簡單解說和方法介紹

『教學』怎麼自訂網站、部落格的Favicon小圖示?設定語法分享(Html)

不同平台設定方式解說

WordPress 設定網頁logo小圖示超簡單,4步驟就搞定! – Favicon外掛教學

萬事有外掛

Soledad佈景主題Favicon設定位置

使用Soledad佈景主題的路徑如下:

到WP後台 > 外觀 > 自訂

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

進入自訂編輯畫面後,

選擇General > General Settings

就會看到Upload Favicon選項,上傳圖片下方可微調圖示形狀,確認之後發布更新即可。

WP架站新手歷程分享∣更換網站Soledad佈景主題Favicon網站小圖示

網路上有好心網友提供影片,也可參考

結語

架站之後一直忘記更換圖示,好像就自動抓網站logo的樣子,但logo對於瀏覽器分頁的位置來說,實在有夠模糊,更換之後自己覺得清爽多了(雖然也只是用產生器載一張圖),變成之後看其他網站也會注意Favicon的部分,覺得這部分設計也算less is more的範例,真是一件重要的小事啊。

不過安裝或是初步操作使用強烈建議要看教學,不然像我一開始搞不清楚子母主題,光安裝就花費很多時間,很推薦 網站帶路姬 的教學!真的是手把手交操作不容易出錯。

➡ WordPress Soledad:如何安裝 Soledad 佈景主題?

∣ 購買soledad佈景主題 ∣

∣ 更多WordPress佈景主題 ∣

➡ 我從Bluehost搬家到Cloudways

➡ 購買最多人推薦的Cloudways主機服務

最多人推薦的主機服務商Cloudways

∣ 延伸閱讀 ∣ 對架站分享文有興趣的話

➡ WP架站新手歷程分享

∣ 延伸推薦 ∣

我架站是跟著網站帶路姬學習的,零學費超佛心!非常適合新手

➡ WordPress 跟著帶路姬,架站簡單的像個奇蹟!

學習WordPress架站推薦購入網站帶路姬所著「用WordPress打造賺錢副業」

博客來 ︱ 金石堂︱ momo ︱ 誠品線上 ︱ 誠品蝦皮

香港的朋友對網頁設計、WP有興趣可以參考鬍子科技學院~ 🙂

➡ 鬍子科技學院網站

➡ 鬍子Jack Youtube

不過還是看個人習慣,想要進階或是多參考,幾個線上課程平台也都有推出類似課程,參考如下

∣ Hahow 好學校 / 網站架設 ∣

∣ PressPlay Academy / 程式設計 ∣

∣ Udemy / WordPress課程 ∣

∣ YOTTA / 網頁設計課程 ∣ (包含梅干桑的WordPress課程)

∣ 窩課360 / 網頁設計 ∣ (較專業進階)

∣ 六角學院 / 網頁設計 ∣ (較專業進階)

感謝閱覽!若您願意額外點讚鼓勵(至多5讚),那就真的太圓滿了~ 😉

∣ Google ∣ FB ∣ Twitter ∣ APPLE ID ∣ 皆可登入/註冊

相關文章

FaviconFavicon網站小圖示Soledad佈景主題WP架站新手歷程分享
林人青

中年女子,媒體工作者。 對於世界依舊充滿好奇心,將每一日生活當作奇蹟! 感謝茫茫網海中,前來閱讀的你/妳,祝福日日美好。 ✉[email protected]

其他人也看

韓文自學∣推薦台灣媳婦趙叡珍老師教材「韓...

2022-03-27

隨手拍照上傳EyeEm賺錢!作品輕鬆上G...

2021-03-14

關於Line備份需知的3件事和1個解決方...

2021-09-22

開箱評價∣手機穩定器「大疆 DJI OM...

2022-04-09

讀書心得∣經營自媒體必買!推薦網站帶路姬...

2023-07-04

裝了外掛LikeCoin button讚...

2022-04-10

行動支付比較∣哪一種pay最好用?超商/...

2022-03-07

虛擬貨幣購買∣投資新手超淺白的Max交易...

2021-10-27

線上工具推薦∣安裝chrome的「4cU...

2022-09-04

線上剪輯工具推薦|FlexClip提供海...

2021-12-25

Let's talk about ...取消回覆

關於我

關於我

林人青

Blogger∣中年女子∣媒體工作者
對世界依舊充滿好奇
將每日生活當作奇蹟
✉邀約聯繫:[email protected]

最新文章

  • 開箱評價∣Check2Check超微電雙波冷熱逆光機,類醫美居家美容儀再進化!

    2023-09-24
  • 人生百態︱閒聊幹話你當真,莫怪職場無法優雅轉身

    2023-09-11
  • 弦外之音∣楊德昌回顧展:北美館再見經典一一重構(A One and A Two: Edward Yang Retrospective)

    2023-09-03

熱門文章

  • 1

    大阪景點推薦∣女孩們尖叫吧!淡路島Hello Kitty Smile給妳滿滿的哈囉凱蒂!

    2022-05-20
  • 2

    開箱評價∣許維恩代言/check2check星紗機到底好不好用?防疫期間居家SPA!

    2021-09-21
  • 3

    【牙齒隱形矯正分享】使用3年EBA透明牙套優缺點與心得

    2021-03-30

我的FB

我的FB

我的IG

linrenching

閒晃/觀影/假文青 購物/推坑/聊3C

錯與對,是與非,去面對。
愛是付出,珍惜是幸福。
#julia #王力宏演唱會 #王力宏2023小巨蛋演唱會 #王力宏20230909
四面環海之島妳說缺海鮮?🤔 We don’ 四面環海之島妳說缺海鮮?🤔
We don’t sail boats, we land on them
#by網友吐槽精選 #圖文不符 #還是其實圖文相符
捍衛戰士9/16起全台戲院1+2連映,首集4K數位修復版眾多盛世美顏還不看爆?
➡4DX體驗心得
https://linrenching.net/9129
➡IMAX觀感1+2集細節感想
https://linrenching.net/9129
➡TOP GUN 續集心得
https://linrenching.net/8870
➡TOP GUN 首集回顧
https://linrenching.net/8272
北美館再見楊德昌。 #一一重構楊德昌 北美館再見楊德昌。
#一一重構楊德昌回顧展
#活得好好的想這麼多幹嘛
#矛盾與悲哀但還是一部喜劇電影
弦外之音感想文
https://linrenching.net/10885
看了一個寂寞 🍷😑
#寂寞博物館
#寂寞博物館音樂劇 
#企業客製化包場橋段演出30萬專案價😎
載入更多... 在 Instagram 上追蹤




文章分類

參觀人氣

今日瀏覽次數:_
總瀏覽次數:_

LinRenChing

公益|線上捐款助自閉症




箱根泡湯推薦「季之湯雪月花」溫泉旅館

去日旅遊JR Pass鐵路通票買起來超方便!

喜歡的隱眼美曈就在imeime一次購足

  • Facebook
  • Instagram
  • Youtube
  • Email
  • 隱私權政策
  • 免責聲明

@2023 - All Right Reserved. Designed and Developed by 林人青


回到頁首
林人青 ReOpen
  • 首頁
  • 小日常
    • 瘋吃喝
    • 愛漂亮
    • 顧健康
  • 求新知
    • 數位學習
    • 冷熱知識
  • 假文青
    • 正經話
    • 隨意聊
  • 視聽室
    • 電影戀
    • 小電台
  • 女子遊
    • 閒晃誌
    • 旅行誌
Scroll Up
  • →
  • 林人青@IG
  • 林人青@FB