מערכות ניהול תוכן בקוד פתוח

גוגל אנליטיקס -
כלי שמאפשר לעקוב אחרי התנועה לאתר

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

לקרוא את ההמשך ←

השבוע נלמד על אינפוגרפיקה -

דרך יותר ברורה להציג מידע היא אינפוגרפיקה.

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

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

מינוס R – שפת תכנות שנותן לייצר מבסיסי נתונים מידע ויזואלים.

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

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

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

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

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

יש לנו 3 מרכיבים עיקריים:

תוכן

חזותי

ידע

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

מהו ארגז הכלים לאינפוגרפיקה?

איורים

גרפים

תרשימי זרימה

ציר זמן- טיים ליין אינטרקטיבי – דיפיטי dipity

גאפ מיינדר – גוגל רכשו אותו ושמו אותו תחת גוגל ספרד שיט

צור

גיליון אלקטרוני

מכניסים נתונים מספריים

מסמנים

הוסף

גאדג'ט

תרשים תנועה

כותרת

הנתונים צריכים להכיל -

שם

זמן

נתונים שונים

היתרון של הגאדגט של גוגל -

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

מפות זה גם כלי טוב לאינפוגרפיקה.

כיצדיוצרים אינפוגרפיקה?

נתונים מעניינים

מיון

ארגון

מוציאים מהם מסקנות ואז -

ייצוג ויזואלי

10 הדיברות ליצירת אינפוגרפיקה -

איפיון קהל יעד

רשימת רעיונות ליצירת תרשום

צבעיונות

גרפיקה

מסקנות ועובדות

הוספת תכנים

כלים באינפוגרפיקה -

Visual.ly – נותן סטטיסטיקות ואינפוגרפיקה

אפשר גם ליצור משלנו.

אתר יותר מומלץ – infogr.am

הכנסת נתונים וזה יוצר אינפוגרפיקה.

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

פיוזן טייבלס – fusion tables

ש"ב מדריכים לטיפים וטריקים

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

דוגמאות -

נתונים און ליין שניתן לחתוך אותם למשל תאונות דרכים

עוני בבתי ספר בוושינגטון

גוגל

צור

פיוזן טייבל ניסיוני – אם לא מופיע צריך ללחוץ על חבר יישומים נוספים

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

יש אפשרות ליצור לבד, להוציא טבלאות מהאינטרנט וכו'.

-למטה פליי עם דטה סייט ונותן תמונות, URL והוא בונה מתוך הטבלה מפה.

אינפוגרפיקה כלי מתאים לייצר אינטירקציה עם המשתמשים שלנו.

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

אנשים אוהבים ללמוד משהו חדש וללמוד משהו שהם אוהבים בדרך חדשה.

גאדגטים -

טיפים על גיליון נתונים של גוגל

תרגום -=GoogleTranslate (A2,"en", "he")

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

יצירת טבלה של בוס ועובדים – הוסף – גאדגט – תרשים ארגוני

היטמאפ – מקומות בעולם יותר צפופים וכו'

וורדתאג – חייבים להפוך את הגוגל לאנגלית -  כמו וורדל

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

עוד שבועיים – גוגל אנליטיקס

גיור תבניות -

איך בוחרים תבנית?

או שמפתחים אותה מ-0 (לא כדי), או שלוקחים תבנית ומגיירים אותה

 

יש אתרים שמציעים תבניות -

הכי מומלץ מהאתר של וורדפרס

WordPress.org/extend/themes

אפשר גם ל

 

אפשר לחפש תבניות מגויירות -

מה זה גיור? אני הולכת לכתוב מימין לשמאל ורובם זה משמאל לימין, וצריך לדאוג לתבניות בהתאם.

יש

Translation ready

נתינת תשתית

Rtl language support מגיע עם קובץ תרגום מחרוזות,צריך ליצור 2 קבצים עם סיומת PO. שם הקובץ הוא he_IL.po

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

