בעבור אלימלך לייפר בנינו אתר

בעבור טרופיקל פיט חברת יבוא לנעליים בנינו קמפיין פרסום ברשתות חברתיות

בעבור דנית – מאלפת כלבים עיצבנו לוגו

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

בעבור נועם טיפול במגע עיצבנו לוגו וכרטיס ביקור

יעוץ אסטרטגי דיגיטלי, קמפיינים ברשתות חברתיות

בעבור חברת טוני טון עיצבנו לוגו ונוכחות ברשתות חברתיות

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

בעבור אבי כהן עיצבנו כרטיס לוגו וכרטיס ביקור

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

בעבור PClub פיתחנו צד לקוח של פלטפורמת משחקי רשת

מצפת באהבה אתר המרכז אמנים ויוצרים מאזור צפת. בעבורם בנינו אתר

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

למירי ליטווק בנינו אתר

לאסנת בנינו אתר

בעבור רחובות הנהר בנינו אתר

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

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

הפקת וניהול קמפיינים ממומנים במדיות שונות

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

אפליקצית מודל ללמידה מרחוק

אתר

לוגו

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

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

// create home widgets
    register_sidebar( array(
        //שם הווידגט
                          'name'          => __( 'The Home Widget 1' ),
        //תיאור שיופיע באזור עריכת הווידגט
                          'description'   => __( 'אזור ראשון בדף ראשי' ),
        //מזהה יחודי של הווידגט חייב להיות באותיות קטנות ללא רווחים
                          'id'            => 'a-home-widget-1',
        //מרקאפ שיופיע לפני הטייטל של הווידגט
                          'before_title'  => '
',
        //מרקאפ שיופיע אחרי הטייטל של הווידגט
                          'after_title'   => '
',
        //מרקאפ שיופיע לפני הווידגט
                          'before_widget' => '
',
        //מרקאפ שיופיע אחרי הווידגט
                          'after_widget'  => '
'
                      ) );

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

כעת אנחנו צריכים להוסיף קריאה לווידג'ט, בתוך קובץ sidebar-my.php הוסיפו את הקריאה לווידג'ט באופן הבא:

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

בכדי להוסיף סגנון לווידג'ט שלכם אתם יכולים להשתמש בIDים שהענקנו לווידג'ט ביצירה שלו(באזורי 'before_widget'ו 'after_widget')

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

כאשר 99.8% מהישראלים מחזיקים טלפון נייד ו 57% משוק המובייל בעלי  סמארטפונים קל להבין את חשיבות חווית המשתמש הנייד בתכנון האתר שלכם.

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

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

אז עיצוב רספונסיבי או אתר מוביילי?

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

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

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

לסיכום

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

התקנתם תוסף חדש ואתם רוצים להוסיף את השורטקוד שלו לווידג'ט בסרגל הצד? אין בעיה! רק צריך לתת לווידג'ט טקסט הבסיסי את היכולת להריץ שורטקודים.

1. נווטו אל תבנית הבת שלכם ופתחו את functions.php בעזרת מעבד התמלילים האהוב עליכם והוסיפו פילטר do_shortcode ל widget_text באופן הבא:

// Use shortcodes in text widgets.
add_filter('widget_text', 'do_shortcode');

2. שמרו וכנסו אל עיצוב > ווידג'טים שם הוסיפו את ווידג'ט הטקטס אל סרגל הצד שברצונכם להציג בו  שורטקוד.

3. כעת כל מה שנותר זה להוסיף את השורטקוד לתוך ווידג'ט הטקסט שבסרגל הרצוי

התקפות כוח גס (Brute Force Attacks) הן התקפות פשוטות וקלות להפעלה ונדמה שהמון מתקפות על אתרים מתבצעות בניגוד להאקינג מסורתי שמחפש חולשות בתוכנה ומנצל אותן לטוב או לרע (להאקינג או קראקינג) התקפות כוח גס מתבצעת כשתוקף מוצא טופס כניסה לאתר ומנסה אפשרויות בכדי לנחש את שם משתמש והסיסמא בעזרת שילובים של האלפאבית או בעזרת מאגר זוגות סדורים של סיסמה ושם משתמש (Dictionary attack) עד שימצא זוג שעושה את העבודה.
דמיינו לעצמכם שאתם בכניסה למועדון, השומר מאחורי הדלת שואל אתכם לשמכם בכדי לאמת אישור כניסה ברשימה שלו ואתם עומדים עם ספר טלפונים של ישראל ועוברים איתו שם אחרי שם עד שמצאתם שילוב שעובד. כך בערך התקפות כוח גס עובדות בגסות ובלי יותר מדי תחכום אבל אם לא נערכים אליהן מראש בסופו של דבר התוקף ימצא את השלוב הנכון. אז מה עושים כשילדי סקריפטים תוקפים לכם את wp-login כאקט מחאה גאופוליטי? יש כמה צעדים מונעים שאפשר לקחת בכדי להקשות מאוד על תוקף מהסוג הזה לפגוע בכם או לתפוס אותו בזמן.

