השתמש בנושא זה כדי ללמוד כיצד להשתמש ב-Property inspector לעריכת קוד בתצוגת Design ב-Adobe Dreamweaver.
Dreamweaver מאפשר ליצור ולערוך דפי אינטרנט בצורה חזותית מבלי לדאוג לגבי קוד המקור הבסיסי, אבל יש מקרים שבהם ייתכן שתצטרכו לערוך את הקוד כדי לקבל שליטה גדולה יותר או כדי לפתור בעיות בדף האינטרנט שלכם. Dreamweaver מאפשר לערוך קוד מסוים תוך כדי עבודה בתצוגת Design.
החלק הזה מיועד לאנשים שמעדיפים לעבוד בתצוגת Design, אבל רוצים גם גישה מהירה לקוד.
בחירת תגים בנים בתצוגת Design
אם תבחרו אובייקט בתצוגת Design שמכיל תגיות צאצא – לדוגמה, טבלת HTML – תוכלו לבחור במהירות את תגית הצאצא הראשונה של האובייקט הזה על ידי בחירה ב-Edit > Select Child.
פקודה זו זמינה רק בתצוגת Design.
לדוגמה, לתגית <table> יש בדרך כלל תגיות צאצא <tr>. אם תבחרו תגית <table> בבורר התגיות, תוכלו לבחור את השורה הראשונה בטבלה על ידי בחירה ב-'Edit' > 'Select Child'.Dreamweaver בוחר את התגית <tr> הראשונה בבורר התגיות. מכיוון שלתגית <tr> עצמה יש תגיות צאצא, כלומר תגיות <td>, בחירה ב-Edit > Select Child שוב בוחרת את התא הראשון בטבלה.
עריכת קוד ב-Property inspector
תוכלו להשתמש בבקר המאפיינים כדי לבדוק ולערוך את המאפיינים של טקסט או של אובייקטים בדף שלכם. המאפיינים שמוצגים בבקר המאפיינים בדרך כלל מתאימים למאפיינים של תגיות; שינוי מאפיין בבקר המאפיינים בדרך כלל משפיע באותה מידה כמו שינוי המאפיין המתאים בתצוגת Code.
בקר התגיות ובקר המאפיינים מאפשרים לצפות ולערוך את המאפיינים של תגית. בקר התגיות מאפשר לצפות ולערוך כל מאפיין הקשור לתגית נתונה. בקר המאפיינים מציג רק את המאפיינים הנפוצים ביותר, אבל מספק סט עשיר יותר של פקדים לשינוי הערכים של המאפיינים האלה, ומאפשר לערוך אובייקטים מסוימים (כמו עמודות בטבלה) שלא מתאימים לתגיות ספציפיות.
בקר המאפיינים עבור הטקסט או האובייקט מופיע מתחת לחלון המסמך. אם בקר המאפיינים לא מוצג, בחרו ב-Window > Properties.
עריכת CFML ב-Property inspector
השתמשו בבקר המאפיינים כדי לבדוק ולשנות סימון ColdFusion בתצוגת Design.
לחצן Content מופיע רק אם התגית שנבחרה לא ריקה (כלומר, אם יש לה גם תגית פתיחה וגם תגית סגירה).
סקירה של Quick Tag Editor
אתם משתמשים בעורך התגיות המהיר כדי לבדוק, להכניס ולערוך תגיות HTML במהירות מבלי לעזוב את תצוגת Design.
אם תכתבו HTML לא תקין בעורך התגיות המהיר, Dreamweaver מנסה לתקן אותו עבורכם על ידי הוספת מרכאות סגירה וסוגריים זוויתיים סוגרים במקומות הנדרשים.
כדי להגדיר את אפשרויות עורך התגיות המהיר, פתחו את עורך התגיות המהיר על ידי לחיצה על Control-T (Windows) או Command-T (Macintosh).
ל-Quick Tag Editor יש שלושה מצבים:
- מצב Insert HTML משמש להוספת קוד HTML חדש.
- מצב Edit Tag משמש לעריכת תג קיים.
מצב Insert HTML משמש להוספת קוד HTML חדש.
מצב Edit Tag משמש לעריכת תג קיים.
מצב Wrap Tag משמש לעטיפת הקטע הנוכחי שבחרת בתג חדש.
המצב בו Quick Tag Editor נפתח תלוי בבחירה הנוכחית בתצוגת Design.
בכל שלושת המצבים, ההליך הבסיסי לשימוש ב-Quick Tag Editor הוא זהה: פתח את העורך, הזן או ערוך תגים ותכונות ולאחר מכן סגור את העורך.
ניתן לעבור בין המצבים בהקשת Control+T (Windows) או Command+T (Macintosh) כאשר Quick Tag Editor פעיל.
עריכת קוד עם Quick Tag Editor
השתמש ב-Quick Tag Editor (Edit > Quick Tag Editor) כדי להוסיף ולערוך במהירות תגי HTML מבלי לצאת מהתצוגה Design.
הוספת תג HTML
Quick Tag Editor נפתח במצב Insert HTML.
התגית מוכנסת לקוד שלכם, יחד עם תגית סגירה מתאימה אם רלוונטי.
עריכת תג HTML
באפשרותכם גם לבחור את התג שתרצו לערוך מבורר התגים בתחתית חלון המסמך. למידע נוסף, ראו עריכת קוד עם בורר התגים.
Quick Tag Editor נפתח במצב Edit Tag.
כברירת מחדל, השינויים מוחלים על המסמך כשאתם לוחצים Tab או Shift+Tab.
עיטוף הבחירה הנוכחית עם תגי HTML
אם תבחר טקסט או אובייקט הכוללים תג HTML פותח או סוגר, Quick Tag Editor ייפתח במצב Edit Tag ולא במצב Wrap Tag.
Quick Tag Editor נפתח במצב Wrap Tag.
התג מוכנס בתחילת הבחירה הנוכחית, ותג סגירה תואם מוכנס בסוף.
שימוש בתפריט הרמזים בעורך התגים המהיר
עורך התגים המהיר כולל תפריט רמזים למאפיינים המציג את כל המאפיינים החוקיים של התג שאתם עורכים או מכניסים.
באפשרותכם גם לבטל את תפריט הרמזים או להתאים את העיכוב לפני שהתפריט מופיע בעורך התגים המהיר.
כדי לראות תפריט רמזים המציג מאפיינים חוקיים לתג, עצרו לזמן קצר בזמן עריכת שם מאפיין בעורך התגים המהיר. מופיע תפריט רמזים, המציג את כל המאפיינים החוקיים לתג שאתם עורכים.
באופן דומה, כדי לראות תפריט רמזים המציג שמות תגים חוקיים, עצרו לזמן קצר בזמן הזנה או עריכה של שם תג בעורך התגים המהיר.
העדפות רמזי הקוד של עורך התגים המהיר נשלטות על ידי העדפות רמזי הקוד הרגילות. למידע נוסף, ראו הגדרת העדפות רמזי קוד.
החל להקליד שם של תג או תכונה. הבחירה בתפריט רמזי הקוד קופצת לפריט הראשון המתחיל באותיות שהקלדתם.
השתמש במקשי החצים למעלה ולמטה כדי לבחור בפריט.
השתמש בסרגל הגלילה כדי לאתר פריט.
ביטול תפריט הרמזים או שינוי העיכוב לפני הופעתו
תיבת הדו-שיח Code Hints Preferences מופיעה.
עריכת קוד עם בורר התגים
ניתן להשתמש בבורר התגים כדי לבחור, לערוך או להסיר תגים מבלי לצאת מהתצוגה Design. בורר התגים ממוקם בשורת המצב שבתחתית החלון Document ומציג סדרת תגים.
עריכה או מחיקה של תג
התגיות שחלות בנקודת ההוספה מופיעות בבורר התגיות.
בחרו אובייקט המותאם לתגית
התגיות שחלות בנקודת ההוספה מופיעות בבורר התגיות.
האובייקט שהתג מייצג נבחר בדף.
השתמשו בטכניקה זו כדי לבחור שורות טבלה בודדות (תגיות tr) או תאים (תגיות td).
כתיבה ועריכת תסריטים בתצוגת Design view
ניתן לעבוד עם JavaScript ו-VBScript בצד הלקוח בתצוגת Code ובתצוגת Design, בדרכים הבאות:
כתבו תסריט JavaScript או VBScript לדף שלכם מבלי לעזוב את תצוגת Design.
צרו קישור במסמך שלכם לקובץ תסריט חיצוני מבלי לעזוב את תצוגת Design.
ערכו תסריט מבלי לעזוב את תצוגת Design.
לפני שתתחילו, בחרו View > Visual Aids > Invisible Elements כדי לוודא שסמני התסריט מופיעים בדף.
כתיבת סקריפט בצד הלקוח
בחר Insert > HTML > Script.
בחר את קובץ הסקריפט בחלון הבחירה בקובץ.
אין צורך לכלול את תגי הסקריפט הפותחים והסוגרים.
תג סקריפט של הקובץ שנבחר מתווסף למסמך.
עריכת סקריפט
הסקריפט מופיע בתיבת הדו-שיח Script Properties.
אם קישרתם לקובץ סקריפט חיצוני, הקובץ נפתח בתצוגת קוד, שם תוכלו לעשות את העריכות שלכם.
אם יש קוד בין תגיות התסריט, תיבת הדו-שיח Script Properties נפתחת גם אם יש גם קישור לקובץ תסריט חיצוני.
לחץ על סמל התיקייה או על הלחצן Browse כדי לבחור קובץ, או הקלד את הנתיב.
עריכת תסריטים בצד השרת של ASP בתצוגת Design
השתמשו ב-Property inspector של תסריט ASP כדי לבחון ולשנות תסריטים בצד השרת של ASP בתצוגת Design.
עריכת סקריפטים בדף באמצעות ה-Property inspector
אם אתם משתמשים ב-JavaScript ואינכם בטוחים בגרסה, בחרו JavaScript במקום JavaScript1.1 או JavaScript1.2.
(אופציונלי) בתיבה Source, ציין קובץ סקריפט חיצוני שיש אליו קישור. לחץ על סמל התיקייה כדי לבחור קובץ, או הקלד את הנתיב.
שימוש בהתנהגויות של JavaScript
תוכלו לצרף בקלות התנהגויות JavaScript (לצד לקוח) לאלמנטים של העמוד באמצעות הכרטיסייה Behaviors של Tag inspector. לפרטים נוספים, ראו יישום התנהגויות JavaScript מובנות ב-Dreamweaver.
פריטים דומים נוספים
בניית אתרי אינטרנט יפהפיים ב-Dreamweaver
עיצוב כתיבת קוד וניהול אתרי אינטרנט דינמיים בכלי רב עוצמה כולל.