הקובץ הנ"ל מתקמפל כי הוורדפרס מקבל רק קבצים עם סיומת MO

 

 

3 אספקטים-

מה שהדפדפן עושה בעצמו, dir

CSS דברים שמיושרים לימין מכוונה תחילה

תמונות, גבולות – המתכנת צריך לעשות

תרגום מחרוזות

 

לעבור על התבנית ולשים אותה בקובץ

 

תבנית מינמאלית

יש 2 קבצים -

אינדקס.PHP

סטייל.CSS

רוב התבניות מגיעות עם הרבה קבצים

 

איפה נשים את השינויים של התרגום?

אם נשים בסטייל זה דורס את התבנית הקיימת

אם רוצים לעדכן את התבנית זה לא טוב

 

אז נשים את זה בקובץ חיצוני, אבל איך וורדפרס ידע?

כאשר יש קובץ rtl.css וורדפרס קורא אותו אחרי הסטייל

 

עורך לPHP – NETBEANS

מאפשר מפגש בין 2 מחשבים

קובץ

ניו פרויקט

PHP

אופציה אחרונה – רומרט סרוור

(2 אפשרויות על כאשר הוורדפרס מותקן – אנחנו נבחר אפשרות שניה)

 

הורדת ערכת עיצוב דרך האתר של וורדפרס

חיפוש

Pinboard

התקן

 

אופציה שניה -

חיפוש התבנית

ואז פותחים בחלון חדש את התצוגה מקדימה

להוריד firebug – ניתן דרכו לשנו תאת הקוד

לפתוח את החלון הקטנה שלו למטה

ולהוסיף בשורה dir=rtl

וזה מראה לנו כמה עבודה תצטרך להיות לנו

להוריד את הקובץ

לשים על הדסקטופ

ולהעביר לשרת תחת CONTENT

Themes

 

אפשר גם דרך נטבינס

קליק ימני על Themes

הורדה

ולהוריד את התיקייה הספציפית של התבנית

 

התקנת תוסף

Rtl tester

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

להכניס תחת פלאגין

להיכנס לתוספים ולהפעיל אותו בלחצן ההפעלה

מראה לנו איך היה לפני שהיה משמאל לימין

 

לוחצים על F12

מחפשים את הכותרת שפה היא H1

מצד ימין רשום פלוט שמאל ולשנות לימין

תחת התיקייה של הסטייל שלנו ניצור קובץ CSS

קליק ימני עלהתיקייה ואז חדש ואז את האפשרות הראשונה

שנקרא לו RTL

למחוק את ההגדרה

 

להיכנס לtwentyeleven

ולהיכנס לrtl.CSS

ולהעתיק את החלק של הbody

ואז להעתיק את הID של הדבר שאנו רוצים לשנות אותו

ואז עושים פלוט לימין

 

אם יש מרגין שלא שווה אז צריך להפוך את המספרים

 

תרגום מחרוזות -

 

תוספים

תוסף חדש

Codestayle localization

הפעלה של התוסף

כלים

לוקליזציה

ערכות עיצוב

מצד שמאל שלו לוחצים על הוסף שפה חדשה

בוחרים עברית

יצירת קובץ PO

 

אם נכנסו לעריכה וזה ריק

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

ואז אפשר להיכנס שוב לעריכה ויופיע הכל

אפשר לחפש לפי המחרוזת

ולעשות לו עריכה

וזה משנה את המחרוזת שהייתה באנגלית

ואז חשוב ללחוץ למעלה על כפתור "צור קובץ MO"

 

מהיום השיעור יכלול שיעור ותרגיל.

היום נשלים את ניהול התוכן ונלמד לטפל בתבניות

 

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

 

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

 

ניהול תוכן ומדיה

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

 

הגדרת תמונה ראשית -

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

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

עמוד סטטי זה למשל עמוד של אודות, צור קשר ועוד.

 

העוצמה של הוורדפרס

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

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

 