1. עקבו אחרי נסיונות כניסה שנכשלו.

אין סיבה שלא ותמיד חשוב שכן, יש המון פלאגינים שמנגישים את קבצי הלוג כניסה מנסיון אני ממליץ על התוסף login-security (ע"י Tony Archambeau) אבל אם אתם נינג'ות רשת ורוצים לממש את זה בעצמכם אז ניתן להשתמש בהוק wp_login

2. הסירו את חשבון האדמין שלכם

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

3. השתמשו בסיסמא חזקה

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

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

דוגמא ליצרן סיסמאות שעובד יש באתר random

4. הגבילו גישה לwpconfig

הגבילו כניסה לwpconfig הוסיפו ב .httaccess הגבלת גישה לקובץ

# protect wpconfig.php


order allow,deny
deny from all

5. העבירו את עמוד הלוגאין מכתובת ברירת המחדל

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

6 הסירו את גרסאת וורדפרס מהאתר שלכם:

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

/**
 * remove version number from css and scripts
 */
function remove_wp_version_strings( $src ) {
	global $wp_version;
		parse_str(parse_url($src, PHP_URL_QUERY), $query);
	if ( !empty($query['ver']) && $query['ver'] === $wp_version ) {
		$src = remove_query_arg('ver', $src);
	}
	return $src;
}
add_filter( 'script_loader_src', 'remove_wp_version_strings' );
add_filter( 'style_loader_src', 'remove_wp_version_strings' );

/**
 * remove version number from the_generator
 */
function remove_wp_version() {
return '';
}
add_filter('the_generator', 'remove_wp_version');

6. אל תשכחו לגבות

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

בהצלחה!

ואם יעלו לכם שאלות, אל תתבישו לשאול למטה

בכדי להוסיף בוורדפרס CSS או סקריפטים לתור טעינה בקצה הקדמי של וורדפרס מומלץ להשתמש בהוק בwp_enqueue_scripts לפי הדוגמא הבאה:

function theme_name_scripts() {
	wp_enqueue_style( 'my-css', get_theme_root_uri() . '/themeDir/my.css' );
        wp_enqueue_script( 'my-js', get_theme_root_uri() . '/themeDir/my.js' );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

את ההוק ניתן להכניס לתוך קובץ ה functions.php שלכם חשוב להזכיר שאם הקובץ לא יהיה בתוך תבנית בת השינויים שתעשו ימחקו ברגע שהיה עדכון.

קבצי SVG או בשמם המלא Scalable Vector Graphics הם קבצי XML המשמשים לתיאור עצמים גרפיים יתרונם על קבצי פיקסל הוא שניתן להרחיב לכל מידה מבלי לפגוע באיכות התמונה.

דוגמא לקוד SVG יהיה השורה הזו שתיצור עיגול:

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

// allow SVG uploads 

add_filter('upload_mimes', 'custom_upload_mimes');

function custom_upload_mimes ( $existing_mimes=array() ) {

// Add file extension 'extension' with mime type 'mime/type'
$existing_mimes['svg'] = 'mime/type';

// and return the new full result
return $existing_mimes;

}

איך עורכים CSS באתר וורדפרס

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

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

יש כמה דרכים שונות להוסיף מאפייני CSS לאלמנט HTML, את חלקם ניתן להוסיף ישירות לHTML ואחרים אפשר להוסיף באמצעות CLASS או ID. למטרת המדריך בחרנו ליצור DIV ולתת לו ID שיקרא TEST.

<div>הוא תגית HTML שימושית שיכולה לקבל המון פרמטרים שונים, עליהם נרחיב במדריכונים אחרים.

את שם ה- ID שהענקנו לDIV נעתיק לקובץ ה- CSS של תבנית הבת שלנו וניצור שם אלמנט CSS חדש שעונה לשמו. בכדי לבחור את ה- ID נשתמש בסלקטור ה- ID, הוא הסימן סולמית # אחריו בלי רווחים נוסיף את שם ה- ID שיצרנו (test) ובתוך סוגריים מסולסלים את הצבע וערכו.

כעת, אחרי שהוספנו אלמנט HTML עם ID של CSS ובתוך קובץ ה- CSS הסברנו מה אנחנו רוצים שהוא יעשה אנחנו יכולים לרענן את העמוד ולראות את התוצאה

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

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