מדריך העברת אתר וורדפרס ל HTTPS – חלק א׳

לאחרונה העברתי את סאבי בלוג ל HTTPS.

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

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

מה זה HTTPS?

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

נכון לאוקטובר 2017, MozCast מדווחת כי 65% מתוצאות החיפוש של גוגל קשורים לאתרים בעלי תעודת SSL. עלייה של כ 27% מתחילת השנה, ניתן להסיק מכך שהמון אתרים מבצעים מעבר ל HTTPS.

mozcast-https-use-report


מדוע HTTPS צריך לעניין אתכם?

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

אבטחה

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

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

SEO

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

כהערת ביניים, קראתי לא מזמן על בחור בשם Matthew Barby שביצע אנליזה למיליון כתובות וגילה כי יותר מ 33% מהאתרים, המדורגים מקום ראשון שני ושלישי בגוגל משתמשים ב HTTPS.

אמינות

ידעתם שכ 28% מהגולשים מחפשים את המנעול הירוק בשורת הכתובות בדפדפן? מעבר לכך 77% מאותם אנשים מודאגים לגבי גניבת המידע שלהם ברשת.

ssl-security-address-barפרוטוקול HTTPS עוזר לעסק שלכם לבנות מה שנקרא SSL Trust. כאשר הגולשים באתר שלכם רואים את אותו מנעול ירוק, הם מקבלים שקט נפשי בצורה מיידית מכיוון והם יודעים כי המידע שלהם מאובטח.

אזהרות בדפדפן

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

form-and-incognito-http-no-ssl

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

ביצועים

יתרון אחרון אך לא פחות חשוב (בטח לפריקים של מהירות כמוני) הוא הביצועים של אתר הוורדפרס שלכם. העברת אתר וורדפרס ל HTTPS תאפשר לכם להשתמש בפרוטוקול בשם HTTP/2 הנגיש אך ורק לאתרים העובדים ב HTTPS. השיפור בביצועים מתקיים ממספר סיבות כגון שליחה של מספר אותות בערוץ תקשורת אחד (Multiplexing), האפשרות לשלוח ולקבל מספר רב של נכסים כגון תמונות וקבצי Javascript בו זמנית, HPACK Comperssion שמאפשר לכווץ Headers ו ALPN החוסך Round trips מיותרים.

שווה לציין כי אופטימיזציות מסויימות שאנו רגילים לבצע בכדי לשפר את מהירות הטעינה של אתרי הוורדפרס כגון איחוד קבצים, שימוש ב Image Sprites ועוד מספר אופטימיזציות, אינן רלוונטיות כאשר אתם משתמשים בפרוטוקול HTTP/2 ואף יכולים לפגום בביצועים של האתר שלכם. אכתוב על כך בקרוב אז אם לא תרצו לפספס, הכניסו את האימייל שלכם בטופס החמוד פה למטה  😉

על הדרך, הצטרפו לרשימת התפוצה !

העברת אתר וורדפרס ל HTTPS

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

  • כמובן, הדבר הראשון שעליכם לעשות הוא לרכוש תעודת SSL אם אין לכם כזו. גוגל ממליצה על על תעודה בעלת הצפנה של 2048bit או גבוה מזה. ההמלצה היא לקנות תעודת SSL מחברות כגון Comodo, DigiCert, GeoTrust או RapidSSL. ישנם גם אופציות זולות יותר כגון GoGetSSL, NameCheap ו GoDaddy. איני ארחיב במדריך זה על מה נכון לעסק שלכם.
  • וודאו כי שרת האחסון שלכם וספק ה CDN (אם קיים) תומכים ב HTTP/2. התמיכה ב HTTP/2 אינה חובה אך מומלצת לטובת הביצועים ומהירות אתר הוורדפרס שלכם.
  • תרצו לשים בצד מספיק זמן בכדי לבצע את המיגרציה, זהו לא תהליך שמסתיים ב 10 דקות.
  • וודאו כי לכל השירותים החיצוניים בהם אתם משתמשים באתר כמו גם לכל הסקריפטים שאתם טוענים באתר ישנה גירסת HTTPS.
  • חשוב לציין כי אתם הולכים לאבד את כל הלייקים, מס׳ השיתופים, ואף התגובות של הרשתות החברתיות אם לא תעקבו אחר ההוראות במדריך זה (בחלק ב׳ של המדריך) וזאת מכיוון והרשתות החברתיות מתייחסות לכתובת עם HTTP ככתובת חדשה ושונה לגמרי מכתובת HTTPS.
  • בהתאם לגודל האתר שלכם, לגוגל עלול לקחת זמן לסרוק את כתובות ה HTTPS החדשות של האתר. במשך זמן זה, יכול להיות כי תראו תנודות בדירוג שלכם במנוע החיפוש של גוגל.
  • השתדלו לבצע את המיגרציה בשעות בהן התנועה באתר שלכם היא הנמוכה ביותר על מנת לא לפגוע בחווית הגלישה של המשתמשים באתר הוורדפרס שלכם.
  • בצעו גיבוי לקוד האתר ולמסד הנתונים על מקרה שלא יהיה לפני תחילת התהליך.

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

