# Damla Okul

> **Dokümantasyon:** Bu projenin belgeleri üç dosyada toplanmıştır; mimari, kurulum veya UI değişikliklerinde ilgili belgeleri birlikte güncelleyin:
> - [README.md](README.md) — Genel bakış, kurulum ve hızlı başlangıç *(bu dosya)*
> - [project.md](project.md) — Teknik mimari ve geliştirme kuralları
> - [design.md](design.md) — Stil, tasarım sistemi ve UI bileşenleri

[damlaokul.com](https://damlaokul.com) — Damla Yayınevi’nin okul yayınları ve eğitim materyallerini tanıtan statik web sitesi.

Yeni Maarif Modeline uygun eğitim setleri, hikaye kitapları ve kataloglar tek bir katalogda sunulur.

## Özellikler

- **Ürün kataloğu** — Sınıf ve tür (Eğitim / Hikaye) bazlı filtreleme, paylaşılabilir hash URL’leri
- **Kitap detay sayfaları** — Kapak, metadata, `#anatemalar` temaları, `kavramlar` (kısa etiket veya özet alıntı), `preview_link` ile önizleme (İncele), `examlink` ile HDS PDF, `damlaurl` doluysa Satın Al / boşsa Bilgi (tedarik popup)
- **Ürün inceleme linkleri** — `/urun-inceleme-linkleri` sayfasında tüm `preview_link` dolu kitaplar; arama, kopyala ve WhatsApp paylaşımı
- **Kataloglar** — Html / PDF katalog görüntüleme
- **Anasayfa slider** — Kampanya ve duyuru görselleri
- **Instagram carousel** — `@okul.damla` hesabının güncel gönderileri (Behold JSON feed)
- **Spotlight arama** — Lunr.js ile kitap araması (`Ctrl+K`); site genelinde `?q=` deep link ve paylaşılabilir arama URL'si
- **Sticky navbar** — Scroll’da kaybolmayan sabit üst menü (mobil + masaüstü)
- **3 sütunlu footer** — Ürünler, önemli bilgiler, iletişim ve sosyal medya
- **Mobil uyumlu** — Bootstrap 5 responsive grid; hamburger menü alt satırda açılır
- **Statik & hızlı** — Jekyll ile önceden derlenmiş HTML, GitHub Pages üzerinde yayın
- **Performans odaklı** — Lazy arama, yerel fontlar, `<picture>` + WebP, slider lazyload, koşullu script yükleme
- **SEO & AI keşfi** — `robots.txt`, modüler `llms.txt` hub, site geneli `?q=` arama URL'leri, otomatik kitap meta, Product/FAQ JSON-LD, `ai-seo-crawler`, `/sss` sayfası

## Teknoloji

| Katman | Teknoloji |
|--------|-----------|
| Site motoru | Jekyll 3.10 (`github-pages` gem, Ruby) |
| CSS framework | Bootstrap 5.3 (tasarım sistemi: [design.md](design.md)) |
| Özel stiller | `theme.css` + `app.css` + `fontawesome-all.min.css` |
| JavaScript | Vanilla JS (filtre, navbar, arama) + Bootstrap bundle + Lunr.js (lazy) |
| Fontlar | Yerel: Geometric Sans, Punta, Raykjavik (WOFF2), Font Awesome 5.15.4 |
| Yayın | GitHub Pages |
| İçerik | Markdown + YAML front matter |

Node.js veya npm **gerekmez**.

## Hızlı Başlangıç

### Sistem gereksinimleri

Yerel geliştirme için aşağıdaki ortam önerilir. Canlı site GitHub Pages üzerinde derlenir; prod için bu araçların sunucuda kurulu olması gerekmez.

#### Tüm platformlar

| Gereksinim | Zorunlu | Açıklama |
|------------|---------|----------|
| **Git** | Evet | Repoyu klonlamak ve sürüm kontrolü |
| **Ruby 3.x** | Evet | Jekyll ve gem bağımlılıkları (`github-pages` gem — canlı ile aynı sürüm) |
| **Bundler** | Evet | `Gemfile` üzerinden gem kurulumu (`install.sh` eksikse kurar) |
| **Python 3** + **pip** | Evet | Font WOFF2 subset (`fonttools`, `brotli` — `install.sh` kurar) |
| **Bash** | Evet | `install.sh` / `start.sh` ve `scripts/*.sh` için |

Node.js veya npm **gerekmez**.

#### Windows (önerilen: Windows 10 ve üzeri)

| Gereksinim | Zorunlu | Açıklama |
|------------|---------|----------|
| **Windows 10+** | Evet | Geliştirme ortamı hedefi |
| **Git for Windows** | Evet | [git-scm.com](https://git-scm.com/) — **Git Bash** ile `sh install.sh` / `sh start.sh` |
| **RubyInstaller** | Evet | [rubyinstaller.org](https://rubyinstaller.org/) — Ruby 3.x + **Devkit** (MSYS2) seçin; kurulumdan sonra Git Bash'i yeniden açın |
| **winget** | Önerilen | Windows App Installer ile gelir; `install.sh` ImageMagick ve libwebp kurulumunda kullanır |
| **ImageMagick** / **libwebp** | Opsiyonel | Yoksa `install.sh` winget ile kurmayı dener; başarısızsa site jpg/png ile çalışır |

Windows'ta `winget` yoksa (eski Windows veya kurumsal kısıt): ImageMagick'i [imagemagick.org](https://imagemagick.org) üzerinden manuel kurun veya yalnızca jpg/png ile devam edin.

```powershell
# winget kurulu mu kontrol
winget --version

# Manuel kurulum (install.sh başarısızsa)
winget install ImageMagick.ImageMagick
winget install Google.Libwebp
```

#### macOS

| Gereksinim | Zorunlu | Açıklama |
|------------|---------|----------|
| **Homebrew** | Önerilen | `install_image_tools.sh` → `brew install imagemagick` / `webp` |
| **Ruby 3.x** | Evet | `brew install ruby` veya RubyInstaller benzeri |

#### Linux

| Gereksinim | Zorunlu | Açıklama |
|------------|---------|----------|
| **imagemagick**, **webp** paketleri | Önerilen | `install_image_tools.sh` → `sudo apt install imagemagick webp` (Debian/Ubuntu) |

#### Özet: ne ne için?

| Araç | Kullanım |
|------|----------|
| Ruby + Bundler | Jekyll build / serve |
| Python + fonttools | `subset_font.sh` — OTF/TTF → WOFF2 |
| winget (Windows) | `install_image_tools.sh` — ImageMagick + libwebp otomatik kurulum |
| ImageMagick / cwebp | `generate_webp.sh` — jpg/png → WebP (`start.sh` hook) |
| Git Bash | Windows'ta shell script'leri çalıştırma |

### Kurulum (ilk kez)

```bash
git clone https://github.com/<org>/damlaegitim.git
cd damlaegitim
sh install.sh
```

`install.sh` — sıfırdan kurulum (hook yok):

1. Ruby / Bundler kontrolü
2. `bundle install`
3. Python `fonttools` + `brotli`
4. WOFF2 font dönüşümü (`subset_font.sh` — mevcut woff2 güncel ise atlanır)
5. Font boyut kontrolü (`check_fonts.sh`)
6. Görsel araçları (`install_image_tools.sh` — Windows: winget ImageMagick + libwebp)
7. `_data/webp_manifest.yml` yoksa oluşturma
8. `jekyll build` ile kurulum doğrulama

### Yerel geliştirme (kurulum sonrası)

```bash
sh start.sh
```

`start.sh` — geliştirme hook'ları + sunucu:

1. Büyük görselleri raporlar (`check_images.sh`)
2. Eksik WebP üretir (`generate_webp.sh`)
3. `bundle exec jekyll serve`

Tarayıcıda [http://localhost:4000](http://localhost:4000) adresini açın.

Windows’ta Git Bash ile `sh install.sh` ve `sh start.sh` çalıştırılabilir. Alternatif:

```bash
bundle exec jekyll serve
```

### Canlıya alma

```bash
git add .
git commit -m "Değişiklik açıklaması"
git push
```

GitHub Pages otomatik olarak siteyi günceller (klasik Jekyll build — özel Actions yok). Repo ayarları: **Settings → Pages → Deploy from a branch** (`main`, `/ (root)`).

Yerel build, canlı ile aynı stack'i kullanır:

```bash
bundle install
bundle exec jekyll build
```

`bundle exec github-pages health-check` isteğe bağlıdır (Linux/WSL önerilir; Windows'ta libcurl eksikliği nedeniyle başarısız olabilir).

## Kurulum ve geliştirme script'leri

| Script | Ne zaman | Görev |
|--------|----------|-------|
| [`install.sh`](install.sh) | İlk kez (`git clone` sonrası) | Ruby gems, fonttools, WOFF2 subset, görsel araçları (winget), `jekyll build` doğrulama — **hook yok** |
| [`start.sh`](start.sh) | Her geliştirme oturumu | `check_images` + `generate_webp` hook'ları + `jekyll serve` |
| [`scripts/install_image_tools.sh`](scripts/install_image_tools.sh) | `install.sh` içinden | Windows: winget ImageMagick + libwebp; macOS: brew; Linux: apt |
| [`scripts/generate_webp.sh`](scripts/generate_webp.sh) | `start.sh` içinden | `ean/` ve `slides/` için eksik `.webp` üretir; `_data/webp_manifest.yml` günceller |
| [`scripts/refresh_image_paths.sh`](scripts/refresh_image_paths.sh) | Dahili | Windows'ta winget kurulum yollarını PATH'e ekler |
| [`scripts/check_images.sh`](scripts/check_images.sh) | `start.sh` içinden | Büyük görselleri raporlar (dosyaya dokunmaz) |
| [`scripts/subset_font.sh`](scripts/subset_font.sh) | `install.sh` içinden | OTF/TTF → WOFF2 subset |
| [`scripts/check_fonts.sh`](scripts/check_fonts.sh) | `install.sh` içinden | Font boyut uyarı raporu |
| [`scripts/normalize_book_frontmatter.rb`](scripts/normalize_book_frontmatter.rb) | Manuel | Kitap front matter sıralama; `preview_link`, `examlink`, `damlaurl` korunur; eski `review_link`/`previewpage`/`damlayayinevi` taşınır veya silinir |

Windows Git Bash'te sıfırdan kurulum: `sh install.sh` → geliştirme: `sh start.sh`.

## Proje Yapısı (özet)

```
_books/          Ürünler (kitap / eğitim seti)
_catalogs/       Kataloglar
_data/           Jekyll data (webp_manifest.yml — otomatik)
_pages/          Statik sayfalar + search-index.json
_layouts/        HTML şablonları
_includes/       Ortak bileşenler (menü, kart, filtre, arama, ai-seo-crawler)
assets/css/      Stiller (bootstrap, fontawesome, theme, app, spotlight)
assets/fonts/    Yerel fontlar (geometric-sans, punta, raykjavik, fontawesome)
assets/js/       Script'ler
assets/images/   Görseller, slider ve kapaklar (jpg/png; .webp otomatik üretilebilir)
scripts/         Kurulum ve geliştirme araç script'leri (yukarıdaki tablo)
install.sh       İlk kurulum
start.sh         Geliştirme sunucusu + hook'lar
index.html       Anasayfa
```

Detaylı mimari için [project.md](project.md), stil ve tasarım için [design.md](design.md) dosyasına bakın.

## SEO ve AI Crawler

| Dosya / URL | Açıklama |
|-------------|----------|
| `robots.txt` | Arama motorları ve AI botlara tam erişim; sitemap + llms hub referansı |
| `/llms.txt` | LLM indeks (hub): özet, bölüm linkleri, iletişim |
| `/llms/*.txt` | Modüler bölümler: ana sayfalar, eğitim/hikaye kitapları (tümü), kataloglar |
| `/?q=` | Site geneli arama deep link; SearchAction kanonik giriş |
| `/sss` | Sıkça sorulan sorular (görünür içerik + FAQPage JSON-LD) |
| `_includes/search-lunr.html` | Spotlight arama; `initFromUrlQuery` + `syncUrlQuery` (`history.replaceState`) |
| `_includes/book-seo-tags.html` | Kitap sayfaları meta / Open Graph / Twitter |
| `_includes/structured-data-*.html` | schema.org JSON-LD (Organization, WebSite, Product, Book, FAQ) |
| `_includes/related-books.html` | Kitap detayda ilgili ürünler (grades + genre + anatemalar) |
| `_includes/ai-seo-crawler*.html` | Sayfa türüne göre gizli LLM talimat + bağlam metni |

`book-minimal-content.html` **görünür** ince kitap metni; `ai-seo-crawler` **gizli** LLM rehberi (`aria-hidden`, `data-nosnippet`). `llms.txt` site haritası; `ai-seo-crawler` sayfa bağlamı — ikisi birbirini tamamlar.

Kitap `description:` opsiyoneldir; boşsa başlık, sınıf ve türden otomatik üretilir. `previewbook` layout: `book-minimal-content` + tam ekran iframe (gizli `d-none` ölü kod kaldırılmış).

**Doğrulama:** `bundle exec jekyll build` sonrası `_site/robots.txt`, `_site/llms.txt`, `_site/llms/egitim-kitaplari.txt`, `/?q=damla` arama modalı, örnek kitap meta + JSON-LD. Ayrıntılar: [project.md — SEO](project.md#seo-ve-ai-crawler-altyapısı).

## Yeni Ürün Ekleme

1. `_books/` altında yeni bir `.md` dosyası oluşturun
2. Front matter alanlarını doldurun:

```yaml
---
layout: book
title: "Ürün Adı"
grades: [1, 2]
genre: education
tags: []
anatemalar: ["Değerler Eğitimi", "Macera"]     # yeşil # etiketler (detay sayfası üstü)
kavramlar: ["Dil Bilim", "Milli Kültür"]       # kısa etiket → @pill; uzun cümle → özet alıntı
ean: 9786053832874
preview_link: "https://cdn.e-damla.com.tr/PUBLIC/ornek-sayfalar/9786053832874/index.html"
examlink: ""   # HDS PDF tam URL; boşsa HDS butonu görünmez
damlaurl: ""   # Damla Yayınevi ürün sayfası; doluysa Satın Al, boşsa Bilgi → tedarik popup
---
Ürün açıklaması buraya...
```

`anatemalar` TEMALAR için yeşil `#etiket` olarak gösterilir. `kavramlar` kısa slug veya kavram adıysa turuncu `@etiket` pill (tireli boşluksuz slug, ≤18 karakter veya boşluklu ≤28 karakter); uzun özet cümlesiysa italik alıntı (`.book-detail__tagline`) olarak render edilir. `tags` şu an aktif UI’da kullanılmaz; normalize betiği boş dizi yazar. `preview_link` doluysa İncele butonu ve `previewbook` iframe görünür. `examlink` doluysa ve `_config.yml` içinde `examlink: true` ise HDS butonu görünür. `damlaurl` doluysa **Satın Al** (iframe), boşsa **Bilgi** (tedarik popup).

3. Kapak görselini `assets/images/ean/{ean}.jpg` olarak ekleyin (jpg/png optimize edin; `.webp` `sh start.sh` ile otomatik üretilir)
4. `sh scripts/check_images.sh` ile boyut kontrolü yapın (veya `sh start.sh` — hook olarak çalışır)
5. `sh start.sh` ile önizleyin
6. Commit ve push

## Stil Düzenleme

Renk token’ları, tipografi, bileşen kataloğu ve tasarım kuralları için [design.md](design.md) dosyasına bakın.

Özet: yeni bileşen → `theme.css`; Bootstrap override → `app.css`; `bootstrap.min.css` düzenlenmez.

## Performans ve Görsel Optimizasyonu

Site hızı için uygulanan önlemler:

| Alan | Uygulama |
|------|----------|
| Hero slider | Mobil-öncelik `<picture>` + koşullu WebP, mobil LCP preload (webp), `slider-init.js` defer |
| Kitap kapakları | `<picture>` + koşullu WebP, `loading="lazy"`, `fetchpriority="low"` |
| Arama | Lunr lazy-load; indeks `/assets/search-index.json` |
| Scriptler | Bootstrap `defer`; `book-filter.js` idle init (`requestIdleCallback`); tiny-slider defer |
| CSS | `content-visibility` kitap grupları; `tiny-slider.css` anasayfa head'de |
| Fontlar | Font Awesome yerel; Raykjavik WOFF2 subset (~26 KB) |
| Instagram | Feed `IntersectionObserver` ile gecikmeli yüklenir |

### Görsel politikası

| İş | Araç |
|----|------|
| Resize / JPEG sıkıştırma | **Photoshop** (manuel) — ImageMagick ile resize yapılmaz |
| jpg/png → webp | `scripts/generate_webp.sh` (`start.sh` hook) |
| Boyut uyarısı | `scripts/check_images.sh` — dosyaya dokunmaz |

Mobil slider `*m.jpg` hedefi: ≤ 120 KB (`sh scripts/check_images.sh slides`). Kod tarafında webp preload ve `<picture>` ile LCP iyileşir; kalıcı küçültme Photoshop ile yapılır.

### Cloudflare mobil benchmark (referans)

Mobil skor ~55; LCP ~11.5 s (büyük mobil jpeg preload + yanlış LCP kaynağı). Kod optimizasyonları: mobil webp preload, mobil-öncelik slider, defer JS, content-visibility. Retest: Cloudflare Speed Test mobil.

### Görsel kontrol scripti

Görseller manuel optimize edilir. Script yalnızca büyük dosyaları raporlar:

```bash
sh scripts/check_images.sh          # Tüm klasörler
sh scripts/check_images.sh slides   # Slider görselleri
sh scripts/check_images.sh ean      # Kitap kapakları
```

### WebP otomatik üretim (hibrit)

`assets/images/ean/` ve `assets/images/slides/` altındaki jpg/png dosyalarından eksik `.webp` varyantları üretilir; manifest [`_data/webp_manifest.yml`](_data/webp_manifest.yml) güncellenir. [`eanimage.html`](_includes/eanimage.html), [`book-card.html`](_includes/book-card.html) ve [`slider.html`](_includes/slider.html) yalnızca manifest'te kayıtlı webp'ler için `<source type="image/webp">` ekler — araç veya dosya yoksa jpg/png ile devam eder, 404 oluşmaz.

| Aşama | Ne yapar |
|-------|----------|
| `install.sh` | `install_image_tools.sh` — Windows'ta winget ile ImageMagick (`ImageMagick.ImageMagick`) ve gerekirse libwebp (`Google.Libwebp`) kurar |
| `start.sh` | `generate_webp.sh` — eksik webp üretir, manifest günceller |
| `refresh_image_paths.sh` | Winget kurulum yollarını Git Bash PATH'ine ekler |

```bash
sh scripts/generate_webp.sh         # Manuel çalıştırma
sh start.sh                         # Geliştirme: check_images + generate_webp + jekyll serve
```

Araçlar: `cwebp` (libwebp) veya ImageMagick (`magick`). Kurulumda otomatik denenir; yoksa site jpg ile çalışır. Üretilen `.webp` dosyalarını commit etmek prod GitHub Pages için önerilir.

### Font WOFF2 üretimi

```bash
pip install fonttools brotli   # bir kez
sh scripts/subset_font.sh      # Tüm fontlar için WOFF2 oluşturur (fontawesome hariç)
```

### Cloudflare

Site şu an Cloudflare DNS-only modunda (gri bulut).

## Instagram Carousel

Anasayfada `@okul.damla` gönderilerini gösteren carousel modülü [`_includes/instagram-carousel.html`](_includes/instagram-carousel.html) dosyasındadır. Tek dosyada inline HTML, CSS ve JS içerir.

### Kurulum

1. [behold.so](https://behold.so) üzerinde `okul.damla` hesabını bağlayın
2. Çıktı tipi **JSON** olan bir feed oluşturun
3. `_config.yml` içindeki `instagram_carousel.feed_url` alanına feed URL’sini yazın:

```yaml
instagram_carousel:
  username: okul.damla
  profile_url: https://instagram.com/okul.damla
  feed_url: 'https://feeds.behold.so/XXXX'
  limit: 12
```

Başka bir sayfaya eklemek için:

```liquid
{% include instagram-carousel.html %}
```

## Spotlight Arama

Navbar’daki arama kutusu veya `Ctrl+K` / `⌘K` ile kitap araması açılır. Sonuçlar kapak görseli, başlık, yazar ve sınıf/tür bilgisiyle listelenir.

- **Masaüstü** — Navbar’da tam arama kutusu + `Ctrl+K`
- **Mobil** — Logo ile hamburger menü arasında minimal `Kitap ara...` çubuğu (collapse dışında, her zaman görünür)

- İndeks: `site.books` → build-time `/assets/search-index.json` (kapak: `assets/images/ean/{ean}.webp|jpg`)
- Lunr alanları: `title`, `ean`, `authors`, `categories`, `grades`, `genre`, `anatemalar`, `tags`, `body`
- 4+ haneli sayısal sorgularda barkod (`ean`) doğrudan eşleştirme; diğer aramalarda Lunr wildcard
- Lunr.js yalnızca arama açılınca yüklenir (sayfa yükü azaltılır)
- Dosyalar: [`_includes/search-lunr.html`](_includes/search-lunr.html), [`_pages/search-index.json`](_pages/search-index.json), [`assets/js/lunr.js`](assets/js/lunr.js)

## Navbar

Üst menü (`#MagicMenu`) scroll sırasında sabit kalır; aşağı kaydırınca gizlenmez.

- Yapı: mobilde logo + arama + hamburger üst satır; menü linkleri alt satırda tam genişlik
- Script: [`assets/js/nav.js`](assets/js/nav.js) (`--nav-height` senkronizasyonu, scroll gölgesi)

## Kitap Detay Popup’ları

Tanıtım (YouTube), Satın Al / Bilgi, İncele ve HDS butonları [`_includes/popup.html`](_includes/popup.html) ile açılır. `damlaurl` doluysa **Satın Al** ürün sayfasını iframe’de açar; boşsa **Bilgi** tedarik popup’unu gösterir. HDS yalnızca `_config.yml` içinde `examlink: true` ve kitap `examlink` doluysa görünür. İncele yalnızca `preview_link` dolu kitaplarda görünür. Tedarik popup’u iPhone koyu temada okunabilir metin renklerine sahiptir.

## Footer

Site alt bilgisi [`_includes/footer-menu.html`](_includes/footer-menu.html) ile 3 sütunlu olarak gösterilir:

1. **Ürünler** — Eğitim / Hikaye kitapları (`/urunler`) ve kataloglar sayfası
2. **Önemli Bilgiler** — `footer_show: true` olan `_pages` kayıtları (`footer_order` ile sıralama)
3. **Adres & İletişim** — `_config.yml` içindeki `contact_*` alanları + sosyal medya ikonları

### İletişim bilgileri

Telefon, e-posta ve adres `_config.yml` kök seviyesinde tanımlanır:

```yaml
contact_phone: "+90 212 514 28 28"
contact_phone_href: "tel:+902125142828"
contact_email: "iletisim@damlayayinevi.com.tr"
contact_address: "Alemdar Mh. Prof. Kazım İsmail Gürkan Cad. No:8 Fatih, 34110 İstanbul"
```

Paylaşılan partial: [`_includes/contact-info.html`](_includes/contact-info.html)

```liquid
{% include contact-info.html mode='footer' %}  {# footer #}
{% include contact-info.html mode='page' %}   {# iletişim sayfası #}
```

Yeni bir sayfayı footer’da listelemek için front matter’a `footer_show: true` ve `footer_order` ekleyin.

## Sayfalar

| URL | Açıklama |
|-----|----------|
| `/` | Anasayfa — slider + Instagram carousel + sınıf/tür filtreli ürün listesi |
| `/urunler` | Tüm ürünler, sınıf/tür nav filtresi, hash URL desteği |
| `/urunler/:title` | Ürün detay |
| `/kataloglar` | Katalog listesi |
| `/kataloglar/:title` | Katalog detay |
| `/urun-inceleme-linkleri` | Ürün inceleme linkleri — `preview_link` dolu kitaplar, arama + paylaşım |
| `/hakkimizda` | Hakkımızda |
| `/iletisim` | İletişim |

## Filtre URL’leri

Anasayfa ve `/urunler` sayfasında sınıf/tür filtresi URL hash ile paylaşılabilir (Jekyll rebuild gerekmez):

```
/urunler#okul-oncesi          → Okul öncesi (tüm türler)
/urunler#okul-oncesi/egitim   → Okul öncesi, eğitim
/urunler#1-sinif/hikaye       → 1. sınıf, hikaye
/#2-sinif/egitim              → Anasayfa, 2. sınıf eğitim
```

Nav’dan filtre seçildiğinde URL otomatik güncellenir; hash ile açılan sayfada filtre sayfa yüklenirken uygulanır.

## Lisans ve İletişim

© Damla Yayınevi — [damlaokul.com](https://damlaokul.com)

- [Facebook](https://www.facebook.com/damlayayinevi)
- [Instagram (Damla Yayınevi)](https://instagram.com/damlayayinevi)
- [Instagram (Damla Okul)](https://instagram.com/okul.damla)
- [YouTube](https://www.youtube.com/c/damlayayinevi)
- [Twitter](https://twitter.com/damlayayinevi)