PHP CKEditor Kullanarak Resim Yükleme ve Ekleme – Tasarım Kodlama
PHP

PHP CKEditor Kullanarak Resim Yükleme ve Ekleme

CKEditor eklentisi, web formundaki giriş alanına WYSIWYG düzenleyicisi eklemenin en kolay yolunu sunar. Genellikle, WYSIWYG düzenleyicisi HTML içeriğini göndermek için metin alanını değiştirmek için kullanılır. CKEditor eklentisi ile kolayca WYSIWYG editörünü textarea’ya ekleyebilirsiniz. CKEditor eklentisi kullanıcının textarea alanına HTML içeriği eklemesine ve sunucu tarafına biçimlendirilmiş metin içeriği göndermesine izin verir.

CKEditor’un Resim eklentisi, görüntüyü düzenleyiciye eklemenize yardımcı olur. Bu durumda, düzenleyici içeriğine eklemek için görüntünün URL’sini belirtmeniz gerekir. Resim eklentisinin resim yüklemesine ve CKEditor’a eklemesine izin verilmez. Görüntüyü sunucuya yüklemek ve bu görüntüyü düzenleyici içeriğine eklemek istiyorsanız, özel görüntü yükleme işlevinin CKEditor’e entegre edilmesi gerekir. Bu yazıda, CKEditor’de nasıl resim yükleneceğini ve yüklenen resmi PHP kullanarak editör içeriğine nasıl ekleyeceğinizi göstereceğiz.

Başlamadan önce, Standart Paket CKEditor eklentisini indirin. İndirilen CKEditor eklenti arşivini çıkarın ve kök dizine yerleştirin. Unutmayın: CKEditor’u ayrı olarak indirmenize gerek yoktur, gerekli tüm dosyalar kaynak kodumuza dahildir.

 

CKEditor’u Textarea’ya ekle

1.  CKEditor ile değiştirmek istediğiniz bir textarea öğesi oluşturun.

2. Ardından ckeditor.js dosyasını dahil edin.

3. CKEditor eklentisini başlatmak ve textarea öğesini WYSIWYG düzenleyicisiyle değiştirmek için CKEDITOR.replace() metodu kullanın.

 

 

Kodları ekledikten sonra HTML belgesinin son halinde şuna benzer bir görüntü olması gerekiyor.

Editörün de ekran görüntüsü şuna benzemesi gerekiyor.

ckeditor php kurulum

 

Resim Yükleme URL’sini Ayarlama

CKEditor’da yükleme iletişim kutusu eklemek için CKEDITOR.replace() yöntemine bazı ek yapılandırma seçenekleri belirtin.

Resim yükleme komut dosyasının (ck_upload.php) URL’sini belirtmek için filebrowserUploadUrl config özelliğini kullanın.
FormbrowserUploadMethod yapılandırma seçeneğini oluşturacak şekilde ayarlayın.

Yukarıdaki yapılandırma, Resim Özellikleri iletişim kutusuna bir Yükleme sekmesi ekleyecektir. Kullanıcının bir dosya seçmesine ve yükleme için sunucu tarafı komut dosyasına göndermesine izin verir.

CKeditor php resim yükleme

Resmi Sunucuya Yükle (ckeditor / ck_upload.php)

ck_upload.php dosyası PHP kullanarak dosya yükleme işlemini gerçekleştirir.

  • Yükleme dizinini ve izin verilen resim özelliklerini belirtin.
  • Görüntü türünü ve boyutunu doğrulayın.
  • PHP’de move_uploaded_file() işlevini kullanarak görüntüyü sunucuya yükleyin.
  • Görüntüyü HTML olarak işleyin ve CKEditor’a dönün.
  • Resim yükleme başarılı olursa,
  • Yükleme durumu bir uyarı iletişim kutusunda gösterilir.
  • Yüklenen resmi düzenleyiciye ekle.

ckeditor içine ck_upload.php dosyasını oluşturup aşağıdaki kodları ekleyin.

Unutmadan ../upload/ dizini dosyaların kaydedileceği dizindir. formun yüklü olduğu dizine upload adında bir klasör oluşturun.

Örnek komut dosyamız, PHP kullanarak CKEditor’a özel resim yükleme işlevi eklemenize yardımcı olur. Görüntüleri sunucuya yüklemenizi ve otomatik olarak CKEditor’a eklemenizi sağlar. Sunucu tarafı görüntü yükleme işlevini herhangi bir eklenti kullanmadan CKEditor’a kolayca entegre edebilirsiniz.

 

Yorum bırak