Froala – Yeni Nesil WYSIWYG Editor ile Uygulamalarınızda HTML Düzenleyicisi Uygulamak Çok Kolay
Yayınlanan: 2022-04-28Geliştiriciler genellikle HTML'yi düzenlemekte zorlanırlar. Genel HTML editörlerini kullanmak yerine, yeni nesil WYSIWYG editörü Froala, geliştiricilere düzenleme ihtiyaçları konusunda yardımcı olabilir.
Froala, geliştiriciler için yüksek performans sağlayan bir WYSIWYG Javascript web düzenleyicisidir. Onlara olağanüstü bir düzenleme deneyimi sunarak genel ekip üretkenliğini artırır. Zengin metin düzenleyici, kullanıcılara temiz bir arayüz aracılığıyla en iyi özellikleri sağlamak için en son teknolojileri kullanır.
Bu makale, bu düzenleyicinin başlıca özelliklerini ve geliştiricilerin daha verimli olmalarına nasıl yardımcı olacağını tartışacaktır.
Froala Nedir?
Froala, her sektörde çalışan geliştiricilerin ihtiyaçlarını karşılayabilen güçlü bir WYSIWYG zengin metin editörüdür. Bu son derece hızlı javascript düzenleyici, hızlı bir şekilde başlatılabilir ve her türlü zorlu teste dayanabilir.

Froala, XSS ve diğer bilgisayar korsanlığı saldırılarına karşı koruma sağlamak için sağlam bir savunma mekanizmasına sahip, son derece güvenli bir düzenleyicidir. Ek olarak, iyi yapılandırılmış mimarisi onu en verimli zengin metin editörlerinden biri yapar.
Aşağıda Froala'nın Zengin Metin Düzenleyicisinin öne çıkan özelliklerinden bazıları verilmiştir.
Sonsuz Biçimlendirme ve Şekillendirme
Froala ile geliştiriciler, düzenleme aracını kullanarak sayısız içerik biçimlendirmesi gerçekleştirebilir. Froala'nın yerleşik ana kodu, Bold ve Italics gibi temel stilleri içerir. Gelişmiş stil özelliklerine ihtiyaç duyanlar, bunları Froala'nın birçok eklentisi aracılığıyla dahil edebilir.
Yaygın zengin metin düzenleyicilerinin aksine <font> etiketini kullanmaz. Geliştiriciler, kişiselleştirilmiş mevcut yazı tipleri listesinden farklı yazı tipi aileleri kullanabilir. Yazı tipi boyutunu değiştirmeniz gerektiğinde, Froala bunu piksel hassasiyetiyle yapmanızı sağlar.
Paragraflar, tablo hücreleri, resimler ve linkler için uygulanabilen bu metin düzenleyici ile kullanıcılar stil sınıflarını belirleme imkanına sahip olurlar. Burada, en sevdikleri renk paletinden metin ve arka plan renkleri de seçebilirler. Ayrıca, kolay paragraf biçimlendirmesini destekler ve istediğiniz şeyleri geri almanıza veya yeniden yapmanıza olanak tanır.
Bir bölüm seçerek, araç çubuğundan paragraf formatı, yazı tipi boyutu ve yazı tipi türü hakkında fikir edinilebilir. Froala, temel matematik düzenlemesi için kullanılabilen alt simgeleri ve üst simgeleri destekler.
Kullanıcılar, Satır Kesici Eklentisini kullanarak, içeriğin son öğesi olsa bile bir tablodan sonra yeni bir satır ekleyebilir. İçeriği biçimlendirme sözdizimi yoluyla biçimlendirmek için kod kısayollarını kullanmak da mümkündür.
Performans Odaklı Özellikler
Froala'nın başlatılması <40 ms sürer ve bu nedenle geliştirici ekibinin performansını artırır. Editörün kendisi, inanılmaz hızlarda inanılmaz bir düzenleme deneyimi sağlamak için oldukça hafiftir. Anlamayı, kullanmayı, genişletmeyi ve özelleştirmeyi kolaylaştıran eklenti tabanlı modüler bir yapıyla birlikte gelir.

WYSIWYG düzenleyicisi, aynı sayfada birden çok metin düzenleyicisine sahip olmayı destekler. Kullanıcıların tek yapması gereken, onları tıkladıktan sonra başlatılacak şekilde ayarlamaktır. Ayrıca HTML 5 standartları ve CSS 3 ile uyumludur.
Geniş Özelleştirme Seçenekleri
Froala HTML editörü tüm geliştiricilere hitap etmeyi amaçladığından, kullanıcılarına en ayrıntılı düzeyde kullanabilecekleri sayısız özelleştirme seçeneği sunar. Düzenleyici, her eylem için özel olarak tasarlanmış SVG simgeleri kullanıyor olsa da, geliştiriciler, kolaylıklarını artırmak için bunları değiştirebilir ve özelleştirilmiş simgeler yapabilir.
Kullanıcılar ayrıca sık kullanılan eylemler için özelleştirilmiş bir hızlı ekleme düğmesi oluşturabilir ve bunu diğer hızlı ekleme düğmelerinin bulunduğu menüye ekleyebilir. Araç çubuğu ve çeşitli açılır pencereler için düğmeler oluşturma seçenekleri de vardır.
Çeşitli seçeneklere sahip özel bir açılır menü oluşturmanın yanı sıra, kullanıcılar kendi açılır pencerelerini oluşturabilir ve düzenlerini, düğmelerini ve bunların ne zaman gösterileceğini veya gizleneceğini tanımlayabilir.

