این مقاله طریقه افزودن، پیکربندی و بکارگیری ادیتور FCKeditor را در وب سایتهای بر پایه ASP.NET تحت پوشش قرار خواهد داد. پیش فرض این مطلب این است که شما تصمیم به اضافه کردن این ادیتور به سایتی از قبل ایجاد شده را دارید. بنابراین در صورتیکه هنوز اقدام به ایجاد سایتی که در آن از این ادیتور استفاده کنید را نکرده اید با اجرای Visual Studio و انتخابFile > New > Web Site و یا ترکیب کلیدی Shift + Alt + N وب سایتی را در مسیر دلخواه ایجاد کنید.

یکپارچه سازی FCKeditor و ASP.NET

اولین قدم، دریافت FCKeditor و کنترل FCKeditor.net از سایت اصلی است. بخاطر داشته باشید که شما هم به کنترل و هم به فایلهای JavaScript ادیتور نیاز دارید.

فایلهای دریافتی را در یک پوشه مجزا باز کنید.

FCKeditor_2.6.4.1.zip شامل فایلهای پیکربندی و کد های اسکریپت ادیتور است. محتوی این فایل یعنی پوشه fckeditor را در ریشه سایت خود کپی کنید.

در صورتیکه سایت شما حاوی پوشه Bin در ریشه آن نیست با کلیک راست روی نام سایت خود در Solution Explorer و انتخاب Add ASP.NET Folder و سپس Bin آنرا ایجاد کنید.

Solution Explorer و افزودن پوشه Bin

حال فایل FredCK.FCKeditorV2.dll را از مسیر FCKeditor.Net_2.6.3\bin\Release\2.0 فایل FCKeditor.Net_2.6.3.zip، در داخل پوشه Bin سایت خود کپی کنید.

FredCK.FCKeditorV2.dll در پوشه Bin

قدم بعدی افزودن Reference فایل FredCK.FCKeditorV2.dll به وب سایت است. برای اینکار بار دیگر روی وب سایت خود کلیک راست کرده و گزینه Add Reference را انتخاب کنید.

افزودن Reference فایل FredCK.FCKeditorV2.dll

از پنجره Add Reference برگه Browse را انتخاب کرده و سپس FredCK.FCKeditorV2.dll را از پوشه Bin انتخاب کنید.

Add Reference Dialog in ASP.NET

حالا می توانیم کنترل FCKeditor را به جعبه ابزار Visual Studio اضافه کنیم.

روی یکی از برگه های جعبه ابزار مثلاً General کلیک راست کرده و گزینه Choose Items را انتخاب کنید.

منوی Choose Item از ASP.NET Toolbox

در پنجره باز شده و در برگه NET Framework Components. روی دکمه Browse کلیک کرده و در مسیر پوشه Bin سایت خود، فایل FredCK.FCKeditorV2.dll را انتخاب کنید.

Choose Toolbox Items dialog in ASP.NET

بعد از تایید این پنجره آیکن کنترل FCKeditor را در پایین برگه ای که در جعبه ابزار انتخاب کرده اید، مشاهده خواهید کرد.

تنظیم FCKeditor برای بکارگیری در ASP.NET

فایل web.config سایت خود را باز کرده و در قسمت <appSettings> خ�� زیر را اضافه کنید:

<add key="UserFilesPath" value="~/UserFiles/" />

مسیر مشخص شده برای UserFilesPath به پوشه محل قرارگیری تصاویر و فایلهایی اشاره می کند که توسط ادیتور Upload می شوند. توصیه می کنم از همین مقدار پیش فرض برای نگهداری فایلهای خود استفاده کنید.

پوشه UserFiles را در ریشه سایت خود ساخته و مجوز (Permission) خواندن و نوشتن را به آن بدهید.

فایل fckconfig.js را از پوشه fckeditor در ریشه سایت باز کرده و خطوط زیر را در آن پیدا کنید:

var _FileBrowserLanguage	= 'php' ;	// asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage	= 'php' ;	// asp | aspx | cfm | lasso | perl | php | py

حال زبان php را به aspx تغییر دهید. یعنی:

var _FileBrowserLanguage	= 'aspx' ;	// asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage	= 'aspx' ;	// asp | aspx | cfm | lasso | perl | php | py

