אתה לא צריך להשתמש רק WYSIWYG
Dreamweaver הוא עורך WYSIWYG נהדר, אבל אם אתה לא מעוניין לכתוב דפי אינטרנט בסביבת "מה שאתה רואה זה מה שאתה מקבל", אתה עדיין יכול להשתמש Dreamweaver כי זה גם עורך טקסט נהדר. אבל יש הרבה תכונות כי להחליק על ידי דרכים בתוך עורך קוד Dreamweaver כי המוקד העיקרי הוא על "תצוגת עיצוב" או עורך WYSIWYG חלק של המוצר.
כיצד להיכנס תצוגת קוד
אם מעולם לא השתמשת ב- Dreamweaver כעורך HTML לפני שייתכן שאף לא הבחנת בשלושת הכפתורים בחלק העליון של הדף: "קוד", "פיצול" ו"עיצוב ". Dreamweaver מופעל כברירת מחדל במצב "תצוגת עיצוב" או במצב WYSIWYG. אבל קל לעבור להצגה ועריכה של קוד ה- HTML. פשוט לחץ על "קוד" כפתור. לחלופין, עבור לתפריט תצוגה ובחר "קוד".
אם אתה רק לומד כיצד לכתוב HTML או שברצונך לקבל מושג כיצד השינויים שלך ישפיעו על המסמך שלך, תוכל לפתוח את תצוגת הקוד ותצוגת העיצוב בו-זמנית. היופי של שיטה זו היא שאתה יכול לערוך בשני חלונות גם כן. כך שתוכל לכתוב את הקוד עבור תג התמונה ב- HTML ולאחר מכן להשתמש בתצוגת עיצוב כדי להעביר אותו למיקום אחר בדף באמצעות גרירה ושחרור.
כדי להציג את שתי האפשרויות בבת אחת, או:
- לחץ על כפתור "פיצול" (בין "קוד" ו "עיצוב")
- בתפריט תצוגה, בחר "קוד ועיצוב"
כאשר אתה מרגיש בנוח להשתמש ב- Dreamweaver כדי לערוך את קוד ה- HTML שלך, באפשרותך לשנות את ההעדפות שלך לפתיחת Dreamweaver בתצוגת הקוד כברירת מחדל. הדרך הקלה ביותר היא לשמור את תצוגת הקוד כמרחב עבודה. Dreamweaver ייפתח בסביבת העבודה האחרונה שבה השתמשת. אם זה לא, פשוט עבור לתפריט חלון, ובחר את סביבת העבודה הרצויה.
אפשרויות תצוגת קוד
Dreamweaver הוא כל כך גמיש כי יש כל כך הרבה דרכים להתאים אותו ולהפוך אותו עובד כמו שאתה רוצה את זה. בחלון האפשרויות, יש צביעת קוד, עיצוב קוד, רמזים לקוד ואפשרויות לשחזור קוד שניתן לשנות. אבל אתה יכול גם לשנות כמה אפשרויות מיוחדות בתוך להציג את הקוד עצמו.
ברגע שאתה בתצוגת קוד, יש כפתור "הצג אפשרויות" בסרגל הכלים. ניתן גם להציג את האפשרויות על ידי כניסה לתפריט תצוגה ובחירה באפשרות "אפשרויות תצוגת קוד". האפשרויות הן:
- Word Wrap - עוטפת את קוד ה- HTML כך שתוכל להציג אותו מבלי לגלול אופקית. שים לב כי אפשרות זו אינה מכניסה את כל החזרות המרכבה בקוד שלך, היא רק מציגה את הקוד כך שיהיה קל יותר לקריאה.
- מספרי שורות - מציג מספרי שורות לאורך צידו. זה מראה סמל לעטוף שורה עבור שורות לעטוף יותר מחלון התצוגה.
- תווים נסתרים - מציג תווים מיוחדים במקום רווח לבן שיוצג בדף אינטרנט. כגון נקודה מחליפה מקום, שברון כפול מחליף כל לשונית, ו pilcrow או סימן סעיף מחליף כל שורה הפסקה.
- הדגש קוד לא חוקי - מדגיש HTML שגוי בצהוב. אם אתה בוחר את התג הצהוב, מפקח המאפיינים ייתן לך רמזים על איך לתקן את זה.
- תחביר צביעה - מפעיל או מבטל את קידוד הצבע של הקוד שלך. באפשרותך לשנות את הצבעים של קידוד הצבע בקטע צביעת הקוד בהעדפות.
- Auto Indent (כניסה אוטומטית) - גורם להכנסת הקוד באופן אוטומטי לאחר החזרת גררה, אם הקוד שמעליה הוא מזויף. באפשרותך לשנות את גודל הכניסה על-ידי שינוי גודל הכרטיסייה בקטע עיצוב הקוד בהעדפות.
עריכת קוד HTML בתצוגת קוד
קל לערוך קוד HTML בתצוגת הקוד של Dreamweaver. פשוט התחל להקליד את ה- HTML שלך. אבל Dreamweaver מספק לך כמה תוספות להרחיב אותו מעבר עורך HTML בסיסי. כאשר אתה מתחיל לכתוב תג HTML, אתה מקליד <. אם תשהה מיד אחרי תו זה, Dreamweaver יראה לך רשימה של תגי HTML . אלה נקראים רמזים לקוד. כדי לצמצם את הבחירה, התחל להקליד אותיות - Dreamweaver יקטין את הרשימה הנפתחת לתג שמתאים למה שאתה מקליד.
אם אתה משתמש ב- HTML, תוכל לגלול ברשימה של תגי HTML ולבחור בתגים שונים כדי לראות מה הם עושים. Dreamweaver ימשיך להציג בפניך תכונות לאחר הקלדת תג. לדוגמה, אם תקליד ".
אך רמזים לקוד אינם מסתיימים בתגים. ניתן להשתמש ברמזים לקוד כדי להוסיף:
אם רמזים לקוד לא מופיעים, אתה יכול להכות Ctrl-spacebar (Windows) או Cmd-spacebar (Macintosh) כדי להציג אותם. הסיבה הנפוצה ביותר לכך שרמז קוד לא מופיע היא אם עברת לחלון אחר לפני שתסיים את התג. כי Dreamweaver הוא keying את הקלדת הדמות <, אם אתה עוזב את החלון ולחזור, תצטרך להפעיל מחדש את רמזים קוד.
אתה יכול לכבות את תפריט רמזים קוד על ידי להכות את מקש הבריחה.
לאחר שתקליד את תג ה- HTML הפותח, יהיה עליך לסגור אותו. Dreamweaver עושה את זה בצורה טבעית. אם תקליד את האפשרות 'סגור תגים' המתאימה ביותר לצרכיך.
אם אינך מוכן לעבור לעריכת הדפים שלך ב- HTML, אך ברצונך לצפות בקוד כפי שנכתב, עליך לנסות את מפקח הקוד. פעולה זו פותחת את קוד ה- HTML בחלון נפרד. זה עובד בדיוק כמו להציג קוד, ולמעשה, הוא בעצם חלון תצוגה קוד להסרה של המסמך הנוכחי. כדי לפתוח את מפקח הקוד, עבור לתפריט חלון ובחר "קוד מפקח" או להכות את מקש F10 במקלדת.
Dreamweaver יהיה לעצב קוד HTML עם זאת אתה רוצה את זה מוצג. לדוגמה, אם אתה משתמש בשלושה מרחבים כדי להיכנס, אך לעולם לא להזין תגי IMG, באפשרותך לציין את פרטי העיצוב באפשרויות של שכתוב קוד. לאחר מכן, עבור לתפריט פקודות ובחר 'החל עיצוב מקור'. זוהי דרך מצוינת לקבל קוד נכתב על ידי מישהו אחר לתוך פורמט מוכר לך.
תכונה כי רבים coders HTML לא יודע על או לא להשתמש היא היכולת לכווץ קוד HTML. פעולה זו אינה מסירה את התגים מהמסמך, אלא רק מסירה אותם מהתצוגה כדי שלא יסיחו את דעתם על מה אתה עובד. כדי לכווץ את הקוד שלך:
- בחר את קטע הקוד שברצונך להסתיר
- בתפריט עריכה, בחר באפשרות "כווץ בחירה" מתפריט המשנה "כווץ קוד"
דרך קלה יותר היא לבחור את הקוד ולאחר מכן ללחוץ על סמלי התמוטטות הקוד המופיעים בתעלת הביוב. אתה יכול גם לחץ לחיצה ימנית על הקוד הנבחר ובחר "כווץ בחירה".
אם אתה רוצה להסתיר הכל מלבד מה מודגש, בחר "כווץ בחוץ הבחירה" בכל אחת מהשיטות לעיל.
כדי להרחיב קוד מכווץ, פשוט לחץ לחיצה כפולה על זה. פעולה זו פותחת את הקוד ובחירה בו. לאחר מכן תוכל להעביר את הבחירה או למחוק אותה או להוסיף תגים נוספים מסביב לה.
תוכל להשתמש בתכונה קריסה והרחבה כל הזמן בדפים שבהם אינך רוצה לערוך את התבנית החיצונית. אתה פשוט לבחור את אזור התוכן שברצונך לערוך ולהתמוטט בחוץ. לאחר מכן כתוב את ה- HTML שלך. עדיין ניתן להציג את הדף בתצוגת Design או להציג אותו בתצוגה מקדימה בדפדפן. הקוד שקרס אינו מוסר מהמסמך, פשוט מוסתר מהעין. אתה יכול גם להשתמש בו כאשר אתה עובד על סדרה של פריטים. לאחר שסיימת אחת, לכווץ אותה. אתה יודע שאתה עושה את זה כאשר אין קוד מוצג.