Featured image of post Cara Mengatur Twitter Card di PaperMod

Cara Mengatur Twitter Card di PaperMod

Pendahuluan

Tema PaperMod mendukung Twitter Card. Namun, pengaturan Twitter Card harus ditulis dalam config.toml atau di informasi header *.md pada setiap artikel. Jika diatur di artikel maupun di config.toml, informasi header dari setiap artikel akan diprioritaskan.

Cara Pengaturan

config.toml

Di config.toml, tambahkan item bernama images di bawah [params]. Di images, tulis path ke gambar yang akan ditampilkan di Twitter Card. Jika Anda menempatkan gambar di folder static, Anda hanya perlu menentukan nama filenya saja.

1
2
[params]
  images = ["twitter_card.jpg"]

Struktur folder

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
root
│  config.toml (Tulis di sini)
├─content
│  └─posts
│      └─folder artikel
│         │  index.md (Tulis di sini)
│         └─images
│             cover.png (Tempatkan di sini)
└─static
    twitter_card.jpg (Tempatkan di sini)

Informasi header setiap artikel

Di informasi header setiap artikel, tambahkan item bernama image di bawah cover. Jika Anda mengatur relative menjadi true, Anda dapat menentukannya dengan path relatif dari *.md artikel tersebut.

1
2
3
cover:
  image: "images/cover.jpg"
  relative: true

Jika Anda tidak ingin menampilkannya di bagian atas artikel

Jika Anda tidak ingin menampilkan gambar sampul di bagian atas artikel, tambahkan item bernama hidden di bawah cover dan atur menjadi true.

1
2
3
4
cover:
  image: "images/cover.jpg"
  relative: true
  hidden: true

Tentang Ukuran Gambar

Berdasarkan spesifikasi PaperMod saat ini, ukuran Twitter Card tampaknya hanya mendukung summary_large_image. Ukuran yang tepat (resolusi) untuk summary_large_image bervariasi, namun sekitar 800 x 418 (rasio gambar 1.91:1) tampaknya sudah baik.

Situs referensi 1 Situs referensi 2

Jika memungkinkan, kami sarankan mengubah ukuran gambar sebelum mempublikasikannya.

Cara memeriksa pengaturan

Untuk memeriksa pengaturan Twitter Card, gunakan Twitter Card Validator. Namun, di lingkungan saya, pratinjau tidak ditampilkan dengan benar, jadi jika pratinjau tidak muncul, kami sarankan untuk memeriksanya sekali sebelum mempublikasikannya dengan menggunakan akun privat atau sejenisnya.

comments powered by Disqus
Dibangun dengan Hugo
Tema Stack dirancang oleh Jimmy