השלבים שיש לבצע במעבר ל HTTPS

1. התקינו את תעודת ה SSL

לא אסביר במדריך זה כיצד להתקין את תעודת ה SSL בשרת שלכם. במידה אתם משתמשים ב cPanel אתם יכולים לעקוב אחר מדריך זה.

2. בדקו את תעודת ה SSL שלכם

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

qualy-ssl-labs-verify-ssl-certificate

3. בצעו הפנייה מ HTTP ל HTTPS

לאחר שוידאתם את תקינות תעודת ה SSL, עליכם לבצע הפנייה קבועה (Permanent Redirection – 301) של כל התנועה מ HTTP ל HTTPS. ישנן מספר דרכים לבצע זאת אך הדרך המומלצת היא לעשות זאת ברמת השרת.

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

הדרך בה אנו נבצע את ההפנייה היא הדרך הנכונה לבצע זאת גם ברמת SEO. שימוש בהפנייה מסוג אחר עלול לפגוע בדירוג שלכם במנועי החיפוש. חשוב לציין, כי סביר להניח שהפניית 301 אינה מעבירה 100% מה link juice, גם אם גוגל טוענת שכן. (יותר קרוב ל 90%).

הפניית HTTP ל HTTPS בשרת Apache – אם השרת שלכם מריץ Apache, אתם יכולים בקלות לבצע הפנייה של התנועה באתר הוורדפרס שלכם מ HTTP ל HTTPS באמצעות הוספה של הקוד הבא לקובץ .htaccess:

# FORCE SSL
RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

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

הפניית HTTP ל HTTPS בשרת Nginx – אם השרת שלכם מריץ Nginx תוכלו לבצע את ההפנייה ל HTTPS בצורה הבאה, הוסיפו את הקוד הבא לקובץ הקונפיגורציה של Nginx:

