הבנת נתיבים בתבניות Dreamweaver

תבניות Dreamweaver
כאשר דף HTML נשמר כתבנית, Dreamweaver יוצר תיקיית תבניות ברמת השורש של תיקיית השורש המקומית ומייצר קובץ ‎.dwt שהופך למקור עבור כל הדפים שמוחלים עליו.בכל פעם שדף HTML מוחל על template ‎(File > New from template או Modify > Template > Apply template to page) הוא יוצר קישור יחסי לשורש האתר לקובץ ה-‎.dwt.הסיבה שקישור יחסי זה באתר תמיד יקשר נכון היא מפני שקובץ ה-‎.dwt תמיד יהיה בתיקיית Templates ברמת השורש של מבנה התיקיות של האתר.אם קובץ ה-‎.dwt יוזז מתיקיית Templates, או אם תיקיית Templates תוזז או תשונה שמה, הקישור ישבר.חשוב מאוד לשמור את קובץ ה-‎.dwt בתיקיית Templates במקום שבו Dreamweaver יוצר אותו.כדי למנוע בלבול, נהוג שלא לשמור רכיבים אחרים של האתר שלכם (Image Source או מסמכי HTML) בתוך תיקיית Templates.

איך הדפים מקושרים לקובצי template?
כאשר קובץ מוחל על דף קיים או נוצר חדש מתבנית, הקוד הבא מוכנס לקוד המקור:

<!-- #BeginTemplate "/Templates/templateName.dwt" -->

כדי להציג את קוד מקור ה-HTML ש-Dreamweaver יוצר, בחרו Window> HTML.

הנתיב למעלה מחליף את מקור ה-HTML הרגיל שמופיע בדף חדש.במקום להתחיל עם התגים הרגילים שקובץ חדש יוצר, הוא מציין שרמה אחת בתוך תיקיית השורש המקומית, בתוך תיקייה בשם Templates, קיים קובץ ‎.dwt שמכיל את כל המידע שלא נמצא באזורים הניתנים לעריכה של הדף.נתיב זה שולח את הדפדפן לחפש במיקום הנכון את הקובץ שיספק את מאפייני הדף, הפריסה והגרפיקה—את כל התוכן שקיים רק בקובץ ה-‎.dwt.זו הסיבה ששינויים מחוץ לאזורים הניתנים לעריכה של דף חייבים להיעשות ישירות בקובץ ה-‎.dwt.כאשר קובץ ה-‎.dwt עצמו נפתח ומתוקן כל הדפים שמוחלים על ה-template מקושרים לקובץ באותו מיקום כמו קודם.כל הדפים שמוחלים על ה-template מתעדכנים אוטומטית עם המידע החדש.

נתיב יחסי למסמך לעומת נתיב יחסי לשורש האתר
הנתיב שמקשר דף HTML לתבנית הוא נתיב יחסי לשורש האתר.זה נקרא יחסי לשורש האתר מפני שהוא מתחיל מהרמה העליונה של מבנה הספריה (תיקיית השורש המקומית), ואז ממשיך דרך התיקייה הבאה למטה ‎(Templates), ולבסוף מקשר לקובץ ה-‎.dwt.Dreamweaver יוצר באופן אוטומטי נתיב יחסי לשורש האתר לתבניות בתיקיית Templates, מכיוון שהוא יודע בדיוק היכן התבנית תמוקם, לא משנה אילו תיקיות קבצים אחרות קיימות במבנה האתר.

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

אם אתם רוצים להציג את הדפים בדפדפן באופן מקומי לפני העלאת הקבצים לשרת מרוחק, הם חייבים להיות יחסיים למסמך.גם ב-Internet Explorer וגם בדפדפני Netscape אין דרך להבין איזו תיקיית שורש מקומית הוגדרה (כמו ש-Dreamweaver עושה), כך שהם יכולים לעקוב רק אחר נתיב שהוא יחסי למסמך שהם מציגים כרגע.מאחר שרוב המשתמשים מעדיפים להציג את הדפים שלהם באופן מקומי בדפדפן לפני העלאתם, Dreamweaver מוגדר כברירת מחדל להיות יחסי למסמך כאשר קובץ מקושר או תמונה מוכנסת.אם הקובץ לא נשמר לפני ניסיון הכנסת תמונה או קישור לדף HTML אחר, ל-Dreamweaver אין התייחסות למיקום הדף הנוכחי, ולכן הוא ייצור נתיב שנראה כמו:

file:///HardDrive/Desktop Folder/localRootFolder/subfolder/subfolder/images/content.htm

או

file:///C:/Desktop/localRootFolder/subfolder/subfolder/images/content.htm

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

התרשים שלהלן נותן הסבר גרפי של ההבדל בין נתיב יחסי למסמך לנתיב יחסי לשורש האתר.בדוגמה שלהלן, לדף bio.htm יש גרפיקה בשם logo.jpg שהוכנסה אליו באמצעות נתיבים חלופיים.

נתיבים יחסיים למסמך בתבנית

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

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

Dreamweaver לא מתאים נתיבים יחסיים לשורש האתר או מוחלטים (http://) מהתבנית לדפים שהוחלו עליהם התבנית, מכיוון שאין צורך לשנות אותם.

נתיבים יחסיים למסמך בדפים שהוחלו על התבנית

הוספת תמונות וקישורים בתוך האזור הניתן לעריכה של דף שמצורף לתבנית פועלת בדיוק כמו הוספת תמונות או קישורים בדף שלא מצורף לתבנית. אם תבצעו את התהליך של בחירה ב-File > New from Template, ואז File > Save (בחירת מיקום בתוך תיקיית השורש המקומית) לפני יצירת קישורים לדפים או תמונות אחרים, Dreamweaver יגדיר כברירת מחדל את האפשרות Document relative בתיבות דיאלוג Select HTML Page או Select Image Source. כל עוד התפריט הנפתח "Relative To" לא משונה ידנית לבחירת Site Root, התמונות והקישורים יהיו זמינים כשתציגו את העבודה בדפדפן באופן מקומי.

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

כשעובדים על קובץ תבנית כדי ליצור קישורים לדפים אחרים או להפנות למקור התמונה של גרפיקות, התפריט הנפתח בתיבות הדיאלוג Select HTML File ו-Select Image Source מאפשר לבחור בין יחסי למסמך ויחסי לשורש האתר. כפי שמוצג בטבלה למעלה, בחירה ב-Site Root יוצרת נתיב מתיקיית השורש המקומית ישירות לקובץ הנבחר, ללא תלות בקובץ ה-.dwt שפתוח כרגע ב-Dreamweaver. שימוש בקישורים יחסיים לשורש האתר עשוי להיות מועיל כאשר התוכן במבנה ספריות האתר עלול לעבור בתוך תיקיית השורש המקומית, מכיוון שהקישור יישאר שלם גם אם הקבצים יועברו ממיקומם המקורי.

Dreamweaver אינו משנה נתיבים יחסיים לשורש האתר או מוחלטים (http://) מהתבנית לדפים שהוחלו עליהם, מכיוון שאין צורך לעדכן אותם.מיקום המסמך (בין אם הוא קובץ .dwt או קובץ HTML שמצורף לתבנית) לא רלוונטי לנתיב יחסי לשורש האתר.

נתיבים יחסיים לשורש האתר בדפים שהוחלו על התבנית
שימוש בקישורים יחסיים לשורש האתר יכול להיות מועיל אם האתר מורכב, כולל צוות מפתחים שעובדים יחד, או שיש לו מבנה תיקיות באתר שעובר עדכון באופן קבוע.כדי ליצור קישור יחסי לאתר, פשוט בחרו ב-Site Root מהתפריט הנפתח ליד המילים "Relative To" הממוקמות בתיבות הדיאלוג "Select Image Source" ו-"Select HTML File".

מכיוון שהנתיב שייווצר יתחיל מתיקיית השורש המקומית, דרך כל מספר של תיקיות משנה, ובסופו של דבר יסתיים בדף או בתמונה שהוא מקושר אליהם, מפתחים זוכים לגמישות להעביר את הדפים או הנכסים תיקיית משנה אחת או יותר למעלה במבנה ספריית האתר מבלי לשבור את הקישורים.לדוגמה, בתרשים למעלה, אם קובץ logo.jpg היה עובר מתיקיית images אל תיקיית features והקישור היה קישור יחסי לשורש האתר, הדפדפן עדיין היה מוצא את הגרפיקה ללא בעיה.אם הנתיב הוא קישור יחסי למסמך, גם קובץ logo.jpg וגם קובץ bio.htm חייבים להישאר במבנה התיקיות בו הם היו כאשר הנתיב היחסי למסמך נוצר. העברת אחד מהקבצים לאחר יצירת הנתיב תגרום לנתיב שבור.

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

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

הדרך השנייה להציג קישורים יחסיים לאתר בדפדפן היא באמצעות שרת אינטרנט אישי. ב-Windows בלבד, ניתן להגדיר אפשרות זו ב-Dreamweaver באמצעות File > Preview in Browser > Edit Browser List ובחירה ב-Preview Using Local Server.הגדרת אפשרות זו תאפשר ל-Dreamweaver להציג מסמכים באמצעות שרת אינטרנט אישי.

הערה: ב-Macintosh, שרת אינטרנט אישי מוגדר ברמת המערכת. עיינו בתיעוד המערכת לקבלת עזרה נוספת.