---
title: Blog
description: Bir blog yazısının ayrıntılı olarak okunduğu blog sayfası component'i.
---

<Callout type="warn" title="Eski altyapı">
Bu sayfa, ikas Studio öncesindeki headless tema altyapısını anlatır. Yeni temalar için [ikas Studio](https://builders.ikas.com/docs/ikas-studio) dokümantasyonunu kullanın.
</Callout>

Blog sayfası, bir blog yazısının ayrıntılı olarak okunduğu sayfadır. Yazı oluşturulurken girilen içerik, yazar, tarih, kategori gibi tüm bilgiler burada gösterilebilir.

Kaynak kodun tamamına [buradan](https://github.com/ikascom/ikas-examples/tree/main/ikas-theme/src/components/page-blog) ulaşabilirsiniz.

Oluşturulan type şu şekildedir:

```tsx title="src/components/__generated__/types.ts"
export type PageBlogsProps = {
    blog: IkasBlog;
  ...
};
```

Blog component'imiz şu şekilde görünüyor:

![Örnek temadaki blog yazısı sayfası](https://builders.ikas.com/media/ikas-dev/example-theme-blog-f40c1c611a5517abba076484cd05b622.jpg)

<Callout type="info" title="Blog içeriği HTML olarak gelir">
Blog yazısının içeriği, blog editöründe **Rich Text** olarak kaydedilir. Bu nedenle size gelen veri bir HTML metnidir. Blog içeriğini render etmek için [dangerouslySetInnerHTML](https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml) prop'unu kullanıyoruz.
</Callout>