Froala kullanıcılarının özelleştirebileceği diğer bazı şeyler arasında eklentiler, kısayollar, yazı tipleri, renk seçiciler, ifadeler, paragraf stilleri, satır yüksekliği, satır içi stil, satır içi sınıflar, görüntü stilleri, bağlantı stilleri ve görüntü stilleri bulunur.

Ayrıca, geliştiriciler araç çubuğu üzerinde tam kontrole sahiptir. Düğme kullanılabilirliğini, düğme sırasını ve düğme grubunu özelleştirebilirler. Ayrıca ekran boyutuna bağlı olarak araç çubuğunun düğmelerini de değiştirebilirler. Ayrıca araç çubuğunun konumunu sayfanın üstünde veya altında ayarlamak veya yapışkan hale getirmek de mümkündür.
Tüm kullanım durumlarını karşılamak için Froala düzenleyicisi, Tam Sayfa, Tam Özellikli, Belge Hazır, Satır içi, iframe veya Açılır Pencerede Düzenle gibi çeşitli modlarda mevcuttur. Böylece, uygulamanızda mükemmel düzenleyici görünümü elde etmek için kodlamaya başlamanız gerekmez.
Gelişmiş Arayüz
Her geliştirici, dağınık olmayan bir arayüz üzerinde çalışmak ister. Bu nedenle Froala, geliştiricilerin doğal bulabileceği modern ve sezgisel bir arayüz tasarımı sunar. Editörün açılır pencereleri bile şık görünüyor.

Bu retinaya hazır WYSIWYG metin düzenleyici, daha keskin yazı tipleri ve daha iyi estetik ile birlikte gelir. Kullanıcılar, herhangi bir web sitesinde kullanılabilecek bu düzenleyici için açık veya koyu mod teması arasından seçim yapabilir.
SEO Destekli Nitelikler
Froala'nın güçlü algoritması, SEO açısından daha iyi sonuçlar sağlayan temiz bir HTML çıktısını otomatik olarak sunar. Görsel alternatifi veya alt metin, SEO'da önemli bir rol oynar. Froala kullanıcıları, doğrudan resim düzenleme açılır penceresinden ayarlayabilir ve web sayfasının arama sonuçlarında daha iyi sıralamasını görebilir.

Bağlantı başlığı, kullanıcıların bağlantı açılır penceresinde ayarlayabileceği başka bir özelliktir. SEO'da daha az önemi olmasına rağmen, web sitesinde gezinmeyi ziyaretçiler için sorunsuz hale getirir.

Mobil Dostu Duyarlı Düzenleyici
Froala, mobil cihazlar için yüksek düzeyde optimize edilmiş bir düzenleyicidir. Hem Android hem de iOS kullanıcıları bu düzenleme aracını akıllı telefonlarında çalıştırabilir. Bu zengin metin düzenleyici, yüzdeleri kullanarak görüntünün yeniden boyutlandırılmasını destekler. Ayrıca mobilde de çalışacak video yeniden boyutlandırma özelliğine sahiptir.
Aslında, tüm ekran boyutları için araç çubuğu özelleştirmesine izin veren ilk düzenleme aracıdır. Ayrıca, düzenlenebilir tüm içerik duyarlı hale gelecek ve böylece kullanıcılar, akıllı telefonlarının küçük bir ekranında bile tercih ettikleri cihazda bunları kolayca düzenleyebilirler.
Erişilebilirlik Özellikleri
Bu düzenleyici, Bölüm 508 Erişilebilirlik Programı ile uyumlu olmanın yanı sıra, Web İçeriği Erişilebilirlik Yönergeleri 2.0'a da bağlıdır. Ayrıca, doğal Tab tuşu davranışına izin vererek sayfada kolay gezinmeyi kolaylaştırır.
Froala'nın WYSIWYG HTML düzenleyicisinde, sezgisel kısayolları sayesinde yalnızca klavye kullanılarak gezinilebilir. Sonuç olarak, kullanıcılar farelerini kullanmadan hızlı bir şekilde düzenleme yapabilirler.
Güçlü API