نکته

فایل fckconfig.js حاوی تنظیمات عمومی ادیتور FCKeditor، مانند حذف و اضافه کردن دکمه ها و امکانات آن است. هر گونه تغییری که در این فایل و یا فایلهای مشابه می دهید را به نوعی علامتگذاری کنید تا قسمتهای تغییر یافته برای اصلاحات احتمالی بعدی به راحتی پیدا شوند. بهترین کار گرفتن یک کپی پشتیبان از فایل fckconfig.js برای بازگرداندن تنظیمات به حالت پیش فرض در موارد خاص است.

فایل config.ascx را از مسیر fckeditor > editor > filemanager > connectors > aspx پیدا کرده و تابع زیر را در آن پیدا کنید:

 	private bool CheckAuthentication()
	{
		// ...
		return false;
	}

تا زمانی که این تابع مقدار False را باز می گرداند Administrator سایت امکان مشاهده و Upload کردن فایلها توسط ادیتور را نخواهد داشت. این تابع وظیفه اعتبار سنجی کاربری را که در حال کار با ادیتور است را بر عهده دارد. بدون این تابع هر کاربری می توانست فایل Upload کرده یا محتویات پوشه UserFiles را ببیند. احتمالاً تا اینجا سیستمی برای مدیریت و اعتبار سنجی کاربران سایت خود طراحی کرده اید. پس در این تابع به نوعی اعتبار و Administrator بودن کاربر جاری را چک کنید و در صورت صحت مقدار True را بازگردانید. مثالی برای تایید اعتبار کاربر جاری می تواند اینگونه باشد:

return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );

در حالیکه مقدار IsAuthorized Session هنگام Login کردن کاربر True شده است.

نکته

به هیچ وجه بدون اعتبار سنجی کاربر، مقدار True را باز نگردانید.

در نهایت در همین فایل خط زیر را پیدا کنید:

// URL path to user files.
		UserFilesPath = "/userfiles/";

مطمئن شوید که مقدار UserFilesPath معادل همان مقداری باشد که در web.config وارد کرده اید.

نکته

برای تنظیم مواردی که در منوی Style ادیتور FCKeditor لیست شده اند فایل fckstyles.xml را در ریشه پوشه fckeditor سایت پیدا و ویرایش کنید. کنترل و تنظیم دقیق خروجی های ادیتور برای حفظ ساختار استاندارد سایت حیاتی است. برای اطلاعات بیشتر مطلب "10 خصوصیت یک ادیتور تحت وب مناسب برای سایتهای استاندارد" را مطالعه کنید.

طریقه استفاده از FCKeditor

برای استفاده از این ادیتور دو راه وجود دارد:

  1. کشیدن و رها کردن کنترل FCKeditor از جعبه ابزار به صفحه.
  2. اضافه کردن کدهای لازم بصورت دستی به کد صفحه به صورت زیر:

رجیستر کردن کنترل FCKeditor در ابتدای صفحه:

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>

سپس افزودن تگ این ادیتور در داخل <"form runat="server>:

<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server"></FCKeditorV2:FCKeditor>

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

نکته

برای بدست آوردن محتوی ورودی کاربر در ادیتور از عبارت fCKeditorInstanceName.Value استفاده کنید. برای اطلاعات بیشتر محتویات پوشه samples_ را از فایل FCKeditor.Net_2.6.3.zip بررسی کنید.

نتیجه گیری

در این پست نحوه نصب، یکپارچه سازی و پیکربندی ادیتور FCKeditor، محبوب و پرکاربردترین ادیتور تحت وب که به همراه کنترل اختصاصی برای ASP.NET منتشر شده است را در 11 قدم مرور کردیم. در صورتیکه قسمتی از این مطلب نیاز به توضیح بیشتر دارد در قسمت نظرات مطرح کنید.

دریافت وب سایت نمونه

فایل ضمیمه شده حاوی وب سایتی است که در طی مراحل این مقاله برای استفاده از این ادیتور تنظیم کردیم. برای استفاده از آن، فایل فشرده شده را باز کرده و با اجرای Visual Studio و انتخاب File > Open > Web Site و یا ترکیب کلیدی Shift + Alt + O به یک سایت پیکربندی شده و آماده برای استفاده از ادیتور FCKeditor دسترسی خواهید داشت.

 همچنین بخوانید