הגדרות תצוגה של תמונה – קישור-

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

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

אפשר לשלוט בגודל של התמונה בהגדרה זו.

 

תמונה ראשית חדשה

תמונת כותרת

בוחרים תמונה

וחותכים אותה לפי רצונינו

 

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

מדיה

לוחצים על התמונה

ועושים מחק לצמיתות

 

פוסט שמכיל מספר תמונות

פוסט חדש

גלריית תמונות

הוסף מדיה

צור גלריה

בוחרים תמונות

שם יש אפשרות לשנות את המספר הטורים

 

סרגלי ניווט

עיצוב

תפריטים

מצד שמאל מסדרים לפי הסדר ואם רוצים שאחד יהיה מתחת לשני מסיטים את זה אחד שמאלה

מצד ימין צריך לבחור במיקום התבניות את שם התפריט שיצרנו

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

 

אפשרויות של תמונות

פוסטים

פוסט חדש

הוספת תמונה

אפשרויות נוספות

שינוי CSS – אפשר להחליט שיהיו תמונות מסוימות שיהיו תחת קלאס מסוים.

ואפשר גם לשנות שהתמונה תפתח בחלון חדש

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

 

הורדת ערכת נושא מהאינטרנט

עיצוב

ערכות נושא

התקנת ערכות עיצוב (לשונית למעלה)

REPORTER

מגזין – זו תבנית שמתנהגת כמו אתר חדשותי

אחרי שהורדנו את הקובץ זיפ של התבנית

הולכים לתיקייה שלנו תחת WP-CONTENT ואז לטימס ומעבירים את הזיפ.

ואז זה מופיע בתבניות

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

 

למה לא להוריד תבניות?

MASTERGATE – חברה שבונה תבניות

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

 

אפשרות עריכה של התבניות

עיצוב

עורך

אפשרות לשנות את התבנית

עדיף לעבוד בנוטפד ++

 

מהי תבנית?

איך התוכן יוצג?

מנגנון שמשפיע על -

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

2. עיצוב – גודל פנוט וכו'

 

למה בוחרים תבנית?

מהירות

 

סוגי תבניות -

בלוגים

פורטפוליו – תוכן שבעיקר תמונות ועבודות

חדשות – עדכניות, הצפה של תכנים

באדיפרדס – מגנון חברתית

איכומרס – אתרים למוצרים עם סל קניות

 

WP-TUTS+

Stackexchange

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

 

אתר להעלאת תבניות לוורדפקס

THEMEFOREST

 

ריספונס בדיזיין -

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

 

 

להגשה -

אתר וורדפרס

להגדיר מטרות קהל ידע ולתת איפיון של הדברים

מטרות השיעור -

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

שינוי אתר וורדפרדס -

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

 

מצד שמאל למעלה נראה את הפרופיל של המנהל שלנו, ניתן לערוך את הפרופיל האישי שלנו.

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

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

 

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

 

לשינוי כותרת יש בלוח הבקרה מצד ימין, הגדרות (נמצא למטה).

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

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

 

אפשר לשנות את ברירת המחדל למשתמשים חדשים.

איזורי זמן, תאריך

ולבסוף חשוב לעשות שמירה וזה אוטומטית משנה באתר.

 

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

להגדיר שרת מייל.

 

מה זה אומר לגהץ בוורדפרס?

 

קריאה – נמצא האינדוקס.

 

דיון – למנוע ממילים גסות

 

מדיה – מידות של התמונות

 

מבנה קישורים – איך הקישורים יראו, אפשרות להוסיף קטגוריות וכו'.

 

מצד ימין למעלה כתיבת פוסטים.

 

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

1. כדי לשנות הרשאות בתיקיות צריכים ללכת לFIREFTP

מחפשים את WP-CONTENT

ומוסיפים את התיקייה UPLOADS

עליו עכבר ימני פרופרטיז

ומסמנים את כולם בוי של כתיבה

