מה צריך לדעת
- עבור אל Insert > Form > Form. לחץ על הקו האדום המקווקו בטופס ועבור אל Insert > Form > List/Menu. בחר אפשרויות נגישות.
- לחץ על התפריט ובחר את המאפיינים שלו, ולאחר מכן בחר ערכים רשימה כדי להוסיף פריטי תפריט חדשים. לחץ על סימן הפלוס כדי להוסיף פריטים נוספים.
- הוסף ערכי פריט ובחר פריט ברירת מחדל. כדי להוסיף פעולות, עבור Insert > Form > Jump Menu. הוסף פריטים לתפריט Jump ושמור.
Dreamweaver מקל על יצירת תפריטים נפתחים עבור האתר שלך. אבל כמו כל טפסי HTML, הם יכולים להיות קצת מסובכים. מדריך זה ידריך אותך בשלבים ליצירת תפריט נפתח ב-Dreamweaver.
Dreamweaver Jump Menus
Dreamweaver 8 מספק גם אשף ליצירת תפריט קפיצה לניווט באתר האינטרנט שלך. שלא כמו תפריטים נפתחים בסיסיים, התפריט הזה יעשה משהו כשתסיים. לא תצטרך לכתוב JavaScript או CGI כדי לגרום לטופס הנפתח שלך לעבוד. מדריך זה גם מסביר כיצד להשתמש באשף Dreamweaver 8 כדי ליצור תפריט קפיצה.
תחילה, צור את הטופס
למעט אשפים מיוחדים כמו תפריט הקפיצה, Dreamweaver לא עוזר לך לגרום לטפסי HTML "לעבוד". לשם כך, אתה צריך CGI או JavaScript.
כאשר אתה מוסיף תפריט נפתח לאתר האינטרנט שלך, הדבר הראשון שאתה צריך הוא טופס שיקיף אותו. ב-Dreamweaver, עבור לתפריט הוספה ולחץ על טופס, ולאחר מכן בחר "טופס."
טופס מוצג בתצוגת עיצוב
Dreamweaver מציג את מיקום הטופס שלך באופן ויזואלי בתצוגת העיצוב, כך שאתה יודע היכן לשים את רכיבי הטופס שלך מכיוון שתגיות התפריט הנפתח אינן חוקיות (ולא יעבדו) מחוץ לאלמנט הטופס. כפי שניתן לראות בתמונה, הטופס הוא הקו המקווקו האדום בתצוגת העיצוב.
בחר רשימה/תפריט
תפריטים נפתחים נקראים פריטי "רשימה" או "תפריט" ב-Dreamweaver. אז כדי להוסיף אחד לטופס שלך, עליך להיכנס לתפריט טופס בתפריט הוספה ולבחור "רשימה/תפריט". ודא שהסמן שלך נמצא בתוך הקו המקווקו האדום של תיבת הטופס שלך.
חלון אפשרויות מיוחדות
באפשרויות Dreamweaver, יש מסך על נגישות. התפריטים הנפתחים שלך יהיו נגישים מיד יותר מאתרים אחרים אם תמלא את חמש האפשרויות האלה.
נגישות טופס
אפשרויות הנגישות הן:
Label
שדה התווית מופיע כטקסט לצד רכיב הטופס שלך. הקלד שם עבור התפריט הנפתח שלך. זו יכולה להיות שאלה או ביטוי קצר שהתפריט הנפתח יענה עליהן.
סגנון
HTML כולל תג תווית לזיהוי תוויות הטופס שלך לדפדפן האינטרנט. האפשרויות שלך הן לעטוף את התפריט הנפתח ואת טקסט התווית בתג, להשתמש בתכונה "for" בתג התווית כדי לזהות לאיזה תג טופס הוא מפנה, או לא להשתמש בכלל בתג התווית.
Position
תוכל למקם את התווית שלך לפני או אחרי התפריט הנפתח.
מפתח גישה
מבקרים יכולים להשתמש במפתח גישה עם מקשי "תמונה" או Option כדי להגיע ישירות לשדה הטופס הזה. קיצור מקשים זה הופך את הטפסים שלך לקלים מאוד לשימוש ללא עכבר. alt="
Tab Index
אינדקס הכרטיסיות הוא האופן שבו משתמשים צריכים לגשת לשדות הטופס כשהם משתמשים במקלדת כדי לעבור דרך דף האינטרנט.
כשתעדכנת את אפשרויות הנגישות שלך, לחץ על אישור.
בחר את התפריט
לאחר שהתפריט הנפתח שלך יוצג בתצוגת העיצוב של Dreamweaver, עליך להוסיף את האלמנטים השונים. ראשית, בחר בתפריט הנפתח על ידי לחיצה עליו. Dreamweaver ישים קו מקווקו נוסף רק סביב התפריט הנפתח כדי להראות שבחרת בו.
תפריט נכסים
תפריט המאפיינים ישתנה למאפייני הרשימה/תפריט עבור אותו תפריט נפתח. שם אתה יכול לתת לתפריט שלך מזהה (שם כתוב "בחר"), להחליט אם אתה רוצה שזה יהיה רשימה או תפריט, לתת לו מחלקה בסגנון מגיליון הסגנונות שלך, ולהקצות ערכים לתפריט הנפתח.
מה ההבדל בין רשימה לתפריט?
Dreamweaver קורא לתפריט נפתח לכל תפריט נפתח המאפשר רק בחירה אחת. "רשימה" מאפשרת אפשרויות מרובות בתפריט הנפתח ויכולה להיות גבוהה יותר מפריט אחד.
אם אתה רוצה שתפריט נפתח יהיה בגובה של מספר שורות, שנה אותו לסוג "רשימה" והשאיר את התיבה "בחירות" לא מסומנת.
הוסף פריטי רשימה חדשים
כדי להוסיף פריטים חדשים לתפריט שלך, לחץ על הלחצן "רשימה ערכי…", אשר פותח את החלון שלמעלה. לאחר מכן, הקלד את תווית הפריט שלך בתיבה הראשונה. זה יוצג בדף.
הוסף עוד וסדר מחדש
לחץ על סמל הפלוס כדי להוסיף פריטים נוספים. אם ברצונך לסדר אותם מחדש בתיבת הרשימה, השתמש בחצים למעלה ולמטה בצד ימין.
תן ערכים לכל הפריטים
אם תשאיר את הערך ריק, התווית תעבור לטופס. אבל אתה יכול לתת לכל הפריטים שלך ערכים - לשלוח מידע חלופי לטופס שלך. אתה תשתמש בזה הרבה לדברים כמו תפריטי קפיצה והיפר-קישורים.
בחר ברירת מחדל
ברירת המחדל של דפי אינטרנט מציגים את הפריט הנפתח שמופיע ראשון כפריט ברירת המחדל. אבל אם אתה רוצה לבחור אחד אחר, סמן אותו בתיבה "נבחר לראשונה" בתפריט המאפיינים.
ראה את הרשימה שלך בתצוגת עיצוב
לאחר שתסיים לערוך את המאפיינים, Dreamweaver יציג את הרשימה הנפתחת שלך עם ערך ברירת המחדל שנבחר.
ראה את הרשימה שלך בתצוגת קוד
אם תעבור לתצוגת קוד, תוכל לראות ש-Dreamweaver מוסיף את התפריט הנפתח שלך עם קוד נקי. התכונות הנוספות היחידות הן אפשרויות הנגישות. הקוד כולו מחורר וקל מאוד לקריאה והבנה.
שמור והצג בדפדפן
אם אתה שומר את המסמך ומציג אותו בדפדפן אינטרנט, אתה יכול לראות שהתפריט הנפתח שלך נראה בדיוק כפי שהיית מצפה ממנו.
אבל זה לא עושה כלום…
התפריט שיצרנו למעלה נראה בסדר, אבל הוא לא עושה כלום. כדי לגרום לזה לעשות משהו, עליך להגדיר פעולת טופס בטופס עצמו.
למרבה המזל, ל-Dreamweaver יש טופס תפריט נפתח מובנה שבו אתה יכול להשתמש באופן מיידי באתר שלך מבלי שתצטרך ללמוד על טפסים, CGIs או סקריפטים. זה נקרא תפריט Jump.
The Dreamweaver Jump Menu מגדיר תפריט נפתח עם שמות וכתובות URL. לאחר מכן תוכל לבחור פריט בתפריט, ודף האינטרנט יעבור למיקום זה, בדיוק כמו אם לחצת על קישור.
עבור לתפריט הוספה ובחר טופס ולאחר מכן תפריט Jump.
חלון תפריט קפיצה
בניגוד לתפריט הנפתח הרגיל, התפריט Jump פותח חלון חדש שבו תוכל לתת שם לפריטי התפריט שלך ולהוסיף פרטים על אופן הפעולה של הטופס.
עבור הפריט הראשון, שנה את הטקסט "ללא כותרת1" למה שאתה רוצה שהוא יקרא והוסף כתובת URL.
הוסף פריטים לתפריט הקפיצה שלך
לחץ על הוסף פריט כדי להוסיף פריט חדש לתפריט הקפיצה שלך. הוסף כמה פריטים שתרצה.
אפשרויות תפריט קפיצה
לאחר שהוספת את כל הקישורים שאתה רוצה, עליך לבחור את האפשרויות שלך:
פתח כתובות אתרים ב
אם יש לך ערכת מסגרות, אתה יכול לפתוח את הקישורים במסגרת אחרת. או שאתה יכול לשנות את האפשרות של חלון ראשי למטרה מיוחדת כך שכתובת האתר תיפתח בחלון חדש או במקום אחר.
שם התפריט
תן לתפריט שלך מזהה ייחודי לדף. זה נדרש כדי שהתסריט יפעל כהלכה. זה גם מאפשר לך לקבל מספר תפריטי קפיצה בצורה אחת - תן לכולם שמות שונים.
Insert Go Button After Menu
אני אוהב לבחור את זה כי לפעמים התסריט לא עובד כשהתפריט משתנה. זה גם נגיש יותר.
בחר פריט ראשון לאחר שינוי כתובת אתר
בחר זאת אם יש לך הנחיה כגון "בחר אחד" בתור פריט התפריט הראשון. זה יבטיח שהפריט הזה יישאר כברירת מחדל בדף.
תצוגת עיצוב בתפריט קפיצה
בדיוק כמו בתפריט הראשון שלך, Dreamweaver מגדיר את תפריט הקפיצה שלך בתצוגת עיצוב עם פריט ברירת המחדל גלוי. לאחר מכן תוכל לערוך את התפריט הנפתח כמו כל תפריט אחר.
אם אתה עורך אותו, הקפד לא לשנות שום מזהה על הפריטים; אחרת, ייתכן שהתסריט לא יעבוד.
תפריט קפיצה בדפדפן
שמירת הקובץ והקשה על F12 תציג את הדף בדפדפן המועדף עליך. שם אתה יכול לבחור אפשרות, לחץ על "עבור", ותפריט הקפיצה פועל.