نکته روز رویاگر را به سایت یا وبلاگ خود اضافه کنید

نکته روز رویاگر را به سایت یا وبلاگ خود اضافه کنید

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

طراحی منوهای متحرک بدون نیاز به فلش، بخش دوم: Markup و CSS

طراحی منوهای متحرک بدون نیاز به فلش، بخش دوم: Markup و CSS

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

طراحی منوهای متحرک بدون نیاز به فلش، بخش اول: تهیه منابع تصویری

طراحی منوهای متحرک بدون نیاز به فلش، بخش اول: تهیه منابع تصویری

احتمالاً شما به عنوان طراح سایت (نه بازدید کننده سایت!) از دیدن منوهای متحرک و زیبای سایتهای فلش لذت برده اید. بعد از آشنایی با استانداردهای وب متوجه خواهید شد که عناصر فلش بخاطر مشکلات دسترسی پذیری و موارد دیگر جای چندانی در طراحی یک وب سایت استاندارد ندارند. حال چگونه می توان بدون استفاده از فلش منوهایی متحرک طراحی کرد؟

کنترل عنوان و متا تگ های صفحه بصورت پویا

کنترل عنوان و متا تگ های صفحه بصورت پویا

عنوان صفحات و متا تگ ها از عناصر کلیدی مورد توجه موتورهای جستجو هستند. استفاده از Master Page در پروژه های ASP.net در نگاه اول مانعی برای استفاده از عناوین و متا تگ های مستقل برای هر صفحه است. اما با استفاده از چند دستور ساده می توانید کنترل کاملی روی این قسمت از صفحات پویای سایت خود داشته باشید.

بکارگیری FCKeditor در ASP.NET

بکارگیری FCKeditor در ASP.NET

این مطلب در رابطه با طریقه نصب، یکپارچه سازی و تنظیم ادیتور FCKeditor در ASP.NET بنا به درخواست یکی از دوستان سایت رویاگر است. در این مقاله بطور قدم به قدم چگونگی دریافت، نصب، یکپارچه سازی و تنظیم این ادیتور قدرتمند را به همراه تمام نکاتی که باید هنگام نصب و استفاده رعایت شوند را خواهیم آموخت. در صورتیکه از ادیتوری غیر از FCKeditor استفاده می کنید و یا به دنبال ادیتوری کامل و سازگار با وب استانداردها برای سایت خود هستید مطالعه این مطلب را به شما توصیه می کنم.

مشاهده همه یادداشت ها

 نظرات این مطلب

نظر شما

فرم ارسال نظر
کد
ارسال نظر

لیست نظرات

Max

Max

  • یکشنبه، 22 شهریور 1388
سلام .
با اينكه از عناصري كه به عنوان آبجكت به سايت اضافه ميشن ميونه ي خوبي ندارم اما هميشه فكر مي كردم از اين اديتور چطوري ميشه استفاده كرد . خيلي متشكرم .
در پناه خدا شاد و شادكام باشي.
راستي آدرس وبسايت رو فعلا از همين نظر بردار.
مصطفی مقدم

مصطفی مقدم

  • یکشنبه، 22 شهریور 1388
فکر می کنم حساب یک ادیتور رو باید از دیگر کامپوننت ها جدا کرد.

متشکر بابت آدرس.
حمیدرضا

حمیدرضا

  • شنبه، 28 شهریور 1388
سلام . آقای مقدم خیلی لطف کردی و زحمت کشیدی . واقعا جای بسی خوشحالیه که اشخاصی مثل شما ، دانسته هاشون رو با دیگران به اشتراک می ذارن .
ممنون رفتم برای دانلود .
محمد

محمد

  • پنجشنبه، 23 اردیبهشت 1389
سلام. من یک مشکلی واسه آپلود کردن فایل تو این ادیتور دارم. با اینکه config.js رو به aspx تغییر دادم اما باز هم error می ده که فایل config.php اجازه آپلود رو نمی ده.
مصطفی مقدم

مصطفی مقدم

  • یکشنبه، 26 اردیبهشت 1389
سلام،
بار دیگه فایلی که Upload کردید رو برای صحت تغییرات چک کنید.

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

