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

אם התוסף מותקן ומופעל באתרכם תמצאו אותו תחת “תוספים” בתפריט המינהלה העליון

תמונת אתר
תמונה מייצגת של האתר תוכלו להעלות אל ספריית המדיה שלכם, ואז גם תעתיקו את כתובת התמונה על מנת שתוכלו להדביק אותה בשדה הייעודי המיועד לכך של הפלאגין (כולל http ).
מידות תמונה מומלצות עבור שימוש של פייסבוק: 1200X630 (או קטן יותר בהתאמת פרופורציות), פורמט JPG או PNG.

פייסבוק

• תוכלו להעזר בעמוד הבא למציאת הפייסבוק -ID שלכם: https://www.labnol.org/internet/find-facebook-page-id-profile/6909/ .
• למציאת ה- Facebook Admin ID שלכם, העזרו בהסבר בעמוד הבא: https://www.techprevue.com/find-facebook-admin-id-user-id/ .

לאחרונה שילבנו בסרגל העריכה הויזואלי של המערכת תוסף קטן של הטמעת סרטונים שהעליתם לאתר ממחשבכם המקומי ( הפורמט המומלץ הוא mp4 , אך אפשר גם WebM ו- OGV )
לא בכל אתר שהקמנו בעזרת המערכת יש כיום את התוסף, לכן במידת הצורך נוסיף אותו לפי בקשה – למי שצריך … באתרים חדשים הוא נכלל כברירת מחדל.

הוראות שימוש:

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

לסיום יש ללחוץ על כפתור “אישור” , מה שיסגור את תיבת הדו-שיח ויאפשר לכם להמשיך לעדכן את תוכן העמוד.

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

בחלון המוקפץ (תיבת הדו-שיח ) ניתן לשלוט על כמה ממאפייני הסרטון:

