افزايش کيفيت مطالب ورودي به سايت

مقدمه

نقدي که ممکن است تا اينجا در مورد دروپال مطرح شود اين است که امکان استفاده از عکس در گره‌هاي سايت و کلا استفاده از متون غني وجود ندارد در حالي که به نظر انتخاب مناسب تري باشند. اما براي اين مسئله نيز HTML مي‌رسد از اين نظر صفحات راه‌حل‌هايي مطرح شده است: اکثر کاربران از ويرايشگرهايي استفاده مي‌کنند که مثل در اختيار کاربر قرار مي‌گيرد(شکل toolbar نرم‌افزارهاي پردازنده کلمه از طريق يک ). در اين بخش با يکي از محبوب‌ترين معماري‌هاي مديريت متون غني و کاربرد 11 - 1 عکس در مطلب آشنا خواهيد شد. دليل انتخاب ما هم سادگي، کاربردي‌بودن و محبوبيت فراوان آن است. همچنين در اين بخش با قراردادن عکس در قسمت‌هاي مختلف يک طراحي شده است) آشنا خواهيد شد. HTML گره(حتي متن آن که برپايه

با استفاده از اين ابزار، هرکاربري که اطلاعات مختصري از نحوه کار با پردازنده‌هاي کلمه داشته باشد، مي‌تواند به سايت مطلب وارد کند.

افزايش کيفيت مطالب ورودي به سايت با استفاده از متون و عکس‌هاي غني

آنچه در اين بخش خواهيد آموخت:

چگونگي تغيير قالب مطالب ورودي

و FCKeditor چگونگي استفاده از ويرايشگرهايي چون WYSIWYG با استفاده از ماژول TinyMCE

براي WYSIWYG و IMCE چگونگي استفاده از اضافه‌کردن عکس به مطالب سايت

فيلترکردن هيچ تاثيري در ورود داده به سايت ندارد بنابراين مهم نيست چه چيزي در متن گره‌هاي سايت تايپ کنيد. عمليات فيلترکردن زماني آغاز مي‌شود که مطلب آماده نمايش در سايت است.

خودتان امتحان کنيد

فيلترشده HTML در صفحات > img < استفاده از تگ‌هاي

اين مراحل را يک‌بار طي کنيد تا اين مسئله در سايت شما براي هميشه حل شود.

، پيکربندي سايت، قالب‌هاي ورودي Administer به بخش 11 - 2. طبق شکل 1 ) مراجعه کنيد. admin / settings / filters (

11 - 2 شکل

. روي کليد پيکربندي کنار فيلتري که مي‌خواهيد استفاده کنيد کليک کنيد تا صفحه‌اي 2 HTML باز شود و بتوانيد به ويرايش و پيکربندي آن فيلتر بپردازيد. صفحات 11 - 3 مشابه شکل فيلترشده جزو فيلتر پيش‌فرض است و همه نقش‌ها مي‌توانند از آن استفاده کنند بدون اينکه شما بتوانيد آن را تغيير دهيد. سپس روي کليد پيکربندي که در بالاي صفحه قرار دارد کليک کنيد.

11 - 1 شکل

متن غني يعني چه؟

اينجا مفهوم کلي اصطلاح متن غني مدنظر ماست: يعني متني که بتوان تغييراتي چون ) يا ساير قالب‌ها را بر آن اعمال کرد. italic فونت مايل (

در گره‌ها HTML فيلترکردن

صفحات وب معنادار URL براي HTML فيلترشده و فول HTML هردونوع صفحات فيلترشده، مي‌توانيد از امکاناتي چون HTML هستند اما در صورت استفاده از صفحات ها استفاده کنيد. اما براي اين anchor فونت مايل، تاکيد، برجسته‌کردن، ليست‌بندي و آشنا باشيد تا بتوانيد تگ‌هاي آغازين و پاياني هر المان را HTML کار بايد تاحدودي با فيلترشده حذف HTML در صفحات > img < تشخيص دهيد. نکته مهم‌تر اينکه تگ مي‌شود بنابراين امکان ندارد به آن عکس اضافه کرد. بنابراين شما بايد روش فيلترکردن صفحات را تغيير دهيد تا اين تگ حذف نشود. براي اين کار بايد از ماژول فيلتر استفاده آن را 11 - 1 کنيد که بخشي از هسته دروپال است و هميشه فعال است. طبق جدول پيکربندي کنيد.

11 - 5 شکل

WYSIWYG استفاده از متون غني به کمک

و FCKeditor در دروپال مي‌توانيد از ويرايشگرهاي مختلف استفاده کنيد که طراحي شده تا WYSIWYG محبوب‌ترين آنها هستند. اخيرا ماژولي به نام TinyMCE 11 - 2 به کاربران در امر ويرايش کمک کند. اين ماژول را دانلود و نصب کرده طبق جدول پيکربندي کنيد.

اين ماژول با اکثر ويرايشگرهاي رايج سازگار است. پس از نصب و فعال‌سازي، براي WYSIWYG، پيکربندي سايت، Administer به بخش 11 - 6 پيکربندي آن طبق شکل مراجعه کنيد.

11 - 6 شکل

11 - 3 شکل

) ليستي از تگ‌هاي مجاز در عمليات فيلترکردن وجود 11 - 4. در صفحه بعدي (شکل 3 دارد. تگ‌هاي زير را به آن اضافه کنيد(براي جداکردن تگ‌ها از هم، از فاصله استفاده کنيد). اين تگ‌ها براي پشتيباني از متون غني و استفاده از عکس در متن موردنياز هستند.

11 - 4 شکل

کليک کنيد تا تغييرات موردنظر ذخيره و اعمال شود. Save Configuration. روي کليد 4

). همان‌طور که مشخص است هر 11 - 2 سپس به صفحه قالب‌هاي ورودي برويد(شکل استفاده کند. براي حفظ امنيت HTML نقشي به طور پيش‌فرض نمي‌تواند از صفحات فول کليک کنيد تا صفحه‌اي مشابه HTML سايت روي لينک پيکربندي براي صفحات فول باز شود. نقش‌هايي که ايجاد کرده‌ايد را به اين قسمت اضافه کنيد. 11 - 5 شکل

شما مجبور نيستيد براي هرقالب يک ويرايشگر نصب کنيد. به عنوان مثال مي‌توانيد را تنها به يک نقش سايت اختصاص دهيد. چون چنين قالبي اجازه HTML قالب فول را روي آن قرار نخواهيد داد WYSIWYG هرعملياتي را به کاربر مي‌دهد شما ويرايشگر استفاده کنند به راحتي کار خود را پي بگيرند. HTML تا کاربراني که مي‌خواهند از قالب

پيکربندي WYSIWYG روي کليد ويرايش کليک کنيد تا بتوانيد آن ويرايشگر را براي کاملا مشخص است. 11 - 8 کنيد. تنظيمات پايه‌اي اين بخش در شکل

11 - 8 شکل

امکانات بيشتري FCKeditor را نشان داد اما ويرايشگر TinyMCE نحوه کار 11 - 1 شکل نصب آن چهره ناخوشايندي براي سايت شما درپي دارد. 11 - 9 دارد. اما طبق شکل

11 - 9 شکل

WYSIWYG ايجاد پروفايل‌هاي

اين ماژول به شما اجازه مي‌دهد براي هر قالب ورودي يک پروفايل بسازيد. در واقع اين پروفايل‌ها نشان‌دهنده نتيجه عمليات پيکربندي شما هستند.

پس از نصب اوليه، هيچ ويرايشگري انتخاب نشده نصب نشده است. اين ليستي از ويرايشگرهايي است که نياز داريد:

FCKeditor -

jWYSIWYG -

markItUp -

NicEdit -

openWYSIWYG -

TinyMCE -

Whizzywig -

WYMeditor -

YUI editor -

دستورالعمل‌هاي لازم 11 - 6 براي ويرايشگري که مي‌خواهيد استفاده کنيد، طبق شکل براي دانلود و نصب را انجام دهيد. به خاطر داشته باشيد که اين فايل‌ها به طور جداگانه در دايرکتوري دروپال نصب مي‌شوند. ممکن است شما بخواهيد براي اين کار در sites / all. / چند ساب‌دايرتوري ايجاد کنيد. شما مي‌توانيد چند ويرايشگر نصب کنيد library قسمت ولي تنها مي‌توانيد يکي از آنها را براي ويرايش يک قالب ورودي مورداستفاده قرار دهيد. کنيد تا شماره نسخه نصب‌شده را مشاهده کنيد. refresh پس از نصب ويرايشگر، صفحه را مي‌توانيد به انتخاب ويرايشگر در بالاي اين صفحه بپردازيد. 11 - 7 سپس طبق شکل

11 - 7 شکل

WYSIWYG به بخش پيکربندي، پيکربندي سايت، 11 - 12. طبق شکل 3 مراجعه کنيد. حالا مي‌توانيد قالب ورودي جديد را مشاهده کرده ويرايشگر مناسب براي آن را انتخاب کنيد.

براي WYSIWYG. تمام اين تنظيمات را ذخيره کنيد. حالا شما يک پروفايل 4 قالب ورودي خود ايجاد کرده‌ايد و مي‌توانيد گروهي مخصوص از کليدها را بدان اختصاص ) کليک کنيد، 11 - 12 (شکل WYSIWYG در صفحه Remove دهيد. اگر روي کليد پروفايل آن حذف شده قالب ورودي مربوط به آن باقي خواهد ماند.

11 - 13. اين قالب را به نقش‌هاي موردنظر خود اختصاص دهيد تا طبق شکل 5 کاربران بتوانند به انتخاب قالب‌هاي دلخواه خود بپردازند.

11 - 12 شکل

11 - 13 شکل

پيکربندي Plugins و Buttons مي‌توانيد اين مشکل را در قسمت 11 - 10 طبق شکل حل کنيد. بسته به نوع کاربران و متون سايت، مي‌توانيد برخي از اين کليدها را WYSIWYG حذف کنيد. البته ممکن است برخي کاربران همه کليدها را نياز داشته باشند بنابراين بهتر است يک قالب ورودي ديگر ايجاد کرده تمام کليدها را به ان اختصاص دهيد.

11 - 10 شکل

خودتان امتحان کنيد

ايجاد يک قالب ورودي جديد با کليدهاي ويرايش اختصاصي

. به بخش پيکربندي، پيکربندي سايت، قالب‌هاي ورودي مراجعه کنيد. روي کليد 1 در بالاي صفحه کليک کنيد. Add Input Format

) قالب ورودي جديد را نام‌گذاري کنيد. حالا شما 11 - 11. در صفحه بعدي(شکل 2 مي‌توانيد آن را به نقش‌هاي خاصي از سايت اختصاص داده فيلترهاي مختلف آن را مشخص فيلترشده HTML کليک کرده باشيد، تنظيمات HTML کنيد. اگر روي چک‌باکس فيلتر را نهايي خواهيد کرد.

11 - 11 شکل

11 - 16 شکل

افزودن عکس به گره‌ها

قبلا با نحوه افزودن عکس به مطالب مختلف سايت آشنا شديد ولي هنوز يک مشکل براي افزودن CCK پابرجاست: افزودن عکس به متن يک گره! گاهي استفاده از بخش‌هاي عکس به گره بهترين انتخاب است؛ مثل قراردادن عکس در مطالب يک سايت تجارت ها کاربران محل‌هاي مختلفي story الکترونيک. اما در مورد مطالبي چون بلاگ‌ها، مقالات و از متن را براي افزودن عکس انتخاب مي‌کنند.

IMCE و WYSIWYG راه‌اندازي

IMCE کار کند. ابزاري چون IMCE به راحتي مي‌تواند با WYSIWYG ماژول علاوه بر محبوبيت به راحتي به شما اجازه مي‌دهد عکس‌هاي مختلف خود را در سايت آپلود دانلود، نصب و فعال کنيد. 11 - 3 را طبق جدول IMCE کرده، استفاده کنيد. براي شروع

) پيکربندي 11 - 14 با نهايي‌کردن تنظيماتي چون تنظيمات ظاهري ويرايشگر، (شکل را کامل کنيد. WYSIWYG پروفايل

11 - 14 شکل

مشخص است را 11 - 15 معمولا کاربران گزينه‌هاي حذف موارد اضافه که در شکل تغيير نمي‌دهند.

11 - 15 شکل

را نهايي‌ کنيد. فقط به خاطر CSS مي‌توانيد تنظيمات 11 - 16 درنهايت طبق شکل داشته باشيد قبل از ترک صفحه تمام تغييرات را ذخيره کنيد.

11 - 18 شکل

با استفاده از پروفايل‌ها کاربران مي‌توانند در سرورسايت، عکس آپلود کنند پس بهتر است تنظيمات پروفايل را چک کنيد تا سوء‌استفاده‌اي از سرور سايت صورت نگيرد. شکل نمونه‌اي از يک پروفايل ويرايش‌شده را نشان مي‌دهد. 11 - 19

11 - 19 شکل

به خاطر داشته باشيد مي‌توان تنظيمات هرپروفايل را به پروفايل ديگر منتقل کرد. مهم‌ترين قسمت مشخص است. اين تنظيمات مربوط به اندازه و تعداد فايل‌هايي است که 11 - 19 تنظيمات در شکل که به کاربر اصلي اختصاص مي‌يابد، محدوديت کمتري دارد. شکل 1 مي‌توان آپلود کرد. پروفايل کاربر- قسمت تعيين دايرکتوري‌هاي کاربران سايت را نشان مي‌دهد. شما مي‌توانيد سه دايرکتوري 11 - 20 مشخص کنيد که هرکدام مجوزها و ساب‌دايرکتوري‌هاي مختلفي داشته باشند.

استفاده مي‌کنيد، بايد TinyMCE و ويرايشگر WYSIWYG درکنار IMCE اگر از

دانلود، نصب و فعال کنيد. 11 - 4 را طبق جدول WYSIWYG IMCE API Bridge

هم شما مي‌توانيد پروفايل‌هاي جديد بسازيد و آنها را به نقش‌هاي IMCE در مورد، Administer بايد به بخش 11 - 17 خاص اختصاص دهيد. براي اين کار طبق شکل مراجعه کنيد. IMCE (. admin/settings/imce پيکربندي سايت، (

11 - 17 شکل

تنظيمات قسمت پايين اين صفحه به شما اجازه مي‌دهد آپلودها و 11 - 18 طبق شکل ها را کنترل کنيد. با مراجعه به پروفايل‌ها مي‌توانيد بيشتر آنها را شخصي کنيد. thumbnail

11 - 22 شکل

کليک کنيد. بدين‌ترتيب کليد IMCE و image شما بايد روي چک‌باکس‌هاي فعال مي‌شود. IMCE شما قرار مي‌‌گيرد و toolbar در image

استفاده از تصاوير

، ويرايشگر و WYSIWYG مي‌توانند از فيلتر عبور کنند و > img < حالا که تگ‌هاي ) راه‌اندازي شده‌اند، شما مي‌توانيد کار خود را آغاز کنيد. با استفاده IMCE ماژول تصوير (مثل مشاهده toolbar يک گره جديد بسازيد. در بالاي صفحه نيز يک Create Content از کليد اگر روي چک‌باکس تصوير کليک کرده باشيد با کليک روي 11 - 23 خواهيد کرد. طبق شکل براي تصوير انتخاب کنيد. URL مي‌توانيد يک toolbar کليد تصوير در

11 - 23 شکل

11 - 20 شکل

اگر هرسه دايرکتوري را انتخاب کنيد و پروفايل را ذخيره کنيد، رديف‌هاي خالي بيشتري در صفحه بعد خواهيد داشت. براي تعيين مسير دايرکتوري مي‌توانيد از در کنار شناسه کاربر استفاده کنيد. رايج است که به هرکاربر سايت، يک دايرکتوري و براي کاربراني که باهم کار مي‌کنند يک دايرکتوري اشتراکي اختصاص يابد. درنهايت اطلاعات مربوط به مشخص است، به شما اجازه مي‌دهد براي آنها نام و 11 - 21 که در شکل thumbnail ابعاد انتخاب کنيد. سپس کاربران مي‌توانند نمونه دلخواه را انتخاب کنند اما نمي‌توانند آنها را تغيير دهند.

11 - 21 شکل

و پروفايل‌هاي آن، يک مرحله ديگر باقيست تا به افزودن عکس IMCE پس از پيکربندي WYSIWYG پروفايل‌هاي Plugins و Buttons به مطالب سايت بپردازيد. حالا بخش 11 - 22 دارد که در قسمت پايين سمت راست شکل IMCE يک چک‌باکس جديد براي کاملا مشخص است.

11 - 26 شکل

استفاده کنيد مي‌توانيد اندازه تصوير را تغيير دهيد. thumbnail اگر نمي‌خواهيد از حالت مي‌توانيد از اندازه واقعي تصوير يا ايجاد يک تصوير جديد استفاده کنيد. 11 - 27 طبق شکل

11 - 27 شکل

يک تصوير را انتخاب کرده آن را به ويرايشگر 11 - 28 آخرين کليد به شما اجازه مي‌دهد طبق شکل مي توانيد از گزينه پيش‌نمايش استفاده کنيد تا نحوه FCKeditor خود منتقل کنيد. در ويرايشگر نمايش متن و تصوير را چک کنيد. معمولا کاربران از حالت نمايش تصوير در چپ استفاده مي‌کنند.

مقايسه کنيد. 11 - 23 فعال شده است. اين شکل را با شکل IMCE 11 - 24 در شکل

11 - 24 شکل

، يک پنجره جديد باز مي‌شود تا شما بتوانيد تصاوير موجود IMCE پس از فعال‌کردن کليک کنيد Upload در سرور را مشاهده کنيد. براي آپلود هر تصوير مي‌توانيد روي کليد ). 11 - 25 تا تصوير از روي کامپيوتر شما در سرور سايت آپلود شود(شکل

11 - 25 شکل

براي Thumbnails در اين بخش مي‌توانيد از کليد 11 - 26 همچنين طبق شکل انتخاب هريک از تصاوير استفاده کنيد.

به هم مي‌ريزد. براي عيب‌يابي، به نمايش صفحه مشکل‌دار از طريق مرورگر خود پرداخته استفاده کنيد. متن مشکل‌دار را HTML براي مشاهده متن View Source از دستور يافته سعي کنيد مشکل آن را برطرف کنيد. براي حل مشکل نيز مي‌توانيد همان متن را در فضاي ويرايشگر کپي HTML يا در حالت غيرفعال گزينه HTML بدون پشتيباني از کنيد. بدين‌ترتيب تمام قالب‌بندي‌ها حذف خواهد شد. سپس تنها متن را در ويرايشگر کپي کنيد و از قالب‌بندي موردنظر خود استفاده کنيد. اين راه‌حل معمولا WYSIWYG موثر است.

کارگاه

امتحان

سوال

را کنترل و مديريت کرد؟ WYSIWYG. چگونه مي‌توان ويرايشگرهاي 1

چه تفاوتي بين چک‌باکس تصوير WYSIWYG. در مورد پروفايل‌ها و کليدهاي 2 وجود دارد؟ IMCE و چک‌باکس

فيلترشده حذف مي‌شود؟ HTML. چه زماني 3

جواب

مي‌پردازيد تا براي هر قالب ورودي (مثل WYSIWYG. شما به پيکربندي 1 فيلترشده) از يک ويرايشگر مخصوص استفاده کند. همچنين مي‌توانيد قالب‌هاي HTML ورودي جديد بسازيد تا کاربران بتوانند از ويرايشگرهاي مختلف استفاده کنند.

URL مخصوص، pop - up. تصوير به شما اجازه مي‌دهد از طريق يک منوي 2 را فعال کرده باشيد، مي‌توانيد يک فايل را IMCE را مشخص کنيد. اگر > img < المان آپلود کرده و سرور را براي يافتن فايل به‌کاررفته در سايت جستجو کنيد. در صورتي که از استفاده نکنيد، بايد آدرس آن را تايپ کنيد. IMCE

. اين نوع متن هرگز از متن گره اصلي پاک نمي‌شود. تنها به هنگام نمايش متن، 3 حذف مي‌شود. HTML متن

فعاليت‌ها

از کساني که ممکن است در سايت فعال باشند بپرسيد چه ويرايشگرهاي اي نياز دارند. اين نکته کوچک ولي بسيار کاربردي است. همچنين درمورد WYSIWYG هاي سايت تصميم‌گيري کنيد تا سايت شما منسجم و جذاب باشد. thumbnail اندازه

11 - 28 شکل

خلاصه

در اين بخش با افزودن ماژول‌هاي متن و تصوير آشنا شديد. با اين روش مي‌توانيد از درآوريد. ماژول HTML امکانات مختلف ويرايش متن استفاده کنيد يا متن را به حالت به شما اجازه مي‌دهد تصاوير مختلف را آپلود کرده محل قرارگيري آنها را مشخص IMCE را به سرعت WYSIWYG و IMCE کنيد. بسياري از کاربران دروپال ابزارهايي چون نصب و فعال مي‌کنند تا از امکانات آنها استفاده کنند. بدين‌ترتيب کار کاربران نهايي هم آسان‌تر خواهد بود.

سوال و جواب

دارد؟ CCK ImageField چه تفاوتي با IMCE ماژول سوال:

به طور مستقيم با CCK ImageField مهم‌ترين تفاوت آنها اين است که جواب: کار نمي‌کند. همچنين اگر مي‌خواهيد از تصوير در متن گره استفاده WYSIWYG ماژول هم CCK بهترين انتخاب است. اما با استفاده از WYSIWYG درکنار IMCE کنيد مي‌توان محل قرارگيري عکس‌هاي مختلف را تنظيم کرد و هم پروسه قرارگيري تصاوير در سايت را اتوماتيک کرد. شما مي‌توانيد از هردو معماري در سايت خود استفاده کنيد.

چند متن را ويرايش کردم اما به هنگام نمايش WYSIWYG من با استفاده از سوال: آنها با مشکلاتي مواجه شدم. چه اتفاقي افتاده است؟

نيست. HTML مهم‌ترين مشکل اين است که متن به‌کاررفته در گره، جواب: مي‌پردازند به هنگام نمايش گره کار HTML قالب‌هاي ورودي که به فيلترکردن متون خود را آغاز مي‌کنند. بنابراين احتمالا شما يک متن قالب‌بندي‌شده را در فضاي گره کپي پيچيده است. مثلا در متوني که از شماره‌گيري HTML کرده‌ايد، و مشخصات آن براي در آنها استفاده شده است، تنها يک اشتباه (کسر يک شماره يا فاصله) نظم کل مطلب را