server { listen 80; server_name domain.com www.domain.com; return 301 https://domain.com$request_uri; }

שימו לב כי יש להחליף את הדומיין לדומיין שלכם.

4. הטמיעו HSTS Header (אופציונלי)

אינכם חייבים לבצע סעיף זה – (HSTS (HTTP Strict Transport Security הוא Header מאובטח אשר ניתן להוסיף לשרת שלכם. Header זה מכריח את הדפדפן להשתמש בחיבור מאובטח כאשר האתר עובד ב HTTPS. פעולה זו יכולה למנוע התקפות מסוג MitM ו Cookie Hijacking. מידע על פעולה זו תמצאו במאמר הבא.

5. בדקו כי אין יותר מדי הפניות

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

redirect-mapper-results

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

ישנם לא מעט דרכים לבצע את שינוי הקישורים במסד הנתונים מ HTTP ל HTTPS, אני ממליץ לכם להשתמש בתוסף בשם Better Search Replace על מנת לבצע פעולה זו. התהליך הוא מאד פשוט:

move-your-db-to-https

במידה והקישורים לאתר הוורדפרס שלכם, לעמוד הבית או לספרייה wp-content מוגדרים בקובץ wp-config.php, יש לשנות אותם בהתאם:

define('WP_HOME', 'https://yourdomain.com');
define('WP_SITEURL', 'https://yourdomain.com');
define('WP_CONTENT_URL', 'https://yourdomain.com/wp-content' );

7. עדכנו קישורים לסקריפטים וספריות חיצוניות

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

script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js

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

8. בצעו מיגרציה של ה CDN מ HTTP ל HTTPS

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

9. וודאו כי לא מופיעות אזהרות על Mixed Content

כעת יש לבצע את הבדיקה האחרונה לאתר הוורדפרס שלכם בכדי לוודא שאינכם מקבלים שגיאות על Mixed Content. שגיאות אלו מופיעות ב Developer Tools כאשר אתם טוענים נכסים (scripts, styles & images) באתר מ- HTTP ומ- HTTPS בו זמנית. כאשר אתם מבצעים מיגרציה ל HTTPS על כל הנכסים להטען ב HTTPS. הנה דוגמא לאזהרת Mixed Content:

mixed-content-warning

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

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

תוכלו גם בקלות לראות הערות ב Network Panel של Chrome Developer Tools במידה וקיים Mixed Content. ה Security Panel גם כן יכול להיות שימושי בכדי לראות בעיות מבחינה זו.

dev-tools-security-panel-ssl

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


לסיכום חלק א׳

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

נדמה לכם שבזה סיימנו? אתם טועים… אמנם האתר שלכם כרגע עובד ב HTTPS אך ישנם לא מעט פעולות שיש לבצע לאחר המיגרציה בפועל בכדי לא לפגוע בדירוג האתר שלכם ועליהם נסביר בחלקו השני של המדריך. פעולות אלו כוללות עדכונים של גוגל אנליטיקס, עדכונים שיש לבצע ב Google Search Console וכמובן לדאוג כי כל הלייקים, מספר השיתופים והתגובות של פייסבוק יישמרו באתר הוורדפרס שלכם.

אנא שתפו אותנו במחשבותיכם בתגובות מטה, ואם אהבתם את התוכן אל תשכחו לשתף! 🙂

רועי יוסף

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

תגובות פייסבוק

{ 14 תגובות… הוסף אחת }
  • רבין 15 באוקטובר 2017, 9:31

    נחמד, אבל האם יצא לך לתחזק אתר WP שצריך להיות נגיש גם ב-HTTP וגם ב-HTTPS, וכיצד התגברת על "בעיית" ה-ABSOLUTE PATH של קבצי המדיה ?

    • רועי יוסף 15 באוקטובר 2017, 13:58

      היי רבין,

      איני בטוח כי ישנה אפשרות לבצע זאת בוורדפרס, אולי איזשהו hack ב wp-config.php יכול לפתור את העניין אך לא ניסיתי מעולם בכנות. מדוע קיים שימוש ב absolute path בקבצי המדיה? אם איני מבין את כוונתך ואני מפספס משהו, אשמח אם תפרט 🙂

      • רבין 15 באוקטובר 2017, 17:05

        כאשר מטמיעים מדיה בפוסט הקישור אליו הוא קישור מלא (Absolute Path) ולא יחסי (Relative Path) יש דיון שלם על זה למה המפתחים של WP בחרו לעבוד ככה, בסופו של יום זה לא מאפשר לעבוד עם שתי הסכמות במקביל (או לפחות מקשה מאוד)

        לעניין הכתובת שירות מצאתי פיתרון שעובד לי כבר זמן מה – http://blog.rabin.io/sysadmin/make-wordpress-site-work-both-http-https לא הכי מרוצה ממנו, אבל עובד.

        לגבי בעיית המדיה, כרגע הפתרון היחיד שמצאתי זה להשתמש בתוסף מיוחד שמבצע HOOK לכל הקריאות ומסיר את שם האתר מה-URL. או להשתמש ב-WP SEARCH-AND-REPLACE ולהסיר את שם הדומיין.

  • חתול 15 באוקטובר 2017, 16:04

    מעניין, אבל כמה הערות.
    א. אפשר לקבל תעודה SSL בחינם מ־Let's Encrypt. חוץ מזה שהיא בחינם ההתקנה שלה קלה יותר מאשר תעודות בתשלום והעדכון יכול להיות אוטומטי. Let's Encrypt הוא ארגון ללא כוונת רווח שמטרתו להוסיף לאבטחה באינטרנט.
    החיסרון היחיד הוא שחלק מהשרתים השיתופיים לא תומכים בה אבל על VPS מומלץ להתקין אותה.
    ב. ב־nginx עדיף להפנות לכתובת https://$server_name$request_uri כלומר להשתמש במשתנה במקום להגדיר ידנית את כתובת האתר.

    • רועי יוסף 15 באוקטובר 2017, 16:07

      תודה חתול,

      א. אני מכיר את Lets Encrypt וחשבתי לציין זאת, אבל אתה בטוח שהם עובדים עם סיומות co.il ?
      ב. שלח לי את הקוד המלא, אנסה לעדכן בקרוב..

      • חתול 15 באוקטובר 2017, 16:11

        א. הם עובדים עם כל כתובת. אתה צריך להתקין אחת מהתוכנות שלהם על השרת והאימות שלו כבר קורה כמעט אוטומטית. ל־cpanel יש תוספים משלו אבל אני פחות משתמש בו.
        ב. ההפניה אצלי בשרת קצת שונה אבל זה הקוד שלך מתוקן:
        server { listen 80; server_name domain.com www.domain.com; return 301 https://$server_name$request_uri; }

  • Rubb 17 באוקטובר 2017, 10:18

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

    • רועי יוסף 17 באוקטובר 2017, 19:38

      היי 🙂

      התוסף לא מבצע את זה, אתה צריך לבצע את זה ידנית. בדוק בעיקר בקבצי ה- header, ה- footer ובקובץ functions.php של התבנית שלך..

      • Rubb 18 באוקטובר 2017, 9:11

        תודה, אז צריך להעתיק את קבצי ה-header וה-footer לתבנית הבת בשביל לשנות?
        מה קורה אם יש עדכון לתבנית? צריך לעשות את זה שוב?
        אין איזה משהו אוטומטי שיכול לסדר את זה באופן קבוע?

        • רועי יוסף 22 באוקטובר 2017, 20:39

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

          • Rubb 23 באוקטובר 2017, 8:54

            מקווה שיש איזה תוספים בשביל זה, מה אפשר לחפש בשביל זה?

  • יערה 22 באוקטובר 2017, 17:24

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

    תודה

    • רועי יוסף 22 באוקטובר 2017, 17:27

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

השאירו תגובה

שיתופים
קראו גם את:
אופטימיזציה לקונפיגורציה של וורדפרס באמצעות wp-config.php
אופטימיזציה לקונפיגורציה של וורדפרס באמצעות wp-config.php

משתמשי וורדפרס מכירים את הקובץ wp-config.php כאחד שמחזיק את הגדרות מסד הנתונים של וורדפרס. בקובץ...