علیرضا

  • یکشنبه، 17 مرداد 1389
سلام
واقعا سایت قشنگی طراحی کردین. جدی میگم
لینک نمونه سایت پست نوشته شده مشکلی دارد
نمیشه دانلودش کرد. ممنون.
اگه میشه نمونه رو برام میل کنین.
مصطفی مقدم

مصطفی مقدم

  • دوشنبه، 18 مرداد 1389
@ علیرضا:
سلام دوست عزیز، ممنونم بابت نظر لطفتون راجع به سایت.

لینک رو چک کردم و مشکلی نداشت، با اینحال براتون ایمیل می کنم.
مصطفی مقدم

مصطفی مقدم

  • دوشنبه، 18 مرداد 1389
@ علیرضا:
آدرس ایمیلی که مشخص کرده اید Valid نیست.
satari

satari

  • پنجشنبه، 13 آبان 1389
سلام
از مقاله مفیدتون خیلی ممنون . خیلی بدردم خورد. من در اجرا وقتی دکمه فهرست نمایی سرور رو میزنم(برای انتخاب عکس یا فلش) یه پنجره خطا باز میشه که چند خط اولش رو واستون می زارم :
The server did'nt send back a proper xml response. please contact your administrator.
XML request error:Intenal Server Error(500)
Request URL :
http://localhost:4728/FCKeditor/fckeditor/editor/filemanager/connectors/aspx/connector.aspx?Command=GetFolderAndFiles&Type=Image&CurrentFolder=%2F&uuid=12888
متشکر میشم اگر راهنماییم کنید .
درضمن واقعا سایت عالی و زیبایی دارید. تبریک میگم.
مصطفی مقدم

مصطفی مقدم

  • پنجشنبه، 13 آبان 1389
یه باره دیگه صحت استپ شماره 10 خودتونو چک کنید.
satari

satari

  • شنبه، 15 آبان 1389
واسه استپ ده کلا گذاشتم مقدار True برگردونه!!
مصطفی مقدم

مصطفی مقدم

  • شنبه، 15 آبان 1389
پیغامی که می گیرید باید مربوط به Authentication کاربر باشه. مراحل کار رو دوباره از اول دابل چک کنید.
.net programmer

.net programmer

  • چهارشنبه، 24 آذر 1389
سلا.شما آخرین نسخه ین ادیتو رو ندارید جایی آپلود کنید.متاسفانه من 1 ماه هست که میخوام دانلودش کنم اما میگه چون تو ایران هستم این اجازه رو ندارم.اگه اینکارو بکنید ممنون میشم
مصطفی مقدم

مصطفی مقدم

  • شنبه، 27 آذر 1389
@ net programmer:
آخرین نسخه این ادیتور برای پلت فرم .net تا الان نسخه 2.6.4 است که در 30 آگوست 2010 منتشر شده.

لینک دریافت فایل:
http://dl.dropbox.com/u/2505872/eDreamer/FCKeditor.Net_2.6.4.zip
امیر

امیر

  • پنجشنبه، 07 بهمن 1389
ممنون بابت توضیح.

لینک دانلود دومی هم ف..ر هست.

لطفا در 4shared و یا جایی مشابه، فایل اصلی و مخصوص دات نتش را آپلود کنید.
مصطفی مقدم

مصطفی مقدم

  • پنجشنبه، 07 بهمن 1389
فکر می کنم هنوز راهی برای دریافت فایل با وجود این شرایط وجود داره!
فروزش فرد

فروزش فرد

  • جمعه، 15 بهمن 1389
سلام
ممنون از راهنمایی شما
متاسفانه من تمام مراحل را مامل انجام می دهم ولی در اپ لود عکس خطای 500 می دهد
ehsan

ehsan

  • پنجشنبه، 05 آبان 1390
سلام ، شما میدونید که اصل ادیتور ورود میکروسافت رو چطور میشه در صفحه وب Asp.net بازکرد؟

ممنون - موفق باشید
nashenas

nashenas

  • جمعه، 06 آبان 1390
دوست عزيز خيلي زحمت كشيدي . اين كد جا افتاده بود . بدون اين خطا ميده .....

<appSettings>
<add key="FCKeditor:BasePath" value="~/FCKeditor/"/>
<add key="FCKeditor:UserFilesPath" value="~/UserFiles/"/>
</appSettings>
سیما