•  שליטה/שינוי גודלו של הסרטון (ברזולוציות נמוכות כמו של טאבלטים וטלפונים חכמים הסרטון ישנה אוטומטית את מימדיו לכל רוחב המסך (ויקטין עצמו במידת הצורך)
• יישור ביחס לאיזור התוכן של האתר (ואז יהיה הסרטון בתוך אלמנט DIV – מעין פיסקה משל עצמו : כלומר אם תסמנו אפשרות שאינה “ללא” – תעטוף את הסרטון מעין פיסקה חדשה ).

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

לא בכל אתר שהוקם ע”י המערכת יש כיום את התוסף, אך במידת הצורך נוסיף אותו לפי בקשה – למי שצריך …

הוראות שימוש:

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

לסיום יש ללחוץ על כפתור “אישור”

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

בחלון המוקפץ (תיבת הדו-שיח ) ניתן לשלוט על כמה ממאפייני הסרטון:

•  שליטה/שינוי גודלו של הסרטון (ברזולוציות נמוכות כמו של טאבלטים וטלפונים חכמים הסרטון ישנה אוטומטית את מימדיו לכל רוחב המסך (ויקטין עצמו במידת הצורך)
• יישור ביחס לאיזור התוכן של האתר (ואז יהיה הסרטון בתוך אלמנט DIV – מעין פיסקה משל עצמו : כלומר אם תסמנו אפשרות שאינה “ללא” – תעטוף את הסרטון מעין פיסקה חדשה ).

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

1. מומלץ להכין מראש את הטקסטים להם תזדקקו  (לרוב קל יותר לכתוב את הטקסט כמסמך וורד עד שמגיעים לניסוח הסופי ולא להקליד אותו לעמוד באתר)
   יש להכין בנפרד גם את התמונות להן תזדקקו ..שימו לב: לא מומלץ להשתמש בתמונות ברוחבן גדול על מנת שלא “ישבור” את צורת האתר ( רוחב מומלץ לתמונות שמשולבות בטקסטים של האתר הוא לא יותר מ- 360 פיקסלים )
2. יש להזדהות כמנהלים באתר : לשם כך תצטרכו את כתובת המינהלה, שם המשתמש שלכם וכמובן סיסמה … את אלו סיפקו לכם עם תום הקמת אתרכם (תוכלו תמיד לקבל אותם מחדש אם תבקשו).
   כנסו אל הכתובת של מינהלת האתר והקלידו אל המקומות המתאימים את שם המשתמש שלכם והסיסמה, בסיום לחצו כל כפתור ה”כניסה” אשר יעביר אתכם אל מסך ניהול העמודים (שמשמש מסך הכניסה אל מינהלת האתר).
3. מטרתו של מסך ניהול העמודים הוא בעיקר לתת לכם את האפשרות לערוך / למחוק ולעדכן עמודים קיימים ולראות את הסידור ההיררכי שלהם.
   בצילום המסך הבא תוכלו להבין בקלות את שימושי המסך (הקליקו על צילום המסך לפתיחת גירסה מוגדלת שלו):
   
4. כעת נגיע אל מה שבאמת מעניין אותנו: פתיחה (הקמה) של עמודים חדשים באתר.
   לשם כך תצטרכו ללחוץ על הקישור “יצירת עמוד חדש” שהוא הקישור העליון בטור הימני במינהלת העמודים.
   המסך אליו נגיע הוא המסך החשוב ביותר במינהלת האתר שלכם, שכן בו כמובן מנהלים את תכני אתרכם (מסך עריכת עמוד קיים הוא מסך זהה)

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

כך נראה המסך לפני תחילת העבודה איתו:

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

אך לחיצה על כפתור ה”אפשרויות עמוד” (כמו שתראו באנימציה שמשמאל) פותחת תכונות חשובות נוספות של העמוד:

1. כתובת URL
2. מילות מפתח / תגיות
3. תיאור הדף
4. לשמור מוסתר?
5. עמוד אב
6. תבנית
7. הוספה לתפריט

פירוט תכונות אלו להלן:

1. כתובת URL:

שדה כתובת ה- URL (או בכינויו slug) קובע את כתובתו הסופית של העמוד באתר – לדוגמה: http://www.your-site.co.il/your-new-page , יש להקליד בשדה זה אותיות לועזיות ומספרים בלבד, אפשר גם מקפים ( – ) , אם תקלידו עם רווחים הם יהפכו למקפים ואותיות גדולות יומרו לאותיות קטנות, מומלץ לתת שם עם משמעות – למשל: לעמוד אודות הסלאג המומלץ יהיה כמובן about .

2. מילות מפתח / תגיות:

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

3. תיאור הדף:

תאור הדף חשוב מאד – הוא משמש כתאור הדף בתוצאות החיפוש בגוגל. בשדה זה “כל המוסיף – גורע, כלומר מומלץ ביותר לא לעבור את ה- 155 תווים המומלצים ע”י גוגל.
שימו לב – תאור זה לא מופיע באתר עצמו.

4. לשמור מוסתר?

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

5. עמוד אב

עמוד אב ממקם את העמוד היררכית – או בשידרה הראשית כאחד מהעמודים הראשיים (נושא / קטגוריה וכו’) או כעמוד משנה לעמוד אחר.
ברוב המקרים מומלץ שלא יהיו באתר יוצר מ- 7 או 8 עמודים ראשיים (אחרת הם עלולים שלא להיכנס לתפריט האתר, ולא יותר מ- 2 רמות של עמודי משנה, לדוגמה:

• • עמוד ראשי 1
    • תת עמוד 1
    • תת עמוד 2
      • תת-תת עמוד 1
      • תת-תת עמוד 2
    • תת עמוד 3
  • עמוד ראשי 2
  • עמוד ראשי 3
  • עמוד ראשי 4
  • עמוד ראשי 5
  • עמוד ראשי 6

6. תבנית

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

.

7. הוספה לתפריט

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

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

---

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

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

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

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

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

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

המעבר לאפשרות 1 , (מסך חדש עם פרטים נוספים של התמונה), מתוארת בתמונת המסך שלמטה:

ניהול תמונות (ושליחה אל השרת)  :
על מנת שתוכלו להוסיף תמונות  לעמודי אתרכם או לגלריות התמונות המשולבות בו התמונות צריכות להיות בספריית המדיה של האתר ולכן יהיה עליכם לשלוח אותן קודם אל מינהלת המדיה.
יהיה עליכם לשים לב שהתמונות בגודל סביר גם מבחינת גודל הקובץ (בשום אופן לא יותר מ- 250KB) וגם סבירות מבחינת המימדים (רוחב וגובה).
אם חשבתם לשלוח את התמונות ישירות מהמצלמה הדיגיטלית שלכם – תשכחו מהרעיון שכן התמונות אינן מוכנות עדיין לשימוש – הן גדולות ומאד כבדות מבחינת משקל הקובץ, שכן על פי רוב המצלמות ואפילו מצלמות הטלפונים הניידים מכוונות לאיכויות גבוהות הרבה יותר מהדרוש באתרי האינטרנט.
להכנת התמונות לשימוש באתר, השתמשו בעורך הגרפיקה המועדף עליכם (תוכלו להוריד עורך תמונות חינמי נהדר וקל לשימוש בשם “FastStone Image Viewer” בכתובת: http://www.faststone.org/FSViewerDetail.htm , יש לו גם גירסה ניידת שלא מצריכה התקנה וניתנת להפעלה מכל התקן USB ).

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

תוכלו לנווט בין הספריות השונות במינהלת המדיה על ידי לחיצה על שם הספריה בטור הימני ביותר, ניתן ליצור ספריות ותת-ספריות ללא הגבלה, ההגבלה היחידה היא לקרוא לספריות בשם המורכב מאותיות לטיניות, מספרים ומקפים (אמצעי או תחתון) וללא רווחים.
♦ רצוי בהחלט לסדר את הקבצים שלכם בתוך ספריות ולא סתם כך לשלוח את כולם אל ספריית המדיה הראשית שכן מהר מאד לא תמצאו את הקבצים שתצטרכו.
אם תרצו להוסיף קבצים אל ספרייה, כנסו אליה ולחצו על UPLOAD FILES (ראו חץ “הוספת קבצים” בצילומסך) , תיפתח לכם תיבת בחירת קבצים ממחשבכם האישי, סמנו את הקבצים הרלבנטים ולחצו על “אישור” או “OPEN” והקבצים יישלחו אל ספריית המדיה שבאתרכם .

הסרטון שלפניכם ימחיש לכם עד כמה מהיר ופשוט התהליך:

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

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

העיקרון הוא כזה:

• אתם מעלים את כל התמונות שאתם צריכים להציב בגלריה שלכם, אל תיקייה כלשהי באמצעות מינהלת המדיה של המערכת (הוראות שימוש במינהלת המדיה).
  התמונות צריכות להיות בגודל המתאים עבור העמוד שלך, (התמונות המוקטנות נוצרות ע”י המערכת באופן אוטומטי לפי ההגדרות שתגדירו בהגדרות הגלריה)
  מומלץ ליצור לכל גלריה תיקיה משלה במינהלת המדיה (חשוב לזכור כי שמות תיקיות ושמות קבצי התמונה צריכים להיות באותיות לטיניות בלבד וללא רווחים או סימנים מיוחדים כלשהם, הם כן יכולים להכיל מקפים תחתונים ורגילים כלומר : – ו- _ )
• אתם יוצרים “גלריה” עם שם ייחודי ועם ההגדרות שלה והתמונות שבה (הסבר תמצאו למטה).
• לכל גלריה יש קוד …  COPY–PASTE של הקוד הזה יציג את הגלריה בעמוד/עמודים בהם תדביק אותו כתוכן העמוד … (Placeholder )

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

יצירת גלריה חדשה

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

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

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

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

• ניתן לארגן את סדר התמונות ע”י תכונת גרירה-שחרור.
• תמיכה בכותרת, תיאור ותגיות לכל תמונה.
• הצגת הגלריות באופנים שונים ( fancybox, prettyPhoto, s3Slider , cycle , Supersized ).
• בחירה אם להפעיל אוטומטית רצף שקופיות.
• תכונות רבות נוספות

דוגמאות:

גלרייה מבוססת prettyPhoto
פלאגין מעולה של JQUERY הפותח תמונות בשכבת LIGHTBOX עם העברה בין התמונות כולל יצירת תמונות מוקטנות בתחתית כל סלייד למעבר מהיר בניהן.
גלריה מבוססת fancybox
כלי להצגת תמונות מוגדלות מ- THUMBNAILS , ללא תכונת סלייד-שואו אוטומטי
גלריה מבוססת s3Slider
s3Slider מציג סלייד תמונות המורכב מהתמונות עצמן, כותרות לתמונות ותיאור לכל תמונה, ישירות בעמוד בו מוצבת הגלריה.  כל התמונות חייבות להיות באותן המידות.
גלריה מבוססת jQuery Cycle plugin
cycle הוא פלאגין של JQUERY עם תמיכה בסוגים רבים של אפקטים לתחלופת תמונות
גלריה מבוססת SuperSized
לשם שימוש בגלריה זו יש צורך להשתמש בתבנית ריקה מכל עיצוב – עמוד המכיל את הגלריה בלבד, לכן השימוש בה במקרים מיוחדים בלבד

---

תוסף הגלריות – ניהול תמונות בגלריה קיימת

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

יש לבחור את הגלריה הרלבנטית ברשימת הגלריות וללחוץ על השם שלה (טור ימני)

עדכון פרטי הגלריה או הוספה/עדכון/מחיקה של תמונות

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

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

הוספת תמונות לגלריה:

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

יהיה עליכם לשים לב שהתמונות בגודל סביר גם מבחינת גודל הקובץ (בשום אותן לא יותר מ- 250KB) וגם מבחינת המימדים (רוחב וגובה).
אם חשבתם לשלוח את התמונות ישירות מהמצלמה הדיגיטלית שלכם – תשכחו מהרעיון שכן התמונות אינן מוכנות עדיין לשימוש – הן גדולות ומאד כבדות מבחינת משקל הקובץ, שכן על פי רוב המצלמות ואפילו מצלמות הטלפונים הניידים מכוונות לאיכויות גבוהות הרבה יותר מהדרוש באתרי האינטרנט.
להכנת התמונות לשימוש באתר, השתמשו בעורך הגרפיקה המועדף עליכם (תוכלו להוריד עורך תמונות חינמי נהדר וקל לשימוש בשם “FastStone Image Viewer” בכתובת: http://www.faststone.org/FSViewerDetail.htm , יש לו גם גירסה ניידת שלא מצריכה התקנה וניתנת להפעלה מכל התקן USB ).

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

תוכלו לנווט בין הספריות השונות במינהלת המדיה, ואם תרצו להוסיף קבצים אל ספרייה, כנסו אליה ולחצו על UPLOAD FILES (ראו חץ “הוספת קבצים” בצילומסך) , תיפתח לכם תיבת בחירת קבצים ממחשבכם האישי, סמנו את הקבצים הרלבנטים ולחצו על “אישור” או “OPEN” והקבצים יישלחו אל אתרכם .

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

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

כעת תוכלו לתת לתמונות שהוספתם שם / תאור / תגיות וכו’ כמו שמתואר בתחילת ההסבר

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

לא לשכוח לבצע שמירה לאחר ביצוע השינויים בגלריה

---

שימוש בתוסף הגלריות (הערות / תוספות וטריקים)

שליטה על מרחק הטקסט מהתמונות בגלריה מסוג CYCLE :
אם לא מכניסים מספר בשדה המוצג בתמונה, המרחק בין התמונות לניווט הגרפי של הגלריה (נקודות/מספרים וכו’ בהתאם לבחירתכם)  הוא גדול יחסית, לכן כדאי להכניס מספר ולשנותו לפי הצורך (לרוב מספר בטווח שבין 70 ל- 100).

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

חשוב להבין שניתן לבחור מבין 3 סוגי קישור:

1. קישור לעמוד פנימי באתר.
2. קישור לכתובת חיצונית ( מה שנקרא URL )
3. עוגן (קישור פנימי בתוך העמוד: מקפיץ מהקישור אל פיסקה שהגדרתם)
4. קישור לכתובת מייל (יפתח את תוכנת הדואר האלקטרוני של המשתמש וישלח דואר אל הכתובת אותה תגדירו בדיאלוג הקישור).

לקבלת הוראות השימוש במערכת  (לחיצה על הטאב “עזרה” בניווט העליון של מינהלת התוכן)  ראו צילומסך לפניכם.

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

---

לגבי גירסאות ישנות יותר של המערכת –  ראו צילומסך למטה (אחרי הכניסה למינהלה, לחצו על “תמיכה” בתפריט העליון ואז על “הוראות שימוש במערכת” בתת התפריט שייפתח מימין).

באופן כללי – העיקרון המנחה הבסיסי הוא שכמעט כל העבודה עם האתר מבוצעת ממינהלת העמודים (“עמודים” בסרגל העליון במינהלה)

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

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

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

• פוסט זה מנסה לפשט את כל נושא ניהול התמונות באתר – בין אם מדובר בתמונות הגלריות או בתמונות בעמודי האתר השונים (ושילובן בתכנים בעזרת העורך הויזואלי – סרגל ה- wysiwyg )

  בראש וראשונה חשוב להבין דבר אחד בסיסי – על מנת לשלב תמונות באתר הם חייבות להימצא (להישלח) על השרת שעליו יושב האתר !!!
  רק לאחר שהתמונות נמצאות על השרת ניתן לשלב אותן בתכנים.

  למרות שהפעולה ממש לא מסובכת, אני אחלק את ההוראות לשניים:

  1. שליחת התמונות אל השרת באמצעות מינהלת המדיה (איזור ה”קבצים” שבתפריט העליון במינהלת האתר).
  2. שילוב התמונות בתכני האתר / בגלריה באמצעות העורך הויזואלי.

  =========================================

  שליחת התמונות אל השרת:

  לשם שליחת התמונות אל השרת יש להיכנס אל מינהלת הקבצים (מינהלת המדיה) – לחיצה על “קבצים” שבתפריט העליון (כמו בתמונה)
  

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

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

  
  רק כאשר נמצאים בספריה המתאימה שאליה רוצים לשלוח את התמונות , לוחצים על הקישור “upload files and/or images” שבימין העמוד (מוצג בתמונה שלמטה):
  
  בלחיצה על הקישור תיפתח תיבת דיאלוג מהמחשב המקומי שלך ותאפשר לבחור קבצים ממחשבך (נין לבחור יותר מקובץ אחד) אשר לאחר בחירה ו”אישור” יישלחו אל ספריית השרת ( פס התקדמות נפרד יוצג לכל אחת מהתמונות שבחרת )

  בסיום – התמונות נמצאות על השרת וניתן לשלב אותן בתכני האתר (כולל בגלריות השונות של האתר).

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

  שילוב התמונות בתכני האתר :

  כאשר נמצאים בעמודי התוכן או המיקומים נוספים באתר (ניהול התבנית / עמוד הכניסה וכו’) נתקלים בסרגל העריכה הויזואלי שבראש שדה הזנת התוכן.
  להוספת תמונה באמצעות הסרגל, יש להציב את הסמן באיזור בו רוצים את התמונה, וללחוץ על כפתור הוספת התמונה ( מסומן באדום בתמונה שמתחת)
  
  לחיצה על כפתור ה”תמונה” – תפתח את תיבת הגדרות התמונה, שבו יש ללחוץ על “סייר השרת על מנת לבחור את התמונה הרצויה (  )
  לחיצה על הכפתור תפתח תיבת בחירת תמונה מתוך ספריית המדיה – עם תצוגה מוקטנת של התמונות שעוזרת להבין באיזו תמונה מדובר …
  לחיצה על התמונה הנכונה תבחר אותה ותסגור את הדיאלוג, כעל נשאר רק לסמן אם התמונה תיושר לצד כלשהו וכדומה – מה שמוצג בתמונה הבאה:
  

  ** הסבר מפורט יותר על שימוש בתיבת דיאלוג התמונות, תוכלו לראות בתגובה שמתחת

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

• 23 באפריל 2018 בשעה 22:28#206עריכה | העברה | פיצול | מחיקה | הודעת זבל | תגובה
  
  צביקה

  מנהל בפורום

  (85.64.42.170)

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

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

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

  , The Image Properties dialog window that will open lets you set configuration options that define image source, its size, display properties, or other advanced properties.

  The Image Properties dialog window includes four tabs that group image options:

  • Image Info
  • Link
  • Upload
  • Advanced

  For general information on using dialog windows please refer to the Dialog Windows section of the User’s Guide.

  Image Info

  The Image Info tab is the default tab that opens after you press the  button on the toolbar. It allows you to set the image URL and configure the way it will appear in the document.

  

  Image Info tab of the Image Properties window

  Below is an overview of all Image Info tab elements:

  • URL – the web address of the image. The image may be located on the same server as the web site you are currently in or on an external server.
    • External server: If you want to use an external address, use the full absolute path.Example:

      http://example.com/image1.jpg

    • Local server: If the image is located on the same server, you can use a relative path that omits the domain name and starts with a slash.Example:

      /images/image2.jpg

      If CKEditor is integrated with a file browser (like CKFinder), you can also use the Browse Server button to select an image from the ones that are available on the server.

  • Alternative Text – a short textual description of the image that tells users with assistive devices (like screen readers) what the image is about. You should always provide your images with meaningful alternative text in order to make it accessible to users with disabilities.

  • Width – the width of the image in pixels. By default this is the size of the original image.
  • Height – the height of the image in pixels. By default this is the size of the original image.

  • Border – the size of the solid border around the image in pixels.
  • HSpace – the horizontal spacing (or margin) between the image border (if present) or the image itself and other document elements that surround the image, in pixels.
  • VSpace – the vertical spacing (or margin) between the image border (if present) or the image itself and other document elements that surround the image, in pixels.
  • Align – the alignment of the image in the document. Available options are Right and Left.
  • Preview – a preliminary view of the selected image formatted according to the options chosen on the left.

  Image manipulation

  With CKEditor you do not have to worry about resizing your image.

  If the image is too big, you can alter its dimensions by entering new values into the Width and Height fields. By default the image ratio is locked, which you can see thanks to a  button. This means that when you change one of the size values (width or height), the other one will be adjusted automatically.

  If you want to freely modify both dimensions, click the  button in order to unlock the ratio. The button will now change to  and modification of one dimension will not automatically cause the other one to be adjusted. To lock the image ratio again, click the  button once more.

  You can easily return to original image size by pressing the  button. This will reset the image size; the original width and height will now appear in appropriate text boxes.

  Link

  The Link tab lets you assign a link to an image inserted into the document, effectively converting the image into a clickable link. The link can point to any kind of object available in the Internet, like a simple URL address, a PDF document, or an online video.

  This might prove especially useful if, for example, you want to add a thumbnail that would lead the reader of your document to a full-size copy of the image or add a company logo and point to its website.

  

  Link tab of the Image Properties window

  To use the Link functionality, first you need to insert an image into a document using the Image Info tab. After you configure the display options, switch to the Link tab and configure the image target using the available options.

  Below is the overview of all Link tab elements:

  • URL – the web address that the image should be pointing at. This may be a plain website address, an image, or other file that is located on the same server as the web site you are currently in or on an external server.
    • External server: If you want to use an external address, use the full absolute path.Example:

      http://example.com/

      http://example.com/largeimage1.jpg

    • Local server: If the target location is on the same server, you can use an absolute path that omits the domain name and starts with a slash.Example:

      /howto/images

      /images/largeimage2.jpg

      If CKEditor is integrated with a file browser (like CKFinder), you can also use the Browse Server button to select an image or a file from the ones that are available on the server.

  • Target – the window where the assigned link will open after clicking the image. You can choose between New Window (_blank), Topmost Window (_top), Same Window (_self), or Parent Window (_parent).

  

  If you want to edit an image that is connected to a link, use the context menu and choose the Image Properties option. The Image Properties window will let you modify both the image and the link that it is pointing to. If you double click such image instead, you will open the Link dialog window that will only allow you to edit the link properties and not the image itself.

  Upload

  The Upload tab of the Image Properties dialog window allows you to send your own images to the server. It is only visible if the server accepts files uploaded by the users and CKEditor is integrated with a file browser (like CKFinder).

  

  Upload tab of the Image Properties window

  To upload an image file, click the file input field or the Browse button next to it. When the file browser of your operating system opens, navigate to an appropriate folder and choose a file by double clicking it or using the Open button. To send the file to the server, click the Send it to the Serverbutton of CKEditor.

  Advanced

  The Advanced tab lets you configure additional image options such as assign it an ID, a class, a longer description, a tooltip, or CSS style properties. It is meant for advanced users with knowledge of HTML as well as CSS, and gives nearly endless possibilities as far as the presentation of the image is concerned.

  

  Advanced tab of the Image Properties window

  Below is the overview of all Advanced tab elements:

  • Id – a unique identifier for an image element in the document (id attribute).
  • Language Direction – the direction of the text: left to right (LTR) or right to left (RTL) (dir attribute).
  • Language Code – the language of the image element specified according to RFC 1766 (lang attribute).
  • Long Description URL – the web address of an HTML page containing a longer description of the image (longdesc attribute).
  • Stylesheet Classes – the class of the image element (class attribute). Note that an image element might be assigned more than one class. If this is a case, separate class names with spaces.
  • Advisory Title – the text of the tooltip that is shown when the mouse cursor hovers over the image (title attribute).
  • Style – CSS style definitions (style attribute). Note that each value must end with a semi-colon and individual properties should be separated with spaces

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

ברשימת העמודים אלה יש ללחוץ על שם העמוד המתאים על מנת לערוך אותו ( זה סידור היררכי, לכן לחיצה על הסמלונים של + או – תרחיב או תכווץ את הענף והעמודים שבו).

לאחר הלחיצה על שם העמוד תועברו למסך העריכה ובו תוכלו לשנות / לעדכן את התכנים כרצונכם … ובסיום כמובן יש ללחוץ על כפתור ה”שמירה”.

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

אל הסטטיסטיקה ניתן להגיע ממינהלת המערכת:

באיזור התמיכה יש ללחוץ על “חשיפות ומבקרים” שבתפריט המשנה מימין:

אזורי הסטטיסטיקה הראשיים הם:

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

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

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

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

מומלץ שלפני עריכת המאמר תעלו את התמונות המיועדות לשילוב בו, אל ספריית המדיה, ואז תוכלו להוסיפן למאמר ממינהלת התמונות בעזרת הכפתור “סייר השרת”.

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

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

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

לחצו “אישור” ושמרו את העמוד.