Asp.NET MVC CKEditor ve CkFinder Kullanımı

Yazılımlarınızda CKEditor kullanmak için öncelikle  https://ckeditor.com/ckeditor-4/download/  adresinden MVC uyumlu dosylarini indirmeniz gerekiyor.
Indirdiginiz dosylari paketten çikararak projenizin ana dizinine atin, projenizin view katmaninda öncelikle, CKEditor’un .css ve .js dosyalarini sayfaya entegre edin (bu _Layout.cshtml ayfasinda veya kullanacagiz sayfalarda olabilir).
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/ckeditor/ckeditor.js");
@Scripts.Render("~/ckeditor/ckfinder/ckfinder.js");
@Scripts.Render("~/Scripts/jquery.validate.js")
Editörü kullanmak istediginiz yerde asagidaki kodu kullanabilirsiniz.
@Html.TextAreaFor(model => model.Icerik, new { @id = "editor1" })
<script type="text/javascript">
    var editor = CKEDITOR.instances['editor1'];
    if (editor) { editor.destroy(true); }
    CKEDITOR.replace('editor1', {
        enterMode: CKEDITOR.ENTER_BR,
    });
    CKFinder.setupCKEditor(null, '@Url.Content("~/ckeditor/ckfinder/")');
</script>

CkFinder ile resim yüklemek için aşağıdaki adımları uygulayınız.
1- İlk olarak ckfinder klasörünüzün altında _samples ve _source klasörleri varsa bunları silin çünkü çalışma esnasında hatalara neden olabiliyor.
2- ckfinder/bin/Release/" içinde bulunan "CKFinder.dll" dosyasını projemizin "bin" klasörüne referans olarak ekleyin.
(Bunu copy/paste olarak değil referanslar menüsüne sağ tık yapıp referans ekle/Gözat/ckfinder/bin/Release/CKFinder.dll şeklindeyapın
3- ckeditor/ckfinder/config.ascx yolunu takip ederek  config.ascx dosyası üzerinden CheckAuthentication metodunun değeri FALSE ise TRUE yapın.
4- config.ascx dosyası üzerinde resimlerin ekleneceği klasör yolu varsayılan olarak
BaseUrl = "/Content/Uploads/";
BaseDir = HttpContext.Current.Server.MapPath("~/Content/Uploads/");
şeklindedir dolayısyla Content klasörü içerisinde Uploads isimli bir klasör oluşturun veya belirlediğinin başka bir klasör yolunu buraya yazın.
Artık resim yükleyebilirsiniz...

Listeye Dön