ואז זה עובד.

 

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

מכניסים שם משתמש וסיסמה

פייל מנג'ר

דומיינ

לאתר שלנו

ואז פבליק HTML

נכנסים לתיקייה שלנו

ואז WP – CONTENT

יוצרים תיקייה חדשה למטה ואז משנים את הפרמישן ל-777

ואז נראה את זה למעלה בטבלה

 

מערכתתוכן מאוד משוכללת

 

פרסום מצד שמאל -

יש 3 מצבים – פורסם, ממתין לאישור, טיוטה.

תצוגה – מוגן בסיסמה, פרטי או ציבורי.

 

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

 

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

 

אפשר לעשות עורך טקסט ואז עובדים עם HTML

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

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

 

ספריית מדיה -

אפשר ליצור גלריות שאפשר לייצא מכל מיני אתרים.

 

WINDOWS LIVE WRITER

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

והיוזר והסיסמה

התוכנה מתחברת לאתר

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

ואפשר לכתוב דרך הוורד.

 

רוצים לייצר קטגוריות למשל לקשר את כל המדריכים להתקנה -

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

אותו פוסט יכול להיות בכמה קטגוריות

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

 

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

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

 

פעם אמרו שזה עוזר לגוגל למצוא את האתר.

 

מה ההבדל בין עמודים לפוסטים?

פוסטים זה דינאמי, עמ' פוסט  – מה שנכנס אחרון מופיע ראשון

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

 

יצירת עמוד חדש מצד ימין למעלה – עמודים

ואז עמוד חדש

 

מכניסים תוכן וגם תמונות

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

 

איך ניתן לחסום תגובות?

נכנסים לעמ' למטה תחת דיון מורידים למטה פתוח לתגובות

אם הדיון לא מופיע ללחוץ עלאפשרויות תצוגה למעלה מצד שמאל ומוסיפים את הדיון.

 

600 מילים בפוסט ממוצע זה המומלץ.

 

ליצר תפריט חדש – הולכים לעיצוב מצד ימין ואז תפריטים

תחת קישורים אפשר להוסיף אתרים.

מצד שמאל למעלה

 

סידור תתי קטגוריות באמצעות גרירה שמאלה וימינה.

 

מצד ימין תחת עיצוב יש וידג'טים -

מצד שמאל יש כותרת שניתן לשנות לקישורים.

 

מדריכים -

777

יצירת תוכן

קישורים

איך מוסיפים לסרגל העליון קישורים חיצוניים – רמז: תוסף

הוספת עמודים

קטגוריות

להסתיר תפריטים – להוריד להסיר דיון

איך עובדים עם וינדוס לייב רייטר

טיפול בהגדרות

 

שיעור הבא – נתמקד בוידג'טים וערכות עיצוב

 

ציון לקורס -

35% משחק הנקודות

עבודה סופית של 65%

תכנון ובניית אתר של וורדפרס

בשיעור הזה נלמד איך להתקין וורדפרס בעברית

ישנם מספר חלקים להתחברות -

1. הקמת תשתית של מסד נתונים עם שם וסיסמה – חשוב לשמור על הפרטים הללו בצד!!
2. הורדת תוכנת הוורדפרס
3. התחברות למסד הנתונים שיצרנו בעזרת הכנסת הנתונים לקובץ הנוטפאד (שינוי של 3 פרטים – דטה בייס ניים, שם משתמש וסיסמה שיצרנו בשלב הראשון). לאחר מכן, חשוב לשנות את שם הקובץ.
4. העתקת התיקיות והקבצים לשרת מהמחשב.
5. כניסה לאתר ע"י הכתובת של הרשת / שם התיקייה שלנו.
6. עולה האתר של וורדפס בו אנו נרשמים – אנו צריכים לתת שם לאתר, יוזר (רצוי לשנות מ-ADMIN) ואת האימייל שלנו ואפשר לצאת לדרך!

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