سیما

  • شنبه، 17 دی 1390
با تشکر هم چنین باید خصوصیت زیر را هم اضافه نماییم
:" BasePath="fckedito


<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" BasePath="fckeditor/ >
</FCKeditorV2:FCKeditor>
Hamed

Hamed

  • شنبه، 01 بهمن 1390
سلام
ممنون از مقاله پر محتواوکاربردیتان.سایت بسیار زیبایی هم طراحی کرده اید.
لینک نمونه سایت پست نوشته شده مشکلی دارد
نمیشه دانلودش کرد. ممنون.
اگه میشه نمونه رو برام ایمیل کنین.

با تشکر
احسان آراسته

احسان آراسته

  • دوشنبه، 03 بهمن 1390
سلام استاد
لطفاً وب فرم رو ترک کنید
مهشید امیراحمدی

مهشید امیراحمدی

  • دوشنبه، 15 اسفند 1390
با سلام، نمونه ای که گذاشته بودید رو چک کردم خطای 404 می دهد.لطفا من را راهنمایی کنید. با تشکر
پیمان

پیمان

  • شنبه، 28 مرداد 1391
دوستانی که با آپلود فایل مشکل دارن:
پس از دادن پرمیشن آپلود فایل در فایل config.ascx در همان فایل و در تابع SetConfig متغیر UserFilesPath که به این صورت مقدار گرفته "/userfiles/" را به این صورت اصلاح کنید:
UserFilesPath = "~/userfiles/";
علامت ~ رو برای آدرس دهی از ریشه به آدرس اضافه کنید.
ali

ali

  • دوشنبه، 30 بهمن 1391
سلام باید از شما تشکر کرد آموزش بسیار مفیدی بود یه خواهشی داشتم وقتی فایلی رو توسط این ویرایشگر آپلود میشه میره توی یه پوشه فرار میگیره و بعد مدیر اون مطلب رو پاک میکنه و عکس که آپلود شده پاک نمیشه این ویرایشگر توی مرورگر IE مشکل داره خطا جاوا اسکریپت میگیره خواهش میکنم قسمت آپلود عکس و حذف از اون مسیر رو توضیح بدین
سحر

سحر

  • دوشنبه، 09 اردیبهشت 1392
با سلام خيلي ممنون از مقالتون
من تمام كارهايي رو كه گفته بوديد انجام دادم اما موقع اجرا اين خطا رو ميده!
HTTP Error 404 - Not Found.
ميشه لطفا راهنمايي كنيد؟
مهدی

مهدی

  • شنبه، 08 تیر 1392
Edit BasePath of the FCKeditor Properties from /fckeditor/ to ~/fckeditor
نگار

نگار

  • شنبه، 20 اردیبهشت 1393
سلام... اولا خدا خیرت بده
دوماً : چجوری وقتی کاربر عکسی رو اینزرت کرد دیلیتش کنه !!!!!!
دکمه دیلیتم نداره که ؟؟؟؟
samira

samira

  • یکشنبه، 28 اردیبهشت 1393
سلام من همه این کار هارو انجام داد م ولی اررور میده
میثم

میثم

  • دوشنبه، 03 شهریور 1393
سلام.از مطالبی که رو سایت گذاشتین خیلی ممنون
میشه منو راهنمایی کنید که چطوری مجوز خواندن ونوشتن به یه پوشه رو بدم.
مصطفی مقدم

مصطفی مقدم

  • دوشنبه، 10 شهریور 1393
میثم عزیز،
برای تغییر مجوز یک پوشه می تونید از طریق قسمت File Manager کنترل پنل ساییتون یا برنامه FTP ای که استفاده می کنید اقدام کنید. در صورتیکه این قسمت رو پیدا نمی کنید با فردی که خدمات هاست رو براتون مهیا می کنه مشورت کنید.
مجید فراست

مجید فراست

  • دوشنبه، 03 آذر 1393
خیلی کامل و عالی و با سلیقه همه چیز را توضیح داده اید.
متشکرم
آرمان

آرمان

  • جمعه، 24 بهمن 1393
بسیار عالی و کاربردی
فرم جستجو
large desktopdesktoptabletphone © royagar.com