CSV'den HTML Tablosuna

Bir veri tablosunu bir blog yazısına, iç wiki’ye veya e-posta bültenine eklerken genellikle içerik yönetim sisteminizin (CMS) tablo düzenleyiciyle başa çıkmak zorunda kalırsınız. Bunun yerine bu CSV dosyasını buraya yapıştırın: ilk satır <th> hücreleri oluşturur, diğer tüm satırlar <td> hücreleri oluşturur ve tüm tablo, iç stil kullanılmayan basit bir <table> elemanıyla sarılır. Bu, sitenizde mevcut olan herhangi bir CSS şablonunu kullanan temiz bir etiketleme formatıdır.

Dönüştürme nasıl gerçekleşiyor?

  1. 1

    CSV dosyasını yapıştırın

    Satır sonları verileri satırlara böler; `str_getcsv` her satırı ayrıştırarak tırnak içindeki virgülleri ve kaçış karakterli tırnakları doğru şekilde işler.

  2. 2

    Başlık modunu değiştirin

    Açık olduğunda ilk satır `<th>` hücreleriyle gösterilir; kapalı olduğunda her satır basit `<td>` ile gösterilir.

  3. 3

    Değerler HTML için kaçışlanır

    Dönüştürücü Laravel'ın e() yardımcı fonksiyonunu çağırır; bu sayede `<`, `>` ve `&` karakterleri çıktıda güvenli bir şekilde kaçışlanır.

  4. 4

    İşaretlemeyi kopyalayın

    HTML, okunabilirlik için iki boşluk girintiyle biçimlendirilir; doğrudan bir Blade dosyasına, bir Markdown yazısına veya bir WYSIWYG kaynak görünümüne yapıştırabilirsiniz.

Çıkışın stilizasyonu ve erişilebilirliği

Dönüştürücü, yapısal olarak basit bir HTML üretir; hiçbir sınıf, satır içi stil veya <thead>/<tbody> sarmalayıcı kullanılmaz. Bu sayede çıktı taşınabilir kalır; ancak isterseniz görünümünü güzelleştirebilirsiniz.

Minimal bir stil sayfası

table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 8px 12px; border-bottom: 1px solid #e5e7eb; text-align: left; }
th { background: #f9fafb; font-weight: 600; }
tr:nth-child(even) td { background: #fafafa; }

Hızlı erişilebilirlik iyileştirmeleri

  • Uzun tablolarınız varsa ilk satırı bir <thead> içine sarın; böylece kullanıcılar satırlar arasında gezinirken ekran okuyucular başlık sütunlarını seslendirir. Dönüştürücü, çıktıyı olabildiğince sade tutmak için bunu otomatik olarak yapmaz.
  • Tablonun üstüne bir <caption> öğesi ekleyin ve verilerin neyi temsil ettiğini sade bir dille açıklayın.
  • Başlık satırınız sütunları tanımlıyorsa <th> hücrelerinde scope="col" kullanın; ilk sütun satırları tanımlıyorsa scope="row" kullanın.

HTML doğru format olmadığında

Hedef biçim Markdown ise bunun yerine CSV’den Markdown’a Dönüştürücü aracını kullanın. Hedef bir veritabanı ise CSV’den SQL’e Dönüştürücü aracı, doğrudan çalıştırabileceğiniz INSERT komutları üretir. HTML tablolar sayfalarda görüntülemek için mükemmeldir; ancak sorgulanması veya yeniden sıralanması gereken veriler için orta düzeyde kalır.

Sık Sorulan Sorular

Evet. Değerler Laravel’ın e() yardımcı fonksiyonuyla kaçışlanır; bu nedenle < karakteri &lt; olur ve kullanıcının sağladığı içerik betik etiketleri enjekte edemez veya tabloyu erken kapatamaz.

Varsayılan olarak hayır; çıktı, doğrudan <tr> alt öğelerine sahip tek bir <table> olur. Hedef CSS’iniz gerektiriyorsa başlık <tr> öğesini <thead> içine, geri kalanını da <tbody> içine sarın.

İçinde satır sonu bulunan hücreler olduğu gibi görüntülenir. Satır sonlarının tarayıcıda görünmesini istiyorsanız, dönüştürmeden önce bunları <br> ile değiştirin veya <td> CSS’inde white-space: pre-wrap; ayarını kullanın.

Evet. CSV dosyası, dönüştürücünün tabloyu oluşturabilmesi için sunucumuza gönderilir. Dosya saklanmaz ve sayfa bağlantısına eklenmez.

İlgili Araçlar

Araç diğer dillerde mevcuttur