מרכז הדרכה

כל התשובות לכל השאלות
 

קוד ה - HTML ועריכתו

מהי שפת HTML?
HTML, או בשמה המלא Hyper Text Markup Language היא שפת סימון טקסט, שמכילה הוראות לדפדפנים כיצד יש להציג את הדף. כל אתר אינטרנט בסופו של בנוי משפת
HTML. משתמשים מתקדמים ובעלי ידע ב - HTML יכולים להעשיר את תוכן העמודים באתר שלהם על ידי הכנסת קוד HTML מיוחד לעורך (מומלץ להכניס קוד XHTML) - אם כי עבודה עם קוד אינה הכרחית במערכת.

כיצד להכניס HTML לעמודי האתר?
כדי להכניס קוד HTML יש לבצע את הפעולות הבאות:

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

 


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

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

1. לרשום בעמוד עצמו טקסט ממלא מקום כלשהו (12345 או abcd לדוגמא).
2. לעבור למקור.
3. לאתר את הטקסט הזה במקור (ניתן לחפש על ידי CTRL+F).
4. להחליף אותו בקוד הרצוי.

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

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

לדוגמא, קוד HTML בסיסי ייראה כך:



הסבר לפי שורות:
1. בשורה זו מופיע תג פתיחה של המסמך, HTML, האומר לדפדפן להתייחס לתוכן
כאל HTML.
2. בשורה זו מופיע תג הפתיחה “<HEAD>” שדרכו מגדירים תכונות שונות לעמוד, לדוגמא: הכותרת העליונה של חלון הדפדפן.
3. בשורה זו מופיע תג פתיחה “<Title>”, אחריה מופיע תוכן כותרת האתר (במקרה שלנו
"כותרת האתר”) ותג הסגירה "</Title>” .
4. פה יש לנו את תג הסגירה “<HEAD/>”  הסוגר את התג הנפתח בשורה 2. 
6. בשורה זאת מופיעה תג ה"<BODY>” שכל מה שמופיע מתחתיו יופיע גם בדפדפן.
בפועל מדובר בתוכן הדף שיוצג.
8. תג סגירה "<BODY/>” - פה מסתיים תוכן הדף.
10. תג סגירה "<HTML/>” - סוגר את הדף.

מספר תגים שימושיים:

<P> - תג פסקה:
שימוש: תג זה מגדיר פסקה.
דוגמה:
<p> זוהי פסקה לדוגמה</p>
הקוד כפי שהוא בא לידי ביטוי:

זוהי פסקה לדוגמה


<A> - תג עוגן:
שימוש: תג זה מגדיר עוגן לשני שימושים עיקריים
א. יצירת קישור לדף אחר ע"י שימוש בתכונת הHREF שלו.
ב. יצירת קישור למיקום בדף הנוכחי ע"י שימוש בתכונת הNAME שלו.
דוגמה:
<a href="http://www.enter-support.com">מרכז ההדרכה</a>
הקוד כפי שהוא בא לידי ביטוי:
מרכז ההדרכה


<IMG> - תג תמונה:
שימוש: תג זה מכניס תמונה למסמך הHTML ע”י הגדרת תכונת הSRC, ורצוי להגדיר
גם את תכונת הALT (טקסט חלופי) שלו. תכונה זאת אינה מחייבת אך יכולה לעזור במידה והתמונה לא נמצאת - וגם קריאה על ידי מנועי חיפוש.
דוגמא:
<img src="http://enter-support.com/site/include/newfeel/website3/images/home.gif" alt="תמונה של בית" />

*יש לשים לב שלתג זה אין תג סגירה!

הקוד כפי שהוא בא לידי ביטוי:

תמונה של בית

<TABLE> - תג טבלה:
תג זה כולל תתי תגים:
<TR> תג שורה.
<HR> תג כותרת.
<DT> תג תא.

שימוש: בניית טבלאות למסמך הHTML.
דוגמא:


הקוד כפי שהוא בא לידי ביטוי:

כותרת 1 כותרת 2
תא 1 תא 2


מי שרוצה ללמוד עוד על שפת הHTML ושימושיה השונים מוזמן להיכנס לכאן:
W3Schools


Go Back  Print  Send Page
מפת האתר   |   כתבו לנו [חזור למעלה]  
כל הזכויות שמורות למפתחי מערכת זו, אין להעתיק מידע מאתר זה ללא אישור בכתב