Froala, güçlü bir Javascript API'si sunar. Kullanıcıların düzenleyiciyi kolayca özelleştirmesine ve onunla etkileşime girmesine yardımcı olur. Froala'nın API belgeleri, API olayları, yöntemleri ve seçeneklerine aşina olmak için yardımcı bir kaynak olarak da işlev görür.
Sunucu SDK'ları
Froala Javascript editörü, sunucu SDK'larını kullanarak editörün sunucuya entegre edilmesi işlemini yapar. SDK'lar Java, PHP, .NET ve Python gibi birden çok dili destekler.
Kullanıcılar SDK kitaplıklarını indirebilir ve dosya, resim veya video yükleme, doğrulama veya silme gibi görevleri yönetmek için bunları projelere dahil edebilir.
Çoklu Çerçevelerle Entegrasyon
Froala düzenleyicisi Angular, Django, Rails, Node.js React, WordPress vb. gibi birden çok çerçeveye entegre edilebilir. Örneğin, aşağıdaki videoda açıklandığı gibi Froala düzenleyicisini bir Node.js uygulamasına ekleyebilirsiniz.
Her platforma özel kurulum talimatlarını almak için dokümantasyon sayfasını ziyaret edin.
Başlatma Desteği
Froala'nın editörü, HTML'nin herhangi bir öğesinde başlatılabilir. Textarea, Froala'yı başlatmak için en yaygın HTML öğesi olsa da, geliştiriciler onu yalnızca bir düğme, bağlantı veya görüntü üzerinde başlatmak için de kullanabilir.
Sayfa performansını optimize etmek için tıklamada da kullanılabilir. Özellikle bir sayfa birden çok zengin metin düzenleyici içeriyorsa, initOnClick kullanılması şiddetle tavsiye edilir.
Verimlilik için Entegrasyon
Froala, geliştiricilerin maksimum üretkenliğini teşvik etmek için bir dizi kullanışlı özellik sunar. Gerçek zamanlı düzenleme özelliğini destekler, böylece birden fazla geliştirici aynı anda bir doküman üzerinde çalışıyor olsa bile, herkes değişiklikleri anında görebilir.
Değişiklikleri izle, geliştiricilerin düzenleyicideki metin ekleme ve silme işlemlerini ve metin, tablolar ve resimlerdeki diğer değişiklikleri hızla izlemesine olanak tanır. Kullanıcılar bir otomatik tamamlama listesi almak için @ yazabilir.

Ayrıca WProofreader ile dil bilgisi ve yazım denetimlerini, Embed.ly ile sosyal medya içeriği yerleştirmeyi ve HTML5 Canvas ile resim düzenlemeyi destekler.
7/24 E-posta Desteği
Kullanıcıların Froala desteğine başvurmaları gerekiyorsa, bunu günün herhangi bir saatinde yapabilirler. Froala haftanın yedi günü e-posta desteği sunar ve genellikle bir gün içinde yanıt verir.
Froala WYSIWYG Editörünü Kullanmak için Nedenler
1. Geliştirici Dostu
Froala, geliştiricilerin hayatlarını kolaylaştırmak için oluşturulmuş bir WYSIWYG HTML editörüdür. Geliştiriciler, güçlü API'sini ve belgelerini kullanarak Froala'yı mevcut uygulamalarına bağlayabilir ve birkaç dakika içinde kullanmaya başlayabilir.

2. Özelleştirilebilir
Froala editörü tüm web sitelerine uyacak şekilde tasarlanmıştır. Mevcut temalardan herhangi birini kullanarak veya LESS tema dosyasını kullanarak yeni bir tema oluşturarak kişiselleştirebilirsiniz.
3. Kullanıma Hazır Eklentiler
Bu zengin metin düzenleyici, 30'dan fazla kullanıma hazır eklenti sunar. Geliştiriciler listeden favorilerini seçip projelerde kullanabilirler.
4. Çapraz Platform Desteği
Geliştiriciler bu tarayıcı tabanlı düzenleyiciyi masaüstlerinde, tabletlerde ve akıllı telefonlarda kullanabilir. Platform kısıtlaması olmadığı için iş verimliliğini artırır. Froala, Google Chrome, Safari ve Internet Explorer gibi tüm en iyi tarayıcılarda çalıştırılabilir.

5. Kolay Kısayollar
Fare ve klavye arasında tekrar tekrar geçiş yapmaya gerek yoktur. Froala düzenleyici kısayolları, tüm işlevleri parmaklarınızın ucuna getirir; kısayollar, yalnızca klavyeyi kullanarak belirli komutları etkinleştirmenizi sağlar.
6. Basit ama Güçlü
Froala, sayısız özelliğin birleşiminin bunaltıcı olmak zorunda olmadığına inanıyor. Bu nedenle, kullanıcılar düzenleyici araç çubuğundan 100'den fazla özelliğin keyfini çıkarabilir ve yine de arayüzün dağınık göründüğünü düşünmezler.
Sonuç Sözleri
WYSIWYG editörlerine olan talep, geliştiricilerin içeriği bitmiş üründe görüneceği gibi görselleştirmesini sağladığı için pazarda büyüyor.
Froala, akıllı, zengin bir metin editörü olmanın yanı sıra, geliştiriciler için birinci sınıf bir kullanıcı deneyimini garanti eden güzel bir arayüz de sunuyor.
Froala, herkese erişilebilirliği sağlarken ekibin performansını ve üretkenliğini artırmayı amaçlar. Şirketler, uygulamalarına bu HTML düzenleyiciyi dahil ederek büyük fayda sağlayacaklardır.