סביבת העבודה של Dreamweaver‏

הצטרפות ל-Dreamweaver‏

לאחר התקנת Dreamweaver, כאשר אתם מפעילים את היישום בפעם הראשונה, מופיע על המסך תפריט QuickStart ששואל שלוש שאלות המסייעות להתאים את סביבת העבודה של Dreamweaver לצרכים שלכם.

בהתבסס על התשובות לשאלות אלו, Dreamweaver נפתח ב-Workspace למפתחים (פריסה מינימליסטית המתמקדת בקוד), או ב-Workspace סטנדרטי (פריסה מפוצלת עם כלים חזותיים ותצוגה מקדימה ביישום תוך כדי הקידוד). 

לאחר בחירת סביבת עבודה, תוכל לבחור ערכת צבעים שמתאימה לך. לאחר מכן תוכלו להתחיל.

מסך Home משופר

מסך הבית ב-Dreamweaver מעניק לכם גישה מהירה לקבצים האחרונים שבהם השתמשתם, לסוגי קבצים ולתבניות התחלה.

בהתאם למצב המנוי, מרחב העבודה Start עשוי גם להציג תוכן שמותאם לדרישות שלכם.

Dreamweaver מציג את מסך הבית בעת ההפעלה או כאשר אין מסמכים פתוחים.

אפשרויות בחוויית Start של Dreamweaver

לחצו על Learn לקבלת גישה מיידית לערכות הלימוד של Dreamweaver מהמסך הזה.

התחילו ליצור מסמכים ב-Dreamweaver על ידי לחיצה על כל אחד מסוגי הקבצים המוצגים.

פתחו אחת מתבניות ההתחלה המגיעות עם Dreamweaver. 

לחצו על Home כדי לחזור למסך ההתחלה. 

באפשרותך להציג את הקבצים האחרונים שעבדת עליהם במסך הפתיחה. אם אין לכם קבצים אחרונים, הכרטיסייה הזו ריקה.

ניתן גם להשתמש בפונקציונליות החיפוש באמצעות הסמל Search בפינה הימנית העליונה של מסך זה. כאשר אתם מקלידים שאילתת חיפוש, היישום מציג את הקבצים האחרונים שלכם, נכסי Creative Cloud, קישורי עזרה ותמונות Stock המתאימות לשאילתת החיפוש.

ניתן ללחוץ על Create New כדי להתחיל ליצור קבצי Dreamweaver חדשים. אם כבר יש קבצים במערכת שלך, לחץ על Open. למידע אודות יצירה ופתיחה של מסמכים ב-Dreamweaver, ראו Create and open files.

סקירה של סביבת העבודה

מרחב העבודה של Dreamweaver מאפשר לצפות במסמכים ובמאפייני אובייקטים. מרחב העבודה גם ממקם פקודות לרוב הפעולות הנפוצות בסרגלי כלים, כך שניתן להכניס במהירות שינויים במסמכים.

סקירה של רכיבי מרחב העבודה

ה-Workspace כולל את הרכיבים הבאים:

נמצא בחלק העליון של חלון היישום וכולל מחלף Workspace, תפריטים (Windows בלבד), ופקדי יישום נוספים.

כולל לחצנים המספקים אפשרויות לתצוגות שונות של חלון ה-Document (כגון תצוגת Design, תצוגת Live ותצוגת Code).

להצגת סרגל הכלים Standard, בחר Windows >‏ Toolbars >‏ Standard. סרגל הכלים כולל לחצנים לפעולות נפוצות מהתפריטים File ו-Edit: New, Open, Save, Save All, Print Code, Cut, Copy, Paste, Undo ו-Redo.

נמצא בצד השמאלי של חלון היישום וכולל לחצנים ספציפיים לתצוגה.

מציג את המסמך הנוכחי שאתה בונה ועורך.

מאפשר להציג ולשנות מגוון מאפיינים של האובייקט או הטקסט שנבחר. לכל אובייקט יש מאפיינים שונים.

נמצא בשורת Status בחלקו התחתון של חלון Document. מציג את עץ התגים המקיפים את הבחירה הנוכחית. לחץ על תג כלשהו בעץ התגים כדי לבחור בתג זה ובכל התוכן שהוא כולל.

מסייעות לך לפקח על עבודתך ולשנות אותה. לדוגמה, החלונית Insert, החלונית CSS Designer והחלונית Files. להרחבת חלונית, לחץ פעמיים על כרטיסיית החלונית.

מאפשרת לך להעלות ולהציג את קובצי ה-PSD שלך ב-Creative Cloud. באמצעות לוח זה, תוכלו לחלץ CSS, טקסט, תמונות, גופנים, צבעים, מעברי צבע ומדידות מקבצי PSD שלכם אל המסמך.

כוללת לחצנים להוספת אובייקטים מסוגים שונים למסמך, כגון תמונות, טבלאות ורכיבי מולטימדיה. כל אובייקט הוא קטע HTML המאפשר להגדיר תכונות שונות בזמן הוספתו למסמך. לדוגמה, ניתן להוסיף טבלה בלחיצה על הלחצן Table בחלונית Insert. אם אתה מעדיף זאת, תוכל להוסיף אובייקטים מתפריט Insert במקום מהחלונית Insert.

מאפשרת לנהל קבצים ותיקיות, בין שהם חלק מאתר של Dreamweaver או נמצאים בשרת מרוחק. החלונית Files אף מאפשרת לגשת לכל הקבצים בדיסק המקומי. למידע נוסף, ראו ניהול קבצים ותיקיות.

מאפשרת לשמור מחדש גזירי קוד ולהשתמש בהם בדפי אינטרנט שונים, אתרים שונים והתקנות שונות של Dreamweaver (באמצעות הגדרות סנכרון). למידע נוסף, ראה שימוש מחדש בקוד עם גזירי קוד.

הוא CSS Property Inspector המאפשר ליצור "חזותית" סגנונות CSS, קבצים ולהגדיר מאפיינים, יחד עם שאילתות מדיה.

סקירה של החלון Document

החלון Document מציג את המסמך הנוכחי. כדי לעבור בין תצוגות של המסמך, השתמשו באפשרויות התצוגה בסרגל הכלים של המסמך. 

אתם יכולים גם לעבור בין תצוגות באמצעות אפשרויות התצוגה בתפריט View.

מציגה ייצוג ריאליסטי יותר של תצוגת המסמך בדפדפן, ומאפשרת ליצור אינטראקציה עם המסמך ממש כמו בדפדפן. ניתן לבצע עריכה של רכיבי HTML ישירות ב-Live View וכן לראות באופן מיידי תצוגה מקדימה של השינויים באותה תצוגה. למידע נוסף אודות עריכה בתצוגת Live, ראו Edit HTML elments in Live View.

סביבת עיצוב לפריסת עמוד חזותית, לעריכה חזותית ולפיתוח יישומים מהיר. בתצוגה זו, Dreamweaver מציג ייצוג חזותי מלא הניתן לעריכה של המסמך, בדומה למה שתראה כשתציג את הדף בדפדפן.

הוא סביבת קידוד ידנית לכתיבה ועריכה של HTML,‏ JavaScript וכל סוג אחר של קוד.

הוא גרסה מחולקת של תצוגת Code שמאפשרת לכם לגלול כדי לעבוד על קטעים שונים של המסמך בו זמנית. 

מאפשר לכם לראות גם תצוגת Code וגם תצוגת Live עבור אותו המסמך בחלון יחיד.

מאפשר לכם לראות גם תצוגת Code וגם תצוגת Design עבור אותו המסמך בחלון יחיד.

מציג את הקוד בפועל שבו הדפדפן משתמש כדי להפעיל את הדף, ויכול להשתנות באופן דינמי כאשר אתם מתקשרים עם הדף בתצוגת Live.

כשחלון Document מוגדל לגודל המרבי (אפשרות ברירת המחדל), מוצגות כרטיסיות בחלקו העליון של חלון Document המציגות את שמות הקבצים של כל המסמכים הפתוחים. Dreamweaver מציג כוכבית אחרי שם הקובץ אם ביצעתם שינויים שעדיין לא שמרתם.

Dreamweaver גם מציג את סרגל הכלים Related Files מתחת לכרטיסיית המסמך (או מתחת לשורת הכותרת של המסמך, אם אתה מעיין במסמכים בחלונות נפרדים). מסמכים קשורים הם מסמכים המשויכים לקובץ הנוכחי, כגון קובצי CSS וקובצי JavaScript. כדי לפתוח אחד מקבצים קשורים אלה בחלון Document, לחץ על שם הקובץ הרצוי בסרגל הכלים Related Files.

מעבר בין תצוגות

השתמש בסרגל הכלים Document כדי לעבור בין התצוגות השונות במהירות. למידע נוסף, ראו סקירת סרגל כלים המסמך.

אתם יכולים גם להחליף בין תצוגות באמצעות האפשרויות הבאות בתפריט View:

• תצוגת Code בלבד: בחרו Code
• תצוגה מחולקת: בחרו Split ובחרו באחת מאפשרויות החלוקה
• מצב תצוגה: החליפו בין תצוגות ה-Live וה-Design
• החלפת תצוגות: כדי להחליף תצוגות מתצוגה אחת לאחרת.

תצוגה מדורגת, הצגה באריחים או סידור מחדש של חלונות מסמך

אם יש מספר חלונות פתוחים בבת אחת, ניתן להציגם בצורה מדורגת או באריחים.

כדי לערוך חלונות מסמך במדרגות: בחרו Window > Arrange > Cascade.

כדי לסדר חלונות מסמך באריחים:

• (Windows) בחרו Window > Arrange > Tile Horizontally או Tile Vertically.
• (Macintosh) בחרו Window > Arrange >Tile.

כשפותחים יותר מקובץ אחד, חלונות המסמכים מוצגים ככרטיסיות. כדי לסדר מחדש את חלונות המסמכים המוצגים ככרטיסיות, גרור כרטיסיית חלון למיקום חדש בקבוצה.

שינוי גודל של חלון מסמך

שורת המצב מציגה את המידות הנוכחיות של חלון Document (בפיקסלים). לעיצוב עמוד הנראה באופן הטוב ביותר בגודל מסוים, ניתן להתאים את חלון Document לכל אחד מהגדלים המוגדרים מראש, לערוך גדלים מוגדרים מראש אלה או ליצור גדלים חדשים.

בעת השינוי של גודל התצוגה של העמוד בתצוגת Design או Live, רק הממדים של גודל התצוגה משתנים. גודל המסמך אינו משתנה.

בנוסף לגדלים קבועים מראש ומותאמים אישית, Dreamweaver גם מפרט גדלים שצוינו בשאילתת מדיה. בעת הבחירה בגודל התואם לשאילתת מדיה, Dreamweaver משתמש בשאילתת המדיה כדי להציג את הדף. ניתן גם לשנות את כיוון הדף כדי להציג תצוגה מקדימה שלו עבור התקנים ניידים, שבהם פריסת הדף משתנה בהתאם לאופן ההחזקה של ההתקן.

כדי לשנות את גודל חלון המסמך, בחרו אחד מהגדלים מתפריט הקופץ Window Size בחלק התחתון של חלון המסמך.

גודל החלון המוצג משקף את המידות הפנימיות של חלון הדפדפן, ללא גבולות. גודל הצג או ההתקן הנייד מופיע מימין.

שינוי הערכים המוצגים בתפריט הנפתח Window Size

הוספת גודל חדש לתפריט הנפתח Window Size

סקירה של סרגל הכלים Document

סרגל הכלים Document כולל לחצנים המאפשרים לך לעבור במהירות בין תצוגות שונות של המסמך. סרגל הכלים כולל גם פקודות ואפשרויות נפוצות הקשורות להצגת המסמך ולהעברתו בין אתרים מקומיים ומרוחקים.

האפשרויות הבאות מוצגות בסרגל הכלים Document ‏:

מציג רק את התצוגה Code בחלון Document.

מפצל את החלון Document לתצוגת Code ולתצוגת Live/Design. אפשרות תצוגת עיצוב אינה זמינה עבור מסמכי רשת זורמת.

היא תצוגה מקדימה אינטראקטיבית שמעבדת בצורה מדויקת פרוייקטים ועדכונים של HTML5 בזמן אמת כדי להציג את השינויים שלך בזמן שאתה מבצע אותם. כעת ניתן לערוך רכיבי HTML ישירות ב-Live View. הרשימה הנפתחת לצד אפשרויות Live מאפשרת לך לעבור בין תצוגת Live לתצוגת Design. רשימה נפתחת זו אינה זמינה במסמכי גריד נוזלי.

מציג ייצוג של המסמך המראה כיצד המשתמש רואה אותו בדפדפן אינטרנט. 

סקירה של סרגל הכלים Standard

להצגת סרגל הכלים Standard, בחר Windows >‏ Toolbars >‏ Standard. סרגל הכלים מכיל לחצנים לפעולות נפוצות מהתפריטים File ו-Edit: New, Open, Save, Save All, Print Code, Cut, Copy, Paste, Undo, ו-Redo.

סקירה של סרגל הכלים Browser Navigation

סרגל הכלים Browser Navigation הופך לפעיל בתצוגת Live (רק אם הפכת אותו לזמין על-ידי בחירת Window->‏Toolbars->‏Standard), ומציג את הכתובת של הדף שבו אתה מביט בחלון Document. תצוגת Live פועלת כמו דפדפן רגיל, וכך גם אם אתה גולש לאתר מחוץ לאתר המקומי שלך (לדוגמה, http://www.adobe.com_he), ‏Dreamweaver יטען את הדף בחלון Document.

כברירת מחדל, קישורים אינם פעילים בתצוגת Live. קישורים שאינם פעילים מאפשרים לך לבחור טקסט קישור או ללחוץ עליו בחלון Document מבלי לעבור לדף אחר. כדי לבדוק קישורים בתצוגת Live, תוכלו לאפשר לחיצה חד-פעמית או לחיצה רציפה על ידי בחירה ב-View > Live View Options > Follow Links (Ctrl+Click Link) או Follow Links Continuously.

סקירה של סרגל הכלים

סרגל הכלים מופיע אנכית מצד שמאל של חלון Document, וגלוי בכל התצוגות - Code‏, Live ו-Design. הלחצנים בסרגל הכלים ספציפיים לתצוגה ומופיעים רק אם הם תקפים לתצוגה שבה אתה עובד. לדוגמה, אם אתם עובדים בתצוגת Live, אז אפשרויות ספציפיות לתצוגת Code כמו Format Source Code לא יהיו גלויות. 

התאמה אישית של סרגל הכלים

תוכלו לבחור להתאים אישית את סרגל הכלים הזה בהתאם לצרכים שלכם על ידי הוספת אפשרויות תפריט, או הסרת אפשרויות תפריט לא רצויות מסרגל הכלים.

כדי להתאים אישית את סרגל הכלים, בצעו את הפעולות הבאות:

כדי לשחזר את לחצני סרגל הכלים המוגדרים כברירת מחדל, לחצו על "שחזר ברירת מחדל" בתיבת הדו-שיח "התאם סרגל כלים".

סקירה של שורת Status

שורת Status בתחתית חלון Document מספקת מידע נוסף לגבי המסמך שאתה יוצר.

בורר התגים

מציג את עץ התגים המקיפים את הבחירה הנוכחית. לחץ על תג כלשהו בעץ התגים כדי לבחור בתג זה ובכל התוכן שהוא כולל. לחץ על <body> כדי לבחור בכל גוף המסמך. להגדרת התכונות של מחלקה או מזהה לתג בבורר התגים, לחץ לחיצה ימנית (Windows) או הקש Control ‏(Macintosh) תוך כדי לחיצה על התג, ובחר מחלקה או מזהה מהתפריט תלוי-ההקשר.

החלונית Output‏

לחצו על האיקון הזה כדי להציג את לוח Output שמציג שגיאות קידוד במסמך שלכם.

‏Code coloring‏

(זמין רק בתצוגת Code)

בחרו כל אחת משפות הקידוד מהתפריט הנפתח הזה כדי לשנות את צביעת הקוד כך שיוצג בהתאם לשפת התכנות.

‏Insert and Overwrite toggle‏

(זמין רק בתצוגת Code)

מאפשר לכם לעבור בין מצבי Insert ו-Overwrite תוך כדי עבודה בתצוגת Code.

‏Line and column number‏

(זמין רק בתצוגת Code.)

מציג את מספר השורה ומספר העמודה שבהם נמצא הסמן.

סקירה של Property Inspector

Property Inspector (Window > Properties) מאפשר לכם לבחון ולערוך את המאפיינים הנפוצים ביותר של רכיב הדף שנבחר כעת, כמו טקסט או אובייקט שהוכנס.

התוכן של Property Inspector משתנה בהתאם לרכיב שנבחר. לדוגמה, אם בחרת תמונה בדף, הרכיב Property Inspector משתנה ומציג מאפייני תמונה (כגון נתיב הקובץ של התמונה, רוחב וגובה התמונה, הגבול סביב התמונה, אם קיים ועוד).

הרכיב Property Inspector נמצא בקצה התחתון של מרחב העבודה כברירת מחדל, אך ניתן להסיר את עגינתו ולהפוך אותו לחלונית צפה במרחב העבודה.

לקבלת עזרה לגבי מפקח מאפיינים מסוים, לחץ על לחצן העזרה בפינה הימנית העליונה של מפקח המאפיינים, או בחר Help מתפריט Options של מפקח המאפיינים.

תצוגה ושינוי מאפיינים של רכיב עמוד

תפריטים תלויי-הקשר

תפריטים תלויי-הקשר מציעים גישה נוחה לרוב הפקודות והמאפיינים השימושיים הקשורים לאובייקט או לחלון הנוכחיים. תפריטי הקשר מציגים רק את הפקודות הרלוונטיות לבחירה הנוכחית.

כדי לפתוח תפריט הקשר, לחצו לחיצה ימנית (Windows) או Ctrl+לחיצה (Mac) על קטע קוד בתצוגת Code, או על אובייקט בתצוגות Live או Design.

סידור מחדש של חלוניות ב-Dreamweaver

תוכלו להתאים אישית את המיקום והמראה של כל לוחות ה-Dreamweaver בהתאם לדרישות שלכם.

עיגון והסרת עיגון של חלוניות

• כדי לעגן חלונית, גרור את הכרטיסייה שלה למעגן, בראש, בתחתית או בין חלוניות אחרות.
• כדי לעגן קבוצת חלוניות, גרור אותה בשורת הכותרת (השורה הריקה שמעל לכרטיסיות) לתוך המעגן.
• כדי להסיר חלונית או קבוצת חלוניות, גרור את הכרטיסייה או את שורת הכותרת שלה מחוץ למעגן. ניתן לגרור אותה למעגן אחר או להפוך אותה לחלונית צפה.

הזזת חלוניות

בזמן הזזת חלוניות, תראה קו כחול של אזורי שחרור, כלומר אזורים שניתן להזיז אליהם את החלונית. לדוגמה, ניתן להזיז חלונית למעלה או למטה במעגן בגרירתה לאזור ההזזה המסומן בפס כחול דק מעל או מתחת לחלונית אחרת. אם תגרור לאזור שאינו אזור הזזה, החלונית תצוף בחופשיות בסביבת העבודה.

• להזזת חלונית, גרור את הכרטיסייה שלה.
• להזזת קבוצת חלוניות, גרור את שורת הכותרת שלה.

הוספה והסרה של חלוניות

אם תסיר את כל החלוניות במעגן, המעגן ייעלם. ניתן ליצור מעגן בהזזת חלוניות לפינה הימנית של סביבת העבודה עד שיופיע אזור שחרור.

• להסרת חלונית, לחץ לחיצה ימנית (Windows) או הקש Control ‏(Mac) ולחץ על כרטיסיית החלונית ובחר Close, או בטל את הסימון בחלונית מתפריט Window.
• להוספת חלונית, בחר בה מתפריט Window ועגן אותה במקום הרצוי.

טיפול בקבוצות של חלוניות

• להזזת חלונית לקבוצה, גרור את הכרטיסייה שלה לאזור השחרור המסומן בקבוצה.
• כדי לסדר מחדש חלוניות בקבוצה, גרור את הכרטיסייה של החלונית למיקום חדש בקבוצה.
• להסרת חלונית מקבוצה כדי שהיא תצוף בחופשיות, גרור את הכרטיסייה שלה מחוץ לקבוצה.
• להזזת קבוצה, גרור את שורת הכותרת שלה (האזור שמעל לכרטיסייה).

סידור בערימה של חלוניות צפות

כשגוררים חלונית מחוץ למעגן שלה אך לא לאזור שחרור, החלונית צפה באופן חופשי. החלונית הצפה מאפשרת לך למקם אותה בכל מקום בסביבת העבודה. ניתן לסדר בערימה חלוניות צפות או קבוצות של חלוניות כדי שהן יזוזו כיחידה אחת כשתגרור את שורת הכותרת העליונה ביותר.

• כדי לסדר בערימה חלוניות צפות, גרור חלונית בעזרת הכרטיסייה שלה לאזור השחרור בתחתית חלונית אחרת.
• כדי לשנות את הסדר בערימה, גרור חלונית למעלה או למטה.
• להסרת חלונית או קבוצת חלוניות מהערימה כך שהיא תצוף באופן עצמאי, גרור את הכרטיסייה או את שורת הכותרת שלה.

שינוי גודל חלוניות

• למזעור או להגדלת חלונית, קבוצת חלוניות או ערימת חלוניות, לחץ פעמיים על כרטיסייה. ניתן גם ללחוץ פעמיים באזור הכרטיסייה (השטח הריק שליד הכרטיסיות).
• לשינוי גודל חלונית, גרור כל צד של החלונית. 

צמצום והרחבה של סמלי חלוניות

ניתן לצמצם חלוניות לסמלים כדי להפחית את הצפיפות בסביבת העבודה. ‏(במקרים מסוימים, החלוניות מצומצמות לסמלים בסביבת העבודה של ברירת המחדל.

• כדי לצמצם או להרחיב את כל סמלי החלוניות בעמודה, לחץ על החץ הכפול בראש המעגן.
• כדי להרחיב סמל חלונית בודד, לחץ עליו.
• לשינוי גודל של סמלי חלוניות כדי שתוכל לראות רק את הסמלים (ולא את התוויות), התאם את רוחב המעגן עד שהמלל ייעלם. לתצוגת סמל המלל שוב, הרחב את המעגן.
• כדי להרחיב או לצמצם בחזרה חלונית לסמל שלה, לחץ על הכרטיסייה של החלונית, על הסמל שלה או על החץ הכפול בשורת הכותרת של החלונית.

יצירת סביבות עבודה מותאמות אישית

ניתן להתאים אישית את סביבת העבודה על-ידי הוספה או הסרה של חלוניות בהתאם לדרישות שלך. לאחר מכן תוכלו לשמור את השינויים האלה למרחב העבודה שלכם על ידי שמירתו כדי לגשת אליו מאוחר יותר מתוך Workspace Switcher בסרגל הכלים של המסמך.

שמירה בשם של הגודל והמיקום הנוכחי של חלוניות בסביבת עבודה מאפשרת לשחזר את סביבת העבודה גם אם הזזת או סגרת חלונית.

כדי לשמור מרחב עבודה מותאם אישית:

1. בחרו Window > Workspace Layout > New Workspace.
2. הזן שם לסביבת העבודה.

סביבת העבודה נשמרת והיא גלויה ב- Workspace Switcher בסרגל הכלים Document.

כדי למחוק מרחב עבודה מותאם אישית:

בחר Manage Workspaces ממתג סביבת העבודה בסרגל היישום כדי לפתוח את תיבת הדו-שיח Manage Workspaces. בחרו את מרחב העבודה, ולאחר מכן לחצו על Delete.

הצגת סביבת עבודה או מעבר בין סביבות עבודה

בחרו מרחב עבודה ממחליף מרחבי העבודה בסרגל הכלים של המסמך.

התאמה אישית של Dreamweaver במערכות מרובות משתמשים

אתם יכולים להתאים את Dreamweaver לצרכים שלכם גם במערכת הפעלה רב-משתמשים כמו Windows XP או Mac OS X.

Dreamweaver מונע השפעה של הגדרות תצורה מותאמות אישית של משתמש אחד על הגדרות התצורה המותאמות אישית של משתמש אחר. כדי לממש מטרה זו, בפעם הראשונה שאתה מפעיל את Dreamweaver באחת ממערכות ההפעלה מרובות המשתמשים שהוא מזהה, היישום יוצר עותקים של מגוון קובצי תצורה. קובצי הגדרות תצורה אלה מאוחסנים בתיקייה השייכת לך.

אם תתקינו מחדש או תשדרגו את Dreamweaver, התוכנה יוצרת באופן אוטומטי עותקי גיבוי של קובצי תצורת המשתמש הקיימים, כך שאם התאמתם את הקובצים האלה באופן ידני, עדיין תוכלו לגשת לשינויים שביצעתם.

הצגת כרטיסיות מסמכים (ב-Mac בלבד)

ניתן להציג מסמכים מרובים בחלון Document אחד בעזרת שימוש בכרטיסיות לזיהוי כל מסמך. ניתן גם להציג מסמכים כחלק ממרחב עבודה צף, שבו כל מסמך מופיע בחלון נפרד משלו.

פתיחת כרטיסיית מסמך בחלון נפרד

הקש Control, לחץ על הכרטיסייה ובחר Move To New Window מהתפריט תלוי-ההקשר.

שינוי הגדרת כרטיסיית מסמך של ברירת המחדל

1. בחר Dreamweaver ‏> Preferences, ובחר בקטגוריה General.
2. סמן או בטל את הסימון באפשרות Open Documents in Tabs, ולחץ על OK.

Dreamweaver אינו משנה את תצוגת המסמכים הפתוחים כרגע כשאתה משנה את ההעדפות. עם זאת, מסמכים שייפתחו לאחר שתבחר בהעדפה חדשה יוצגו בהתאם להעדפה שבחרת.

מסך הפתיחה מופיע בעת הפעלת Dreamweaver ובכל זמן שאין מסמכים פתוחים. ניתן להסתיר את מסך הפתיחה, ולאחר מכן להציגו שוב. כשמסך הפתיחה מוסתר ואין מסמכים פתוחים, חלון Document ריק.

חלוניות Dreamweaver נפוצות

אתה עובד עם מספר חלוניות ב-Dreamweaver. חלק מהלוחות הנפוצים בשימוש מתוארים כאן.

סקירה של החלונית Insert

החלונית Insert ‏(Window >‏ Insert) כוללת לחצנים ליצירה ולהוספה של אובייקטים כגון טבלאות, תמונות וקישורים. הלחצנים מאורגנים בכמה קטגוריות, ואתם יכולים לעבור ביניהן על ידי בחירת הקטגוריה הרצויה מהרשימה הנפתחת בחלק העליון.

חלק מהקטגוריות כוללות לחצנים עם תפריטים נפתחים. כשבוחרים אפשרות מהתפריט הנפתח, היא הופכת לפעולת ברירת המחדל של הלחצן. לדוגמה, אם תבחרו במעבר שורה מהתפריט הקופץ של לחצן תו , בפעם הבאה שתלחצו על לחצן תו, Dreamweaver יכניס מעבר שורה.בכל פעם שתבחר פעולה חדשה מהתפריט הנפתח, פעולת ברירת המחדל ללחצן זה תשתנה.

החלונית Insert מאורגנת לפי הקטגוריות הבאות:

מאפשר ליצור ולהכניס את רכיבי ה-HTML הנפוצים ביותר כמו תגי div ואובייקטים, כמו תמונות וטבלאות.

מכיל לחצנים ליצירת טפסים ולהכנסת רכיבי טפסים, כמו חיפוש, חודש וסיסמה.

מאפשר לשמור את המסמך כתבנית ולסמן אזורים ספציפיים כניתנים לעריכה, אופציונליים, חוזרים, או אזורים אופציונליים הניתנים לעריכה.

מכיל רכיבי Bootstrap שמספקים ניווט, מכולות, תפריטים נפתחים ועוד שתוכלו להשתמש בהם בפרויקטים רספונסיביים.

מכיל לחצנים לבניית אתרים המשתמשים ב-jQuery Mobile.

מאפשר להכניס רכיבי jQuery UI כמו אקורדיון, מחוונים ולחצנים.

מאפשרת לקבץ ולארגן את לחצני החלונית Insert שאתה משתמש בהם לעתים קרובות במקום אחד.

הוספת אובייקט

כדי להוסיף אובייקט באמצעות לוח ההוספה:

עריכת העדפות החלונית Insert

הוספה, מחיקה או ניהול של פריטים בקטגוריה Favorites של החלונית Insert

סקירה של החלונית Files

השתמשו בלוח קבצים כדי להציג ולנהל את הקבצים באתר Dreamweaver שלכם.

באפשרותך להשתמש בחלונית Files כדי להציג קבצים ותיקיות, לבדוק אם הם מקושרים לאתר Dreamweaver או לא, ולבצע פעולות רגילות של תחזוקת קבצים, כגון פתיחה והעברה של קבצים.

החלונית Files גם מסייעת לנהל קבצים ולהעביר קבצים לשרת מרוחק וממנו. 

למידע נוסף על כל מה שאתם יכולים לעשות עם לוח הקבצים, ראו ניהול קבצים ותיקיות.

CSS Designer

לוח מעצב CSS (Windows > מעצב CSS) הוא Property Inspector של CSS שמאפשר ליצור באופן 'ויזואלי' סגנונות CSS, קבצים, ולהגדיר מאפיינים, יחד עם שאילתות מדיה.

תוכל להשתמש ב-Ctrl/Cmd+ Z כדי לבטל פעולה, או ב-Ctrl/Cmd + Y כדי לבצע שוב את כל הפעולות שאתה מבצע ב-CSS Designer. שינויים אלה משתקפים באופן אוטומטי ב-Live View, ומתבצע רענון של קובץ ה-CSS הרלוונטי. כדי להודיע לך שהקובץ הקשור השתנה, הכרטיסייה של הקובץ המושפע מודגשת לזמן מה (כ-8 שניות).

לוח CSS Designer מורכב מהחלוניות והאפשרויות הבאות:

All מפרטת את כל מאפייני ה- CSS, שאילתות המדיה והבוררים המשויכים למסמך הנוכחי. ניתן לבצע סינון לקבלת כללי ה-CSS הדרושים ולשנות את המאפיינים. אתם יכולים גם להשתמש במצב הזה כדי להתחיל ליצור בוררים או שאילתות מדיה.

מצב אינו מושפע מהבחירה. המשמעות היא שכאשר אתם בוחרים רכיב בדף, הבורר, שאילתת המדיה או ה-CSS המשויכים אינם מודגשים במעצב CSS.

Current מפרטת את כל הסגנונות הממוחשבים עבור כל רכיב שתבחר בתצוגה Design או Live של המסמך הנוכחי. כאשר אתם משתמשים במצב הזה עבור קובץ CSS בתצוגת קוד, כל המאפיינים של הבורר שבמוקד מוצגים.

מצב זה תלוי הקשר. השתמשו באפשרות הזו כדי לערוך את המאפיינים של בוררים המשויכים לרכיבים נבחרים במסמך.

Sources מפרטת את כל גיליונות הסגנונות של CSS המשויכים למסמך. בעזרת חלונית זו, באפשרותך ליצור ולצרף CSS למסמך או להגדיר סגנונות בתוך המסמך.

@Media‎ מפרטת את כל שאילתות המדיה הקיימות במקור שנבחר בחלונית Sources. אם לא תבחר CSS מסוים, יוצגו בחלונית כל שאילתות המדיה שמשוייכות למסמך.

Selectors מפרטת את כל הבוררים הקיימים במקור שנבחר בחלונית Sources. אם תבחר גם שאילתת מדיה, חלונית זו תצמצם את רשימת הבוררים לבוררים עבור אותה שאילתה. אם לא ייבחרו CSS או שאילתות מדיה, יוצגו בחלונית כל הבוררים במסמך.

כאשר אתם בוחרים Global בחלונית @Media, כל הבוררים שלא נכללים בשאילתת מדיה של המקור הנבחר מוצגים.

Properties מציגה מאפיינים שניתן לקבוע עבור הבורר שצוין. למידע נוסף, ראו הגדרת מאפיינים.

אם תצמצם או תרחיב את החלוניות ב-CSS Designer, הגדלים של החלוניות יישמרו בתוך אותה הפעלה. החלוניות Sources ו-Media יישארו בגדלים המותאמים אישית עד שתשנה שוב את הגודל שלהן.

הערה: כאשר אתה בוחר רכיב דף, הבורר הספציפי ביותר נבחר בחלונית Selectors. כדי להציג את המאפיינים של בורר מסוים, לחצו על שם הבורר בחלונית.

כדי להציג את כל הבוררים, ניתן לבחור באפשרות All Sources בחלונית Sources. כדי להציג בוררים שאינם שייכים לאף שאילתת מדיה במקור הנבחר, לחצו על Global בחלונית @Media.

סקירה של קווי עזר חזותיים

Dreamweaver מספק כמה סוגים של מדריכים חזותיים כדי לעזור לכם לעצב מסמכים ולחזות באופן משוער איך הם יופיעו בדפדפנים. אפשר לבצע אחת מהפעולות הבאות:

• ‏‫לקבוע באופן מיידי את החלון‬ Document על גודל חלון רצוי כדי לראות כיצד הרכיבים יתאימו לעמוד.

• השתמש בתמונת עקיבה כרקע לעמוד כדי שתוכל לשכפל עיצוב שנוצר בתוכנת ציור או עריכת תמונות, כגון Adobe® Photoshop‎®‎‎ או Adobe® Fireworks‎®‎‎.

• ניתן להשתמש בסרגלים ובקווי עזר כדי לקבל מושג חזותי לגבי מיקום מדויק ושינוי גודל של רכיבים בעמוד.

• השתמש ברשת למיקום ולשינוי גודל מדויקים של רכיבים עם מיקום מוחלט (רכיבי AP).

  סימני רשת בעמוד מסייעים ביישור רכיבי AP, וכשמפעילים את אפשרות ההצמדה, רכיבי AP נצמדים אוטומטית לנקודת הרשת הקרובה ביותר כשמזיזים אותם או משנים את גודלם. ‏(אובייקטים אחרים, כגון תמונות ופסקאות, אינם מוצמדים לרשת). ההצמדה פועלת בין שהרשת גלויה ובין שלא.

התקרבות והתרחקות בעמוד

Dreamweaver מאפשר להגביר את ההגדלה (להתקרב) בחלון Document, כדי שתוכל לבדוק את דיוק הפיקסלים בגרפיקה, לבחור בפריטים קטנים בקלות רבה יותר, לעצב דפים עם טקסט קטן, לעצב דפים גדולים וכן הלאה.

כדי להגדיל או להקטין דף, בחרו View > Design View Options > Magnification, ובחרו באחת מאפשרויות ההגדלה הזמינות.

ניתן לבחור מבין מגוון רחב של אפשרויות הגדלה. כמו כן, אפשר לבחור באפשרויות הבאות:

• Fit Selection - בחרו אובייקט או טקסט, ובחרו באפשרות זו כדי למלא את חלון המסמך בבחירה.
• Fit All - למלא את חלון המסמך בדף שלם
• Fit Width - מילוי חלון המסמך ברוחב המלא של הדף

הגדרת העדפות בכרטיסייה General של Dreamweaver

הגדרת העדפות גופנים למסמכים ב-Dreamweaver

קידוד המסמך קובע כיצד ייראה המסמך בדפדפן. העדפות הגופנים של Dreamweaver מאפשרות להציג קידוד נתון בגופן ובגודל הרצויים לך. אך הגופנים שתבחר בתיבת הדו-שיח Fonts Preferences ישפיעו רק על האופן שבו הגופנים מופיעים ב-Dreamweaver; הם לא ישפיעו על אופן תצוגת המסמך בדפדפן של המבקר באתר. כדי לשנות את אופן התצוגה של גופנים בדפדפן, יש לשנות את הטקסט ב-Property inspector או בעזרת החלת כלל CSS.

למידע על הגדרת קידוד ברירת מחדל למסמכים חדשים, ראו יצירה ופתיחה של מסמכים.

התאמה אישית של צבעי הסימון של Dreamweaver

השתמשו בהעדפות Highlighting כדי להתאים אישית את הצבעים המזהים אזורי תבניות, פריטי ספרייה, תגיות צד שלישי, אלמנטי פריסה וקוד ב-Dreamweaver.

פריטים דומים נוספים

• פתיחת קבצים קשורים
• מידע כללי על עבודה עם קוד ב-Dreamweaver
• הגדרת העדפות לכתיבת קוד
• הצגה ועריכה של תוכן כותרת
• שימוש בעזרים חזותיים לפריסה
• תצוגה מקדימה של דפים
• עבודה עם קבצים בחלונית Files