پنج شنبه , آبان ۳۰ ۱۳۹۸
خانه / آموزش برنامه نویسی / آموزش برنامه نویسی وب / آموزش Asp.net core / آموزش کار با CkEditor با قابلیت آپلود تصویر

آموزش کار با CkEditor با قابلیت آپلود تصویر

آموزش کار با CkEditor با قابلیت آپلود تصویر در Asp.net core 2

 

بدون شک یکی از مهم ترین ابزار برای برنامه نویسی وب ویرایشگرهای متن می باشند. در اکثر پروژه های وب نیاز به بخضی برای وارد کردن اطلاعات به صورت فرمت بندی شده می باشد.

 

یعنی نیاز است متن هایی با استایل ها و فرمت های مختلف نوشته شود و حتی در بین آنها تصاویری نیز وجود داشته باشد. در این مواقع از ادیتور های متن می توان استفاده کرد.

یکی از بهترین و شناخته شده ترین ادیتور های متن CkEditor می باشد که خوشبختانه از زبان فارسی و قابلیت Right To Left نیز پشتیبانی می کند. در این ادیتور متن انواع فرمت های مختلف برای کار با متن وجود دارد که می توان از آنها استفاده کرد.

اما یکی از کلیدی ترین قابلیت های ادیتور ها امکان آپلود تصویر برای قرار دادن در بین متن می باشد. چون مطمئنا شما می خواهید در بین متن های خود از تصاویر نیز استفاده کنید. در ادیتور متن CkEditor این قابلیت به صورت پیش فرض وجود دارد اما فعال نمی باشد.

در واقع شما برای فعالسازی این قابلیت در CkEditor بایستی حتما از پلاگین CkFinder استفاده نمایید که این پلاگین یک پلاگین غیر رایگان می باشد.

راه حل دوم نیز این می باشد که خود شما آستین ها را بالا زده و قدری کد نویسی کرده و امکان آپلود تصویر را در این ادیتور اضافه نمایید که در این دوره آموزشی ما برای شما این کار را انجام داده ایم.

 

 

آموزش کار با CkEditor با قابلیت آپلود تصویر

 

در ادامه می توانید تصاویری از ادیتور متن فارسی شده CkEditor با قابلیت آپلود و ذخیره تصویر را مشاهده نمایید.

 

آپلود عکس در ckeditor

 


 

آپلود عکس

 


 

ckeditor

 

 

در این دوره آموزشی با استفاده از Razor Page ها در Asp.net core 2.0 قابلیت آپلود عکس را به ادیتور CkEditor اضافه کرده ایم.

 

 

 

 

کاربران گرامی هرگونه سوالی در مورد این دوره آموزشی دارید می توانید از طریق پیام رسان های واتس آپ، سروش و یا تلگرام به شماره ۰۹۱۲۷۲۴۰۸۵۰ با بنده در ارتباط باشید.

 

آموزش کار با CkEditor با قابلیت آپلود تصویر

 

 

خرید این مجموعه آموزشی به همراه سورس و فیلم آموزشی راهنما

 

10 نظر ثبت شده است.

  1. باسلام در پروژه ام وی سی هم از این روش page میشه استفاده کرد یا فقط در core این قابلیت هست؟
    راستش را بگم شما خیلی عالی و حرفه ای آموزش میدید و دلتون می خواد تمام مطالب مهم و کاربردی را کاربرانتان یاد بگیرن که این نحوه آموزش خیلی کم پیدا میشه!!!

    • سعید بحرانی فرد

      با سلام و درود

      توی MVC خیر. میتونید از این لینک هم استفاده کنید
      موفق باشید

      • باسلام خدمت مهندس گرامی ینده این لینک را نتونستم استفاده کنم اگه امکانش باشه مثل موردی برای core ذرست کردید و برای فروش قرار داده اید اگر امکانش هست آپلود تصویر در این ادیتور را در mvc پیاده سازی بفرمایید و برای فروش قرار دهید باتشکر فراوان

  2. سلام. متاسفانه page ها تو core 2.1 کار نمیکنه ارور میده.
    راه حلشو میدونید چیه؟
    MissingMethodException: Method not found: ‘Void Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker..ctor(System.Diagnostics.DiagnosticSource, Microsoft.Extensions.Logging.ILogger, Microsoft.AspNetCore.Mvc.ActionContext, Microsoft.AspNetCore.Mvc.Filters.IFilterMetadata[], System.Collections.Generic.IList`1)’.

    • سعید بحرانی فرد

      با سلام و درود
      فرقی بین Core 2 و Core 2.1 از نظر Page نیست. خطای شما Method not found هست یعنی یک متد رو نمیتونه بشناسه. باید بررسی کنید دقیقا چه متدی هست.

  3. سلام در مورد لینک چی این ادیتور جواب میده

  4. سید محمد حسین کاشانچی

    سلام
    من سورس این آموزش را خریدم.
    تو لوکال کار می کنه ولی وقتی آپلود می کنم خطا میده.
    لطفا خودتون هم این پروژه را پابلیش کنید و آپلود کنید تو هاست و تست کنید تا خطا را مشاهده کنید.

    من واقعا به این سورس نیاز دارم لطفا زحمتش را بکشید.
    با تشکر

    • سعید بحرانی فرد

      با سلام
      این سورس CkEditor دقیقا ادیتوری هست که در آموزش پیاده سازی سایت خبری مشابه با ۹۰ استفاده شده و بر روی هاست واقعی هم پیاده سازی شده و بدون هیچ اشکالی در حال کار کردن هست.
      احتمالا اشکال در پروژه شماست
      موفق باشید

    • سلام
      احتمالا مشکل از دسترسی فولدرها توی سرور هست. باید دسترسی read/write رو به فولدر بدین.
      من قبلا این مشکل رو داشتم.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

*

code