2.1 KiB
+++ title = "Post Images" description = "menambahkan gambar ke postingan tanpa menyentuh editor gambar." categories = ["experience"] tags = ["performance", "imaging", "graphics", "posts"] feature = ["code highlighter", "snippets", "related content"] copyright owner = "Josh Habdas" date = "2019" license = "agpl-3.0-or-later" +++
Tambahkan daya tarik visual ke postingan anda dengan memposting gambar. Gambar postingan muncul diatas konten postingan dan pengaruh {{< external href="https://gohugo.io/content-management/image-processing/" text="Hugo Image Processing" />}} dan Lazy Loading untuk menyediakan gambar yang sepenuhnya otomatis dan lazy-loaded LQIP dan arah seni bawaan.
{{< figure src="https://source.unsplash.com/Y-w15LfHO8w/1200x900" lqipsrc="https://source.unsplash.com/Y-w15LfHO8w/800x600" caption="Be Creative. Photo:" attr="AK¥N Cakiner on Unsplash" attrlink="https://unsplash.com/@akin"
}}
Menggunakan gambar postingan memerlukan beberapa pendapat terkait dengan struktur konten anda. Untuk membuat postingan dengan gambar posting anda harus:
- Gabungkan gambar dan konten dalam direktori seperti yang ditunjukan di bawah ini.
- Perbarui postingan {{< external href="https://gohugo.io/content-management/front-matter/" text="Front Matter" />}} seperti yang dijelaskan dibawah ini.
Contoh bundel halaman mungkin akan terlihat seperti berikut ini:
├── archetypes
├── content
│ └── post
│ └── secure-your-digital-life
│ ├── images
│ │ └── florian-klauer-119557-unsplash.jpg
│ └── index.md
├── layouts
Dengan gambar header yang ditunjukkan di index.md:
[[resources]]
src = "images/*119557*"
name = "header"
{{% hackcss-alert type="info" %}}Tip: Orientasi tidak signifikan. Untuk tampilan optimal gunakan gambar yang lebih besar.{{% /hackcss-alert %}}
Itu dia! After Dark melakukan hal selebihnya.
Untuk membantu memahami bundel, lihat {{< external href="https://gohugo.io/content-management/page-bundles/" text="Page Bundles in Hugo" />}}.