כיצד לכלול קובץ HTML אחד אחר

השימוש ב- HTML כולל יכול מאוד לפשט את הניהול של האתר שלך

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

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

איך לכלול עיצוב אתרים יותר יעיל

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

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

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

תוכן חוזר ונשנה במערכות ניהול תוכן

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

ככזה, תבניות אלה CMS יכיל את האזורים של האתר, כי חוזרים על פני כל דף. אתה פשוט להתחבר backend של CMS ולערוך את התבניות הדרושות. כל דפי האתר המשתמשים בתבנית זו יעודכנו.

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

מה כולל HTML?

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

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

שימוש בצד השרת כולל

Side Server כולל, הידוע גם בשם SSI, פותחו לראשונה כדי לאפשר למפתחי אינטרנט "לכלול" מסמכי HTML בתוך דפים אחרים.

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

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

הנה דוגמה לאופן השימוש ב- SSI כדי לכלול קטע HTML בכל דפי האינטרנט שלך:

  1. שמור את HTML עבור האלמנטים המשותפים של האתר שלך כקבצים נפרדים. לדוגמה, ייתכן שמקטע הניווט נשמר כ- nav.html או nav.ssi .
  2. השתמש בקוד ה- SSI הבא כדי לכלול את קוד מסמך ה- HTML בכל דף ( החלפת נתיב הקובץ ושם הקובץ בין המירכאות ). {C}
  1. הוסף קוד זה בכל דף שברצונך לכלול את הקובץ.

שימוש ב- PHP

PHP היא שפת scripting ברמת השרת. הוא יכול לעשות מספר דברים, אך שימוש נפוץ אחד הוא לכלול מסמכי HTML בתוך הדפים שלך, בדומה לאופן שבו אנחנו מכוסים רק עם SSI.

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

הנה סקריפט פשוט PHP אתה יכול להשתמש כדי לכלול קטע של HTML על כל דף אינטרנט מאופשר PHP:

  1. שמור את HTML עבור האלמנטים המשותפים של האתר שלך, כגון הניווט, לקבצים נפרדים. לדוגמה, ייתכן שמקטע הניווט נשמר כ- nav.html או nav.ssi .
  2. השתמש בקוד PHP הבא כדי לכלול את ה- HTML בכל דף ( החלפת נתיב הקובץ ושם הקובץ בין המירכאות ). nav.php ");?>
  3. הוסף את אותו קוד בכל דף שברצונך לכלול את הקובץ.

כולל

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

כך תוכל לכלול קטע HTML באמצעות JavaScript :

  1. שמור את HTML עבור האלמנטים המשותפים של האתר שלך לקובץ JavaScript. כל HTML שנכתב בקובץ זה, חייב להיות מודפס למסך עם הפונקציה document.write.
  2. העלה את הקובץ לאתר שלך.
  3. השתמש באלמנט