SVG Favicon

Hiasi situs anda dengan favicon SVG yang unik.

After Dark dikirimkan dengan 169B yang dioptimalkan1 SVG favicon tertanam di setiap halaman:

Perluas untuk melihat kode 
{{/*
Copyright (C) 2019  VHS <vhsdev@tutanota.com>

This file is part of After Dark.

After Dark is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

After Dark is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with this program.  If not, see <https://www.gnu.org/licenses/>.
*/ -}}

<link rel="icon" sizes="any" href="data:image/svg+xml,%3Csvg%20viewBox='0%200%2046%2045'%20xmlns='http://www.w3.org/2000/svg'%3E%3Ctitle%3EAfter%20Dark%3C/title%3E%3Cpath%20d='M.708%2045L23%20.416%2045.292%2045H.708zM35%2038L23%2019%2011%2038h24z'%20fill='%23000'/%3E%3C/svg%3E">
Catatan: HTML (Go) Komentar template yang dilucuti selama generasi situs.

Favicon adalah segitiga miring berwarna hitam dalam bentuk tepee seperti yang ditunjukkan2 di Bantuan Online Overview. Pusat segitiga menggunakan ruang negatif untuk memberikan ilusi segitiga sama sisi kedua dalam bentuk piramida, atau api terbuka, yang terkandung di dalam.

Warna ikon dapat dimodifikasi dengan mengubah atribut fill:

fill="%23f00"
fill="lime"
fill="%2300f"

Sesuaikan darifavicon.html di direktori situs layouts/partials/head:

├── content
├── layouts
│   └── partials
│       └── head
│           └── favicon.html
├── static

Jika file belum ada, salin darii tema default:

$ mkdir -p layouts/partials/head
$ cp themes/after-dark/layouts/partials/head/favicon.html layouts/partials/head

Ganti SVG dengan grafik lain jika diinginkan:

<link rel="icon" sizes="128x128" href="/favicon.png">

Jika mengoptimalkan pengalaman platform lakukan dari dalam favicon.html:

1<meta name="apple-mobile-web-app-capable" content="yes">
2<meta name="apple-mobile-web-app-status-bar-style" content="black">
3<meta name="apple-mobile-web-app-title" content="{{ .Site.Title }}">
4<link rel="apple-touch-icon" href="data:image/png;base64,{{ readFile "static/icon.png" | base64Encode }}">

Lihat H5BP Extend untuk persyaratan khusus platform dan Hugo Documentation untuk bantuan dengan templating fungsi dan variabel.

  1. Lihat Mengoptimalkan SVGs dalam data URIs untuk membantu mengoptimalkan SVGs anda sendiri. ↩︎

  2. Pelajari cara mendaftar animasi SVG dengan SMIL. ↩︎