MutoPay artık altı dil konuşuyor

İstanbul’daki bir alıcı, Madrid’deki bir mağazadan gelen bir ödeme bağlantısını açıyor. Sayfa Türkçe yükleniyor. Ödemeyi yapıyor, satıcı webhook bildirimini alıyor ve Madrid’deki satıcı panelinde işlem İspanyolca olarak görünüyor. Dil seçmek zorunda kalan kimse olmadı.

Bu ay yayına aldığımız şey bu. Müşterinin gördüğü ödeme sayfası, “Pay Me” bağlantı sayfası ve satıcı panelinin tamamı altı dile çevrildi: İngilizce, Arapça, İspanyolca, Türkçe, Ermenice ve Rusça. Pazarlama sitesi (bu blog dahil) da aynı altı dilde.

Neler çevrildi

Müşteri tarafı:

• /pay/:id adresindeki barındırılan ödeme sayfası
• “Pay Me” bağlantı sayfası (/pay/me/:slug)
• Cüzdan akışındaki bütün metinler: bağlanma, imzalama, onaylama, yeniden deneme, hata durumları
• Fiyat teklifi ve rota karşılaştırma metinleri
• Manuel gönderim talimatları, QR kod açıklamaları ve dust amount uyarıları
• KYC yönlendirme bildirimi ve nadir görülen “manuel kontrol gerekiyor” durumu

Satıcı tarafı:

• Panel kenar çubuğu ve /dashboard/* altındaki her sayfa
• Ayarlar: API anahtarları, webhook gizli anahtarı, kanallar, master key, ödeme yönlendirme override’ı
• İlk kurulum sihirbazı
• Ödeme listesi, filtreler, detay görünümü, durum etiketleri
• “Pay Me” bağlantı yapılandırması
• Bütün form doğrulama ve hata mesajları

Yönetici paneli (/admin/*) şimdilik İngilizce kalıyor. Dahili kullanım için ve müşteriye gösterilmiyor.

Dil nasıl seçiliyor

İlk ziyarette tarayıcının dili navigator.language üzerinden okunuyor. Altı dilden biriyle eşleşirse arayüz o dilde açılıyor. Sonra tercih localStorage’a kaydediliyor, böylece sonraki ziyarette tespit adımı atlanıyor.

Ödeme sayfasının, “Pay Me” sayfasının ve panel kenar çubuğunun alt bilgisinde bir dil seçici var. Seçiciden bir dil seçmek otomatik tespiti geçersiz kılıyor ve aynı şekilde kaydediliyor.

Oturum açmış satıcılar için tercih, satıcı kaydının üzerinde tutuluyor. Yani dilini dizüstünde değiştirdiğinde telefonda da öyle açılıyor.

Arapça için sağdan sola yerleşim

Arapça bütün düzeni ters çeviriyor. Metin sağa yaslanıyor, kenar çubuğu sağ kenara geçiyor, ikon ve oklar aynalanıyor, tutar alanlarındaki rakamlar ise doğal soldan sağa okumalarını koruyor. Astro içerik sitesi (blog, changelog, anasayfa) de /ar/* altında aynı şekilde gösteriliyor.

Bu yazıyı Arapça okuyorsanız adresi /ar/blog/multilingual-checkout. Aynı slug her dilde mevcut.

Bir dilde satıcı, başka bir dilde müşteri

Ödeme sayfası ve panel birbirinden bağımsız. İspanyolca konuşan bir satıcı panelini İspanyolca kullanırken müşterilerinin her biri ödeme sayfasını kendi tarayıcı diliyle görebiliyor. Müşteri tarafına satıcının dilini dayatan bir kilit yok.

Bu, sınır ötesi ticarette önemli. Yerevan merkezli, Türkiye’de, Rusya’da ve İspanya’da müşterisi olan bir ajans üç ayrı ödeme sayfası tutmak zorunda değil. Tek bağlantı, üç dil, otomatik.

Neden bu altı dil

Seçim pragmatik, kapsayıcı değil. Gerçek kullanıcı talebi gördüğümüz ya da pazar fırsatı net olan dilleri seçtik:

• İngilizce varsayılan ve API dokümantasyon dili
• Arapça stablecoin kullanımı yüksek olan Körfez ve Kuzey Afrika’yı kapsıyor
• İspanyolca ilk aylarda en çok talep gören ikinci ödeme dilimizdi
• Türkçe lira oynaklığının USDT TRC-20 desteğine yönelttiği satıcı tabanına sesleniyor
• Ermenice evimiz: MutoPay Yerevan’da geliştiriliyor
• Rusça post-Sovyet diasporasını ve kullanıcı tabanımızdaki Ermeni-Rus kesişimini kapsıyor

Pazarınız bu listede yoksa ve dahil olsaydı MutoPay’i kullanacak olsaydınız, bize yazın. Yedinci dili eklemek bir çeviri dosyası ve seçicide bir satır, yeniden yazım değil.

Kaputun altında neler değişti

Detayı merak edenler için: React uygulaması her dil için bir JSON kataloğuyla react-i18next kullanıyor. Astro içerik sitesi Astro’nun dahili i18n yapılandırmasını, ayrı bir ui.ts haritasını ve dil başına içerik koleksiyonlarını (blog/en, blog/ar, blog/es vb.) kullanıyor. Diller arasında eşleşen slug’lar site haritasında hreflang alternatifleri üretiyor, böylece arama motorları bu sayfaların birbirinin çevirisi olduğunu anlıyor.

Çeviri belleği content/src/i18n/ui.ts ve sayfa başına React kataloglarında duruyor. Herhangi bir yerde bir metin eklemek altı dosyanın hepsinde aynı anahtarı gerektiriyor, bu da derleme aşamasında kontrol ediliyor.

Deneyin

Herhangi bir ödeme bağlantısını açın. Alt bilgideki dil seçicisine tıklayın. Ya da tarayıcınızın tercih edilen dilini değiştirip sayfayı yeniden yükleyin.

Yerinde durmayan bir çeviri görürseniz (fazla birebir bir metin, yerel dile oturmayan bir kelime, gözden kaçmış bir İngilizce parça) bize haber verin. Kataloglar düzeltmelerin aynı hafta yayına çıkmasına izin verecek kadar küçük.