چه باید بدانیم
- برو به Insert > Form > فرم. روی خط قرمز نقطه چین روی فرم کلیک کنید و به Insert > Form > List/Menu بروید. گزینه‌های دسترس‌پذیری را انتخاب کنید.
- روی منو کلیک کنید و ویژگی های آن را انتخاب کنید، سپس List values را برای افزودن آیتم های جدید منو انتخاب کنید. برای افزودن موارد بیشتر روی علامت کلیک کنید.
- مقادیر مورد را اضافه کنید و یک مورد پیش فرض را انتخاب کنید. برای افزودن کنش‌ها، به Insert > Form > Jump Menu بروید. موارد را به منوی پرش اضافه کنید و ذخیره کنید.
Dreamweaver ایجاد منوهای کشویی برای وب سایت شما را آسان می کند. اما مانند همه فرم‌های HTML، آنها می‌توانند کمی مشکل باشند. این آموزش شما را در مراحل ایجاد یک منوی کشویی در Dreamweaver راهنمایی می کند.
منوهای پرش Dreamweaver
Dreamweaver 8 همچنین یک جادوگر برای ایجاد یک منوی پرش برای پیمایش در وب سایت شما فراهم می کند. برخلاف منوهای کشویی اولیه، این منو پس از اتمام کار، کاری را انجام می دهد. برای به کار انداختن فرم کشویی خود نیازی به نوشتن هیچ جاوا اسکریپت یا CGI نخواهید داشت. این آموزش همچنین نحوه استفاده از جادوگر Dreamweaver 8 را برای ایجاد یک منوی پرش توضیح می‌دهد.
ابتدا، فرم را ایجاد کنید
به جز جادوگرهای خاص مانند منوی پرش، Dreamweaver به شما کمک نمی کند تا فرم های HTML را "کار" کنید. برای این کار به CGI یا جاوا اسکریپت نیاز دارید.
هنگامی که یک منوی کشویی به وب سایت خود اضافه می کنید، اولین چیزی که نیاز دارید فرمی است که آن را احاطه کند. در Dreamweaver، به منوی Insert بروید و روی Form کلیک کنید، سپس "Form" را انتخاب کنید.
نمایش فرم در نمای طراحی
Dreamweaver موقعیت فرم شما را به صورت بصری در نمای طراحی نشان می دهد، بنابراین می دانید عناصر فرم خود را کجا قرار دهید زیرا تگ های منوی کشویی خارج از عنصر فرم معتبر نیستند (و کار نمی کنند). همانطور که در تصویر می بینید، فرم خط قرمز رنگ در نمای طراحی است.
انتخاب فهرست/منو
منوهای کشویی در Dreamweaver آیتم های "list" یا "menu" نامیده می شوند. بنابراین برای افزودن یکی به فرم خود، باید به منوی Form در منوی Insert رفته و "List/Menu" را انتخاب کنید. مطمئن شوید که مکان نما شما در خط قرمز نقطه چین کادر فرم شما قرار داشته باشد.
پنجره گزینه های ویژه
در گزینه‌های Dreamweaver، صفحه‌ای روی Accessibility وجود دارد. اگر این پنج گزینه را پر کنید، فوراً منوهای کشویی شما بیشتر از سایر وب سایت ها قابل دسترسی خواهند بود.
دسترسی به فرم
گزینه های دسترسی عبارتند از:
Label
فیلد برچسب به عنوان متن در کنار عنصر فرم شما نشان داده می شود. یک نام برای منوی کشویی خود وارد کنید. این می تواند یک سوال یا عبارت کوتاه باشد که منوی کشویی به آن پاسخ خواهد داد.
Style
HTML شامل یک برچسب برچسب برای شناسایی برچسب های فرم شما در مرورگر وب است. انتخاب شما این است که منوی کشویی و متن برچسب را با تگ بپیچید، از ویژگی "for" در برچسب برچسب برای تشخیص اینکه به کدام تگ فرم ارجاع می دهد استفاده کنید، یا اصلا از برچسب برچسب استفاده نکنید.
موقعیت
می توانید برچسب خود را قبل یا بعد از منوی کشویی قرار دهید.
کلید دسترسی
بازدیدکنندگان می توانند از یک کلید دسترسی با کلیدهای "تصویر" یا گزینه برای رفتن مستقیم به آن فیلد فرم استفاده کنند. این میانبر صفحه کلید استفاده از فرم های شما را بدون ماوس بسیار آسان می کند. alt="
فهرست برگه
فهرست برگه نحوه دسترسی کاربران به فیلدهای فرم هنگام استفاده از صفحه کلید به برگه در صفحه وب است.
وقتی گزینه‌های دسترس‌پذیری خود را به‌روزرسانی کردید، روی تأیید کلیک کنید.
انتخاب منو
وقتی منوی کشویی خود را در نمای طراحی Dreamweaver نمایش دادید، باید عناصر مختلف را اضافه کنید. ابتدا منوی کشویی را با کلیک بر روی آن انتخاب کنید. Dreamweaver یک خط نقطه چین دیگر را در اطراف منوی کشویی قرار می دهد تا نشان دهد شما آن را انتخاب کرده اید.
ویژگی های منو
منوی خواص به لیست/منو ویژگی های آن منوی کشویی تغییر می کند. در آنجا می‌توانید به منوی خود یک شناسه بدهید (جایی که می‌گوید "انتخاب")، تصمیم بگیرید که می‌خواهید یک لیست باشد یا یک منو، یک کلاس سبک از شیوه نامه خود به آن بدهید و مقادیری را به فهرست کشویی اختصاص دهید.
تفاوت بین فهرست و منو چیست؟
Dreamweaver یک منوی کشویی را به هر منوی کشویی که فقط یک انتخاب را اجازه می دهد فرا می خواند. یک "فهرست" امکان انتخاب های متعدد را در منوی کشویی فراهم می کند و می تواند بیش از یک مورد بالا باشد.
اگر می خواهید یک منوی کشویی دارای چندین خط باشد، آن را به یک نوع "فهرست" تغییر دهید و کادر "انتخاب ها" را علامت نزنید.
افزودن موارد فهرست جدید
برای افزودن آیتم های جدید به منوی خود، روی دکمه "List values…" کلیک کنید که پنجره بالا باز می شود. سپس، برچسب کالای خود را در کادر اول تایپ کنید. در صفحه نمایش داده می شود.
افزودن موارد بیشتر و سفارش مجدد
برای افزودن موارد بیشتر روی نماد مثبت کلیک کنید. اگر می‌خواهید آنها را دوباره در کادر فهرست مرتب کنید، از فلش‌های بالا و پایین سمت راست استفاده کنید.
به همه اقلام ارزش بدهید
اگر مقدار را خالی بگذارید، برچسب به فرم می رود. اما می توانید به همه موارد خود مقادیری بدهید - برای ارسال اطلاعات جایگزین به فرم خود. شما از این برای مواردی مانند منوهای پرش و پیوند دادن زیاد استفاده خواهید کرد.
انتخاب پیش‌فرض
صفحات وب به‌طور پیش‌فرض هر مورد کشویی را که ابتدا به‌عنوان مورد پیش‌فرض فهرست شده است، نمایش می‌دهند. اما اگر می‌خواهید مورد دیگری انتخاب شود، آن را در کادر "Initially Selected" در منوی Properties برجسته کنید.
لیست خود را در نمای طراحی ببینید
هنگامی که ویرایش ویژگی ها تمام شد، Dreamweaver لیست کشویی شما را با مقدار پیش فرض انتخاب شده نشان می دهد.
فهرست خود را در نمای کد مشاهده کنید
اگر به نمای کد بروید، می بینید که Dreamweaver منوی کشویی شما را با کد تمیز اضافه می کند. تنها ویژگی های اضافی گزینه های دسترسی هستند. همه کدها تورفتگی دارند و خواندن و درک آن بسیار آسان است.
ذخیره و مشاهده در مرورگر
اگر سند را ذخیره کنید و آن را در یک مرورگر وب مشاهده کنید، می بینید که منوی کشویی شما دقیقاً همان چیزی است که انتظار دارید.
اما هیچ کاری نمی کند…
منویی که در بالا ایجاد کردیم خوب به نظر می رسد، اما هیچ کاری انجام نمی دهد. برای اینکه آن را وادار به انجام کاری کنید، باید یک اقدام فرم را روی خود فرم تنظیم کنید.
خوشبختانه، Dreamweaver یک فرم منوی کشویی داخلی دارد که می توانید بلافاصله در سایت خود بدون نیاز به یادگیری در مورد فرم ها، CGI ها یا اسکریپت استفاده کنید. به آن منوی پرش می‌گویند.
منوی پرش Dreamweaver یک منوی کشویی با نام‌ها و آدرس‌های اینترنتی تنظیم می‌کند. سپس می‌توانید یک مورد را در منو انتخاب کنید، و صفحه وب به آن مکان منتقل می‌شود، درست مانند زمانی که روی یک پیوند کلیک کرده باشید.
به منوی Insert بروید و Form و سپس Jump Menu را انتخاب کنید.
پنجره منوی پرش
برخلاف منوی کشویی استاندارد، منوی پرش پنجره جدیدی را برای شما باز می کند تا آیتم های منوی خود را نامگذاری کنید و جزئیات مربوط به نحوه کار فرم را اضافه کنید.
برای اولین مورد، متن "un titled1" را به آنچه می خواهید بخواند تغییر دهید و یک URL اضافه کنید.
اضافه کردن موارد به منوی پرش
برای افزودن یک آیتم جدید به منوی پرش خود، روی آیتم افزودن کلیک کنید. هر تعداد مورد را که می خواهید اضافه کنید.
گزینه های منوی پرش
وقتی همه پیوندهای مورد نظر خود را اضافه کردید، باید گزینه های خود را انتخاب کنید:
باز کردن URL ها در
اگر یک مجموعه فریم دارید، می توانید پیوندها را در فریم دیگری باز کنید. یا می‌توانید گزینه پنجره اصلی را به یک هدف خاص تغییر دهید تا URL در یک پنجره جدید یا هر جای دیگر باز شود.
نام منو
به منوی خود یک شناسه منحصربفرد برای صفحه بدهید. برای اینکه اسکریپت به درستی کار کند لازم است. همچنین به شما امکان می دهد چندین منوی پرش را در یک فرم داشته باشید - همه آنها را نام های مختلف بگذارید.
درج دکمه Go بعد از منو
دوست دارم این را انتخاب کنم زیرا گاهی اوقات با تغییر منو اسکریپت کار نمی کند. همچنین در دسترس‌تر است.
انتخاب اولین مورد پس از تغییر URL
اگر درخواستی مانند "انتخاب یکی" به عنوان اولین آیتم منو دارید، این را انتخاب کنید. این تضمین می کند که آن مورد در صفحه به طور پیش فرض باقی بماند.
نمایش طراحی منوی پرش
درست مانند اولین منوی شما، Dreamweaver منوی پرش شما را در نمای طراحی با آیتم پیش فرض قابل مشاهده تنظیم می کند. سپس می توانید منوی کشویی را مانند سایر موارد ویرایش کنید.
اگر آن را ویرایش می کنید، مطمئن شوید که هیچ شناسه ای را روی موارد تغییر ندهید. در غیر این صورت، اسکریپت ممکن است کار نکند.
منو پرش در مرورگر
ذخیره فایل و فشار دادن F12 صفحه را در مرورگر دلخواه شما نمایش می دهد. در آنجا می‌توانید گزینه‌ای را انتخاب کنید، روی «برو» کلیک کنید و منوی پرش کار می‌کند.
