اذهب إلى المحتوى

دليلك المصور لتثبيت ووردبريس والبدء بإنشاء متجر ووكومرس


Ali Qassem

تعرفت في المقالتين السابقتين، مقال «الخطوات الابتدائية لإنشاء متجرك الإلكتروني: عنوان المتجر وحجز النطاق (Domain)» ومقال «أنواع الاستضافات وكيفية اختيار أفضل استضافة لموقعك أو متجرك الإلكتروني»، على مفهوم الاستضافة وأنواعها المختلفة، أما الآن فسوف تتعرف على المنصة التي سوف تقوم ببناء متجرك باستخدامها وكيفية القيام بذلك باستخدام ما يُدعى بالخادم المحلي أو الاستضافات المجانية.

فهرس المقالة لتبسيط التنقل فيها أو اختيار طريقة تثبيت محددة والانتقال إليها مباشرة:

نبذة عن ووردبريس

هو عبارة عن برمجية مفتوحة المصدر يمكن استخدامها لإنشاء مواقع الكترونية، أو مدونات أو تطبيقات. وحتى اللحظة، حوالي 38% من المواقع الالكترونية تستخدم ووردبريس من أشهرها موقع Rolling Stone و Bloomberg Professional وموقع Sweden Sverige.

إنَّ سهولة استخدام ووردبريس ساهمت في انتشاره الواسع بين المدونين إضافة إلى كونه برمجية مجانية لا تحتاج دفع أي رسوم لقاء استخدامها، وبالرغم من وجود العديد من البرمجيات مفتوحة المصدر مثل Joomla و Drupal إلا أنّها لم تستطع السيطرة على عالم الويب كما فعل ووردبريس.

معنى برمجية مفتوحة المصدر هي برمجية مرخصة ضمن شروط معينة ويمكن أن نقول أن هذه البرمجية مفتوحة المصدر إذا حققت الشرطين التاليين:

  • يتوفر الكود المصدري لهذه البرمجية دون أي تكاليف إضافية، أي يستطيع المستخدم رؤية الكود الذي يشكل البرمجية وله الحق بعمل أي تعديل يريده عليها.

  • يمكن إعادة إنشاء إصدار جديد من هذه البرمجية حسب حاجة المستخدم وهذا يعني أنَّ أي شخص يمكنه الحصول على الكود وتوزيع نسخته المعدلة منه والخاصة به.

طبعًا عبارة مفتوحة المصدر لا تعني بالضرورة أن البرمجية القابلة للتنفيذ تقدم بشكل مجاني ولكن الكود المصدري لهذه البرمجية يمكنك الحصول عليه مجانًا.

ميزات ووردبريس

  • مجاني، حيث تستطيع تحميل البرمجية وتثبيتها واستخدامها بشكل مجاني مع إمكانية الوصول لعدد ضخم من القوالب والإضافات المجانية أيضًا.
  • سهل الاستخدام ولا يحتاج لخبرة برمجية للتعامل معه كما أن الويب مليء بدروس مجانية تشرح كيفية استخدامه وحتى تطويره (هذا الدرس أحدها).
  • فريق التطوير للووردبريس يعمل بشكل مستمر لسد الثغرات الأمنية وبالتالي مستوى الأمان عالٍ.
  • متوافق مع محركات البحث مثل جوجل وياهو وبينغ.
  • متوافق مع مختلف الأجهزة (حاسوب، حاسب محمول، حاسب لوحي، الهواتف الذكية)
  • يمكن تطوير ووردبريس من خلال استخدام إضافات أو قوالب مدفوعة وبتكلفة منخفضة

سلبيات ووردبريس

  • سهل التصميم بما يتعلق بالأمور الأساسية مثل تغيير الألوان، الخطوط وحجمها ولكن قد تضطر للجوء لإضافة كود في بعض التصاميم والتعديلات.
  • وجود عدد ضخم من القوالب والإضافات المجانية هو أمر إيجابي إلا أنَّ هذا ينعكس سلبًا على المستخدم عندما يقوم مبرمج القالب أو الإضافة بالتوقف عن تحديثها وسد الثغرات التي تظهر مستقبلًا.
  • سرعة التحميل التي يمكن الوصول لها باستخدام ووردبريس دون أي تعديل لا تحقق المستوى المطلوب من محركات البحث مثل جوجل (أقل من 3 ثانية).
  • استخدام إضافات وقوالب مطورة من قبل مبرمجين مختلفين يسبب في بعض الأحيان تعارض في عمل هذه البرمجيات.

تثبيت ووردبريس

بالنسبة لهذه الخطوة فهنالك طرق مختلفة لتثبيت ووردبريس باستخدام الحاسوب كمخدم محلي أو باستخدام استضافة مخصصة للمواقع ويجب الانتباه أنَّ الطريقة التي تعتمد الحاسوب كمخدم محلي تختلف حسب نظام تشغيله (ويندوز أو لينكس). أما تثبيت ووردبريس على استضافة فيختلف حسب الشركة المقدمة للاستضافة وحسب نوع الاستضافة.

سنعمل على تثبيت ووردبريس باستخدام مخدم محلي، ولكن يوجد مخدمين محليين هما الأكثر استخداما XAMPP وWampServer لذا لا بدَّ من شرح خطوات تثبيت ووردبريس على كل منهما.

استخدام XAMPP كخادم محلي

قم بتنزيل البرنامج عبر الرابط XAMPP، سوف تجد ثلاث خيارات بالنسبة لنظام ويندوز. قم باختيار النسخة التي تدعم أحدث إصدار من PHP (أي PHP 7.4.10 أثناء كتابة المقال)

001_xampp_download.jpg

بعد إكمال التنزيل، شغِّل ملف التثبيت. قد تظهر لك هذه الرسالة التحذيرية والتي تطلب عدم تثبيت البرنامج ضمن ملف Program Files الموجود على القرص C لأن هذا المجلد لا يمتلك حقوق الكتابة وذلك لتفعيل User Account

002_xampp_installation_directory_change.jpg

اضغط على Ok لتظهر لك النافذة الآتية.

003_xampp_installation_step_1.jpg

اضغط على Next لتظهر لك نافذة جديدة يمكن من خلالها تحديد بعض الملحقات التي تريد أو لا تريد تثبيتها ضمن برنامج XAMPP.

004_xampp_installation_step_2.jpg

لا تقم بأي تغيير على الخيارات واضغط على Next لتظهر لك نافذة تحدد فيها مسار تثبيت برنامج XAMPP.

005_xampp_installation_step_3.jpg

يمكنك تغيير مسار التثبيت لقرص آخر إن رغبت بذلك. بعد اختيار المسار اضغط على Next. الآن يجب عليك اختيار لغة واجهة برنامج XAMPP وبما أن اللغتين المتوفرين هما الإنجليزية والألمانية، عليك باختيار اللغة الإنجليزية.

006_xampp_installation_step_4.jpg

اضغط على Next لتظهر لك النافذة الآتية.

007_xampp_installation_step_5.jpg

اضغط على Next أيضًا.

008_xampp_installation_step_6.jpg

اضغط على Next لبدء عملية تثبيت البرنامج والتي تستغرق بعض الوقت وهذا يعتمد على مواصفات حاسوبك.

عند انتهاء عملية التثبيت سوف تظهر لك النافذة الآتية.

009_xampp_installation_step_7.jpg

اضغط على Finish لإغلاق نافذة التثبيت وتشغيل برنامج XAMPP بشكل تلقائي.

010_start_xampp_step_1.jpg

سوف أقوم بعمل مراجعة سريعة لبعض محتويات النافذة الرئيسية للبرنامج:

  • أباتشي (Apache) هو عبارة عن برمجية مجانية مفتوحة المصدر تعمل كمخدم ويب لاستقبال الطلبات وإرسال الملفات لزائر الموقع.
  • MySQL هي نظام إدارة قواعد بيانات علائقية مفتوح المصدر متوفر مجانًا، يستخدم لإنشاء وتخزين قواعد البيانات.
  • خيار Config الموجود بجانب كل وحدة يسمح لك بتغيير قيم متغيرات معينة لن نتطرق لها في هذا الجزء حاليًا وعمليًا أباتشي هي الوحيدة التي نضطر للتعديل على القيم التي تحدد عملها.
  • Tomcat وحدة تسمح لك بتشغيل أكواد جافا وهذا أمر لن نحتاجه أثناء التعامل مع ووردبريس
  • Mercury وحدة تسمح لك بإرسال العديد من رسائل البريد الإلكتروني وهي مفيدة في حال كنت تعمل على بناء تطبيق خاص بمواضيع البريد الالكتروني.

يجب التنويه في حال لم يعمل البرنامج بشكل تلقائي بعد انتهاء التثبيت يمكن الوصول له من خلال مربع البحث في شريط الأدوات وكتابة اسم البرنامج XAMPP كما هو موضح في الصورة الآتية.

011_start_xampp_step_2.jpg

الآن عليك تشغيل وحدة أباتشي (Apache) وذلك بالضغط على مفتاح Start المقابل لها وسوف تظهر لك نافذة تنبيه من ويندوز (فقط عند التشغيل لأول مرة) تطلب السماح بالوصول.

012_start_xampp_step_3.jpg

اضغط على "سماح بالوصول". سوف تلاحظ أن كلمة Apache أصبحت محاطة باللون الأخضر إضافة إلى عبارة في أسفل التطبيق (محددة باللون الأزرق) تدل على أن وحدة أباتشي (Apache) موجودة وتعمل.

013_start_xampp_step_4.jpg

الآن، عليك تشغيل وحدة MySQL وذلك بالضغط على مفتاح Start المقابل لها. سوف تظهر لك نافذة تنبيه من ويندوز (فقط عند التشغيل لأول مرة) تطلب السماح بالوصول.

014_start_xampp_step_5.jpg

اضغط على "سماح بالوصول". سوف تلاحظ أنَّ كلمة MySQL أصبحت محاطة باللون الأخضر إضافة إلى عبارة في أسفل التطبيق (محددة باللون الأزرق) تدل على أنَّ وحدة MySQL موجودة وتعمل.

015_start_xampp_step_6.jpg

أحيانًا قد تظهر مشكلة أنَّ المنفذ محجوز لذا سنحل الآن مشكلة تعارض المنافذ Port conflicts فأحد المشاكل التي قد تواجهك عند تشغيل XAMPP هي إشغال المنفذ الذي يجب على XAMPP استخدامه وهو المنفذ 443 والمنفذ 80.

port notes.png

في حال ظهور الخطأ المبين في الصورة فمن الواضح أنَّ البرنامج الذي يسبب هذا التعارض هو سكايب (Skype) ويكفي إغلاقه من الخلفية لتحرير المنفذ وبالتالي يعمل XAMPP دون مشاكل.

هذا الحل قد يكون غير محبذ من قبل البعض وخصوصًا من يعتمد بشدة على برنامج Skype لذلك الحل يكون بتغيير المنافذ التي يعمل عليها الخادم المحلي XAMPP ويمكنك اعتماد هذا الحل أيضًا في حال لم تُحل المشكلة بعد إغلاق برنامج Skype.

قم بتشغيل XAMPP دون تنشيط أي وحدة واضغط على Config ثم Apache (httpd.conf) كما هو موضح في الصورة.

xampp_port_fix.jpg

الآن ابحث عن السطر الذي يحتوي على عبارة Listen 80 وغيره إلى Listen 8080 (أي رقم آخر غير 80 ونحاول أن يكون أكبر من 1024 كي لا يكون محجوز من قبل برنامج آخر أو من أحد خدمات نظام ويندوز).
أيضًا عليك البحث عن ServerName localhost: 80 وغير الرقم 80 إلى نفس الرقم السابق 8080 ثم قم بحفظ التغييرات وإغلاق المجلد.

أعد تشغيل برنامج XAMPP وقم بتنشيط وحدة Apache ووحدة MySQL ليعمل دون أخطاء.

الآن عد للمتصفح وقم بكتابة العنوان التالي 127.1.1.1 في مربع العناوين في أعلى المتصفح ثم اضغط Enter (يمكن استعمال localhost أو هذا العنوان الذي يعتبر عنوان خاص محجوز لهذا البرنامج والذي تستجيب له وحدة أباتشي ضمن برنامج Xampp عند طلبه على المتصفح ويمكن تغيير هذا العنوان من إعدادات البرنامج إن دعت الحاجة لذلك).

016_localhost_xampp_step_1.jpg

سوف يقوم المتصفح بإعادة توجيهك إلى صفحة مرتبطة ببرنامج XAMPP وهكذا تكون قد تأكدت من أن البرنامج يعمل بشكل صحيح.

017_localhost_xampp_main_page.jpg

الآن وبعد الانتهاء من تثبيت الخادم المحلي والتأكد من عمله بشكل صحيح وظهور الصورة أعلاه أصبحت بيئة العمل جاهزة لتثبيت ووردبريس عليها لذلك توجه إلى موقع ووردبريس لتنزيل أحدث نسخة منه.

018_wordpress_download.jpg

اضغط على المربع الأزرق الذي يحوي عبارة "Download WordPress". بعد انتهاء التنزيل، توجه إلى مكان الملف (عادة في التنزيلات) وقم بنسخه.

الخطوة التالية هي في القرص C (حسب مسار التثبيت الذي اخترناه سابقا)، توجه إلى مجلد XAMPP ثم بعد ذلك توجه إلى مجلد htdocs

020_xampp_htdocs_directory.jpg

سوف نقوم ضمن هذا المجلد بإنشاء مجلدات لجميع المواقع التي نريد بناءها (السبب أن XAMPP يرى هذا المجلد كأنه مخدم هدف يرسل له الطلبات ويستقبل منه الملفات سواء المرسلة من الموقع للزائر أو العكس).

قم بإنشاء مجلد جديد واختر له الاسم الذي تريد (اخترت للسهولة اسم test). يجب ألا يحوي الاسم فراغات أو الرموز التي لا يقبل بها ويندوز في اسم المجلد. اسم test سوف نستخدمه لاحقا للوصول للموقع عبر المتصفح.

بعد إنشاء المجلد test قم بالدخول إليه وإلصاق نسخة عن الملف المضغوط الذي يحتوى ملفات ووردبريس، ثم قم بفك ضغط محتوياته. سوف تحصل على مجلد اسمه wordpress.

021_unzip_wordpress.jpg

ادخل إلى مجلد wordpress وقم بنقل محتوياته إلى مجلد test

022_paste_wordpress_folder_content.jpg

الآن، قم بحذف المجلد الفارغ wordpress والملف المضغوط.

بعدها، عليك إنشاء قاعدة بيانات للموقع. سوف تقوم بذلك من خلال phpmyadmin وللوصول له عليك بالتوجه للمتصفح وكتابة العبارة الآتية في مربع عنوان الموقع: 127.1.1.1/phpmyadmin

phpmyadmin هي أداة برمجية مفتوحة المصدر مكتوبة بلغة بي اتش بي (PHP) والهدف منها إدارة قواعد البيانات MySQL على شبكة الويب بطريقة تفاعلية وسهلة.

023_head_to_phpmyadmin.jpg

الآن يجب أن تظهر لك واجهة phpmyadmin بهذا الشكل إن كانت لغة الحاسوب والمتصفح هي العربية.

024_phpmyadmin_main_page_arabic.jpg

كما تلاحظ فإن تنسيق الصفحة غير متوافق بشكل جيد مع اللغة العربية لذلك عليك باختيار اللغة الإنجليزية لعرض phpmyadmin بشكل صحيح (سوف أكمل الشرح باستخدام واجهة اللغة الإنجليزية لأن هذا ما سوف يصادفك في جميع الاستضافات المشهورة).

تستطيع تغيير اللغة من قسم إعدادات المظهر، يوجد قائمة بالضغط عليها تظهر جميع الخيارات لتختار منها الإنجليزية.

025_phpmyadmin_main_page_choose_english.jpg

بعد الانتهاء من الخطوة السابقة يجب أن تظهر لديك واجهة phpmyadmin بهذا الشكل.

026_phpmyadmin_main_page_english.jpg

الآن عليك إنشاء قاعدة بيانات ومستخدم مرتبط بها، يوجد طريقتان للقيام بهذه الخطوة، الأولى تقوم على مبدأ إنشاء المستخدم أولًا ومنه إنشاء قاعدة بنفس الاسم مرتبطة به مع إعطائه كامل الصلاحيات والثانية يتم أولًا إنشاء قاعدة البيانات ثم إنشاء المستخدم من خلالها وإعطائه كامل الصلاحيات المطلوبة.

الطريقة الأولى:

اضغط على User Accounts في الشريط العلوي لـ phphmyadmin لتظهر لك الواجهة التالية.

027_phpmyadmin_user_accounts.jpg

الآن، عليك الضغط على رابط Add user account الموجود ضمن قسم New. هذا سوف ينقلك إلى الواجهة الآتية.

028_phpmyadmin_add_new_user_step_1.jpg

الآن عليك اختيار اسم للمستخدم (هذه الطريقة يكون اسم المستخدم وقاعدة البيانات نفس الاسم) من خلال الحقل الفارغ بجانب User name. أيضا يجب اختيار Local من القائمة المنسدلة للحقل Host name (أي أن قاعدة البيانات وملفات الموقع على نفس المخدم) كما هو موضح في الصورة التالية.

029_phpmyadmin_add_new_user_step_2.jpg

بعد اختيار Local سوف تظهر عبارة localhost في الحقل الملاصق لها على اليمين. الآن عليك اختيار كلمة مرور قوية لهذا المستخدم أو يمكنك الضغط على مفتاح Generate لتوليد كلمة المرور بشكل آلي (أنصح بذلك) وعليه تصبح الواجهة كما يلي.

030_phpmyadmin_add_new_user_step_3.jpg

ملاحظة مهمة: عليك نسخ كلمة المرور وحفظها في مكان ما لأنك سوف تحتاجها في خطوة لاحقة من عملية تثبيت ووردبريس. (يمكنك استخدام تطبيقات آمنة مثل KeePassX لحفظ كلمات المرور).

الآن ننتقل للقسم الثاني من الواجهة السابقة الموضع بالصورة التالية:

031_phpmyadmin_add_new_user_step_4.jpg

قم باختيار Create database with same name and grant all privileges أي إنشاء قاعدة بيانات بكامل الامتيازات ثم اختيار Check all ليظهر لديك الشكل التالي.

032_phpmyadmin_add_new_user_step_5.jpg

الآن أصبح كل شيء جاهز لإنشاء اسم المستخدم وقاعدة البيانات المرتبطة به. كل ما عليك القيام به هو الضغط على مفتاح Go في الزاوية السفلية اليمنى من النافذة.

033_phpmyadmin_add_new_user_step_6.jpg

لتتأكد أن جميع الخطوات السابقة تمت بنجاح، يجب أن تظهر لك رسالة مشابهة لمضمون الصورة التالية.

034_phpmyadmin_add_new_user_step_7.jpg

الطريقة الثانية:

يمكنك العودة للواجهة الأساسية من خلال الضغط على عبارة phpmyadmin الموجودة على يسار النافذة. بعد ذلك قم بالضغط على Databases الموجودة في الشريط العلوي لتظهر لك الواجهة التالية.

035_phpmyadmin_add_new_database_step_1.jpg

الآن، اختر اسم قاعدة البيانات واكتبه ضمن حقل Database name ثم اضغط على مفتاح Create.

036_phpmyadmin_add_new_database_step_2.jpg

الاسم الذي اخترته هو test2. بعد الضغط على مفتاح Create سوف يتم إنشاء قاعدة البيانات test2 التي لا تحتوي أي جداول.

037_phpmyadmin_add_new_database_step_3.jpg

الآن يجب عليك إنشاء اسم مستخدم مرتبط بقاعدة البيانات هذه وذلك من خلال الانتقال لنافذة Privileges من خلال النقر عليها.

ملاحظة مهمة: لاحظ أننا ضمن قاعدة البيانات test2، أي لن تظهر نافذة Privileges ما لم تكن قد اخترت قاعدة بيانات موجودة مسبقًا وأي مستخدم يتم إنشاؤه هو مرتبط بقاعدة البيانات المُختارة فقط.

038_phpmyadmin_add_new_database_step_4.jpg

اضغط على Add user account ضمن قسم New لتظهر لك نفس النافذة التي استخدمناها في الطريقة الأولى. أدخل اسم قاعدة البيانات، اختر Local وقم بتوليد كلمة المرور وحفظها للاستخدام لاحقا.

ملاحظة مهمة: يمكنك اختيار اسم مختلف لاسم المستخدم أي ليس بالضرورة أن يكون نفس اسم قاعدة البيانات.

في القسم الثاني من النافذة عليك باختيار Grant all privileges on database (سوف تجد في آخر العبارة اسم قاعدة البيانات التي تُنشئ المستخدم لها) ثم اختر Check all كما هو موضح في الصورة التالية.

039_phpmyadmin_add_new_database_step_6.jpg

بعد ذلك عليك بالضغط على مفتاح Go في أسفل النافذة من جهة اليمين وفي حال إنشاء ناجح للمستخدم سوف تظهر لك رسالة مشابه للصورة التالية.

040_phpmyadmin_add_new_database_step_7.jpg

أصبحت الآن جاهز لتبدأ بتثبيت ووردبريس لذلك قم بفتح تبويب جديد ضمن المتصفح وأدخل العنوان التالي: ‎127.1.1.1/test

مكان كلمة test يمكنك وضع اسم المجلد الذي اخترته ولكن إن كنت تتابع خطوة بخطوة معي فإن اسم المجلد الذي اخترته للموقع هو test.

041_wordpress_installation_step_1.jpg

في الحالة العادية فإن هذا العنوان سوف يأخذك للموقع ولكن حتى الآن لم نقم بتثبيت الووردبريس لذلك وفقط أول مرة سوف يتم توجيهك لصفحة تثبيت ووردبريس التالية.

042_wordpress_installation_step_2.jpg

اضغط على عبارة Let's go.

043_wordpress_installation_step_3.jpg

بجانب حقل Database Name يجب أن تضع اسم قاعدة البيانات وهو حسب ما اخترت في الخطوات السابقة test، أيضًا نحتاج اسم المستخدم وهو نفسه اسم قاعدة البيانات (اعتمدنا الطريقة الأولى) أي test. بالنسبة لكلمة المرور فقد قمت بحفظها على notepad أو keepassx وعند مستخدم قاعدة البيانات اخترت أن يكون مخدم قاعدة البيانات محلي Local وبالتالي سوف أحافظ على localhost. حاليا عليك أن تعلم أن Table Prefix هي البادئة التي تبدأ بها أسماء الجداول ضمن قاعدة البيانات ولك الحرية في اختيار البادئة التي تريد (يزيد من أمان قاعدة البيانات) ولكن هنا سوف أحافظ عليها للحفاظ على بساطة الخطوات.

يجب أن تكون البيانات لديك كما هو موضح في الصورة التالية (كلمة المرور لديك سوف تكون مختلفة).

044_wordpress_installation_step_4.jpg

اضغط الآن على Submit لتظهر لك النافذة التالية.

045_wordpress_installation_step_5.jpg

اضغط Run the installation واصبر بضع دقائق أو أقل، هذا يعتمد على مواصفات حاسوبك. بعد اتمام مرحلة التثبيت الأولى سوف تظهر لك النافذة التالية لملء معلومات عن الموقع.

046_wordpress_installation_step_6.jpg

ضع اسم الموقع باللغة العربية أو الإنجليزية بجانب site title، أما بالنسبة لاسم المستخدم فهذا مستخدم مختلف عن المستخدم الذي أنشأناه في مرحلة قاعدة البيانات حيث أنَّ هذا المستخدم سيكون مدير الموقع وله صلاحيات الدخول والتغيير فيه لذلك سوف اختار الاسم admin. ملاحظة: اسم المستخدم يجب أن يتألف من أحرف إنجليزية وبدون فراغات، يمكن استخدام _ بدل الفراغ.

كما تلاحظ فإن كلمة المرور مولدة بشكل تلقائي ولكن باستطاعتك تغييرها واستخدام كلمة خاصة بك، المهم ألا تنساها (أنصح بتسجيلها على تطبيق KeePassX الذي أشرنا إليه آنفًا). بجانب Your Email عليك وضع البريد الالكتروني لمالك الموقع وهنا سوف أختار بريد عشوائي admin@gmail.com.

ملاحظة مهمة: بعض الأحيان عند إنشاء الموقع، يكون من المستحسن ألا يتم أرشفته من قبل محركات البحث لأن المحتوى قيد الإنشاء ولذلك يقدم ووردبريس خيار لمنع محركات البحث من أرشفة الموقع وهو مبين في نهاية النافذة تحت مسمى Search Engine visibility. يتم تفعيله فقط إن كان بناء الموقع سوف يستغرق فترة زمنية كبيرة. بعد ملء البيانات يجب أن تكون المعلومات لديك مشابهة للصورة التالية (إلا كلمة المرور).

047_wordpress_installation_step_7.jpg

اضغط على Run the installation لتظهر لك النافذة التالية.

048_wordpress_login_step_1.jpg

اعتمد على KeePassX في حفظ كلمات المرور وبعدها سوف اضغط على Log in ليتم توجيهي لوجهة تسجيل الدخول الافتراضية لأي موقع ووردبريس.

049_wordpress_login_step_2.jpg

املأ البيانات وقد بالضغط على Log in ليتم توجيهك إلى لوحة تحكم ووردبريس. قد تظهر لوحة التحكم باللغة الإنجليزية لذلك سوف أقوم باختيار اللغة العربية للموقع.

050_wordpress_control_panel.jpg

إن أردت اختيار اللغة العربية كلغة افتراضية للموقع فعليك التوجه لـ Settings ومنها الخيار الفرعي General.

051_wordpress_change_language_step1.jpg

052_wordpress_change_language_step2.jpg

اضغط على القائمة التي بجانب Site Language واختر منها العربية ثم اضغط على Save settings في أسفل الصفحة.

053_wordpress_change_language_step3.jpg

سوف يتم إعادة تحميل الموقع من جديد. لاحظ أن القائمة الرئيسية في لوحة التحكم أصبحت على اليمين ومعظم محتوياتها مترجمة للغة العربية.

054_wordpress_change_language_step4.jpg

حتى الآن أنت لم ترى الموقع بل أنت تنظر للوحة التحكم الخاصة به، لذلك للتوجه للموقع هناك طريقتان، الأولى من خلال لوحة التحكم وذلك بالتوجه إلى اسم الموقع الموجود في الزاوية اليمنى العلوية وعند مرور الفأرة فوقه سوف يظهر خيار هو زيارة الموقع. اضغط عليه ليتم توجيهك للصفحة الرئيسية للموقع.

055_wordpress_main_page1.jpg

الطريقة الثانية بسيطة وهي بكتابة عنوان الموقع ضمن المتصفح كما في الصورة التالية.

056_wordpress_main_page2.jpg

أياً كانت الطريقة التي استخدمتها فإن النتيجة واحدة وسوف تصل بك للصفحة الرئيسية للموقع كما هو مبين في الصورة التالية.

057_wordpress_main_page3.jpg

لاحظ هنا وجود شريط أسود في أعلى الموقع وذلك لأنك قمت بزيارة الموقع وأنت ما زلت مسجلاً ضمنه كمدير لذلك إن أردت تسجيل الخروج عليك بالتوجه لأقصى يسار الشريط حيث تجد اسم المستخدم admin وعند مرور الفأرة فوقه سوف تظهر قائمة جانبية تحتوي خيار تسجيل الخروج.

058_wordpress_logout.jpg

بعد الضغط على خيار تسجيل الخروج سوف يتم تحويلك للصفحة التالية.

059_wordpress_logout2.jpg

الآن تم تسجيل خروجك من الموقع و لزيارة الموقع من جديد عليك الضغط على خيار "العودة إلى موقعي الأول" أو كتابة عنوان الموقع ضمن المتصفح بشكل مباشر لتحصل على النتيجة التالية.

060_wordpress_main_page.jpg

الآن أنت تشاهد الموقع بشكله الذي يظهر به لأي زائر عادي.

هكذا أكون قد انتهيت من شرح كيفية تثبيت ووردبريس على ويندوز 10 بإستخدام المخدم المحلي XAMPP

استخدام WampServer كخادم محلي

بدايًة، عليك تنصيب محرر نصي مثل Sublime text 3. يسمح محرر النصوص لك بالتعامل مع جميع الملفات التي تحوي أكواد برمجية وتكون بامتداد php، js وcss على سبيل المثال لا الحصر.

سوف أعتمد على محرر Sublime text 3، لذلك عليك تنزيل نسخة Windows 64bit.

061_sublime_text3_installation_step1.jpg

وبعدها: عليك تنزيل البرنامج من خلال زيارة الرابط التالي WampServer والضغط على START USING WAMPSERVER.

062_wampserver_download_step1.jpg

والآن اضغط على النسخة التي تُناسب معمارية حاسبك وفي حاسبي هي: WAMPSERVER 64 BITS

063_wampserver_download_step2.jpg

بعد ذلك سوف تظهر لك النافذة التالية. اضغط على الرابط ذو اللون الأصفر you can download it directly.

064_wampserver_download_step3.jpg

بعد الانتهاء من التنزيل، تبدأ عملية التثبيت للبرنامج وفق التسلسل التالي.

065_wampserver_installation_step1.jpg

هنا علينا الانتباه للملاحظات التي تضمن تثبيت البرنامج تثبيتًا صحيحًا.

066_wampserver_installation_step3.jpg

سوف نستخدم هذه الروابط لتنزيل برمجيات Visual C plus plus. تجد الروابط بتحريك المنزلق لأسفل قليلًا.

067_wampserver_installation_step4.jpg

بالنسبة لنظام ويندوز 10 المستعمل في هذه السلسلة فهو 64 بت لذلك قمت بتنزيل وتثبيت النسخ التالية من Visual C plus plus.

ملاحظة مهمة: الروابط السابقة قد تكون غير صحيحة في وقت قرائتك لهذه المقال لذلك عليك باستخدام الروابط الموجودة في نافذة تنصيب البرنامج.

نعود لمتابعة تثبيت خادم WampServer وفق الخطوات الموضحة في الصور التالية.

068_wampserver_installation_step8.jpg

النسخة الحالية من WampServer تستعمل إصدار7.4.9 و7.3.21 من PHP ولكن في حال أردت استخدام نسخ أقدم يمكنك اختيارها لتثبيتها مع البرنامج.

069_wampserver_installation_step9.jpg

070_wampserver_installation_step10.jpg

071_wampserver_installation_step11.jpg

قبل انتهاء عملية التثبيت سوف يعطيك البرنامج حرية اختيار متصفح افتراضي آخر للعمل مع WampServer، أنا سوف اختار جوجل كروم، أيضا لك حرية اختيار محرر نصوص مختلف عن notepad لذلك اخترت Sublime text 3 الذي قمت بتنصيبه في البداية.

072_wampserver_installation_step12.jpg

يمكنك الوصول لتطبيق جوجل كروم من خلال القرص C، مجلد Program Files x86، ثم مجلد جوجل ثم مجلد كروم ثم Application ثم Chrome.exe.

073_wampserver_installation_step13.jpg

خطوات اختيار محرر النصوص.

074_wampserver_installation_step14.jpg

يمكنك الوصول لتطبيق Sublime text 3 من خلال القرص C، مجلد Program Files، ثم مجلد Sublime text 3 ثم sublime_text.exe.

آخر خطوتين من تثبيت البرنامج.

075_wampserver_installation_step16.jpg

076_wampserver_installation_step17.jpg

سوف يعمل البرنامج بشكل تلقائي وللتأكد من ذلك عليك الانتباه للون أيقونة البرنامج والتي تجدها بجانب التاريخ في الجهة اليسارية من شريط قائمة ابدأ.

077_wampserver_start_step1.jpg

كي تصل للنافذة الرئيسية للبرنامج انقر على الأيقونة بزر الفأرة اليسار لتظهر لك قائمة، اختر منها Localhost.

078_wampserver_start_step2.jpg

سوف يعمل متصفح جوجل كروم بما أني اخترته كمتصفح افتراضي.

079_wampserver_start_step3.jpg

لاحظ هنا في شريط عنوان المتصفح أن العنوان هو localhost وهو مختلف عن خادم XAMPP والذي يعتمد العنوان 127.1.1.1 كعنوان افتراضي للوصول له.

لن أقوم بشرح كيفية تثبيت ووردبريس من خلال هذه الخادم لأن الطريقة لا تختلف عن سابقه أبدًا ولكن سوف أنوه لفرق بسيط عند الوصول لـ phpmyadmin حيث يطلب منك اسم مستخدم وكلمة مرور للدخول. اسم المستخدم الافتراضي هو root وكلمة المرور فارغة ثم اضغط على انطلق.

080_wampserver_phpmyadmin_step1.jpg

تثبيت ووردبريس باستخدام استضافة سحابية

سنشرح في هذه الفقرة طريقة تثبيت ووردبريس على استضافة سحابية لكونها من أفضل أنواع الاستضافات للمتاجر الإلكترونية فهي تستخدم عددًا كبيرًا من الخوادم التي تتعاون مع بعضها لتؤمن لك نظام استضافة مستقر يضمن لك عدم تعطل موقعك، كما أنها تحاسب مقابل الاستهلاك أي أنك تدفع مقابل ما تستخدمه من موارد فقط كما أنها تمنحك مرونة وسهولة في توسيع موارد موقعك عند الحاجة فلكونها لا تعتمد على خادم واحد لتخزين المحتوى سيكون إنشاء المزيد من الخوادم أمرًا في غاية السهولة.

تثبيت ووردبريس على استضافة كلاودويز Cloudways

سنفترض أنك لا تملك خبرة تقنية في إدارة الاستضافات لذا سنعتمد خدمة إدارة الاستضافات السحابية كلاودويز Cloudways التي تدعم بشكل أساسي الاستضافة السحابية الشهيرة ديجيتال أوشن إلى جانب شركات استضافة شهيرة مثل استضافة أمازون AWS ومنصة جوجل السحابية Google Cloud.

تخفف كلاودويز من تعقيدات البنية التحتية السحابية وتسهل لك التعامل معها فهي تعمل بمثابة وسيط بينك وبين خدمة الاستضافة وتوفر عدة مميزات لأصحاب مواقع ووردبريس ومتاجر ووكومرس وأبرزها سهولة التعامل معها ودعمها الفني الجيد وإمكانية اختيار خطة تسعير تناسب احتياجات الموقع وتحديد موقع الخادم الأقرب لموقعك الجغرافي كما أنها لا تضع حد معين لعدد زوار الموقع في كافة خطط الاستضافة مما يعني أن صاحب الموقع أو المتجر الإلكتروني لن يكون مقيدًا بعدد محدد من العملاء كما هو الحال في معظم شركات الاستضافة الأخرى.

الجدير بالذكر أنك ستدفع مبالغ إضافية مقابل هذه المميزات لذا في حال كنت تمتلك الخبرة الكافية للتعامل مع الاستضافة السحابية فيمكنك حجز استضافة موقعك مباشرة مع ديجتال أوشن وتوفير تكاليف إدارة الاستضافة التي ستقتطعها منك كلاودويز لتعمل كوسيط بينك وبين الاستضافة.

لتثبيت ووردبريس على Cloudways توجه للموقع من خلال الرابط cloudways وانقر على خيار Start Free لإنشاء حساب مجاني تجريبي مدته ثلاثة أيام وتقرر فيما بعد إذا كنت تريد الترقية لخطة مدفوعة أو إلغاء الاشتراك.

التسجيل في كلاودويز.PNG

بعدها ستظهر لك صفحة التسجيل signup التي تمكنك من إنشاء حساب استضافة باستخدام حسابك على جوجل أو جيت هب أو لينكدإن أو ديجيتال أوشن لكن يفضل أن تستخدم الطريقة التقليدية وتدخل البيانات المطلوبة للتسجيل وهي اسمك وبريدك الإلكتروني وما عليك سوى إدخال عنوان بريدك الإلكتروني وكلمة مرور.

التسجيل في كلاودويز من خلال البريد الإلكتروني.PNG

بعدها سيرسل لك كلاودويز بريد إلكتروني قبل تفعيل حسابك ويطلب منك بعض بيانات التحقق من أنك بشري ولست روبوت مثل صورة هويتك الشخصية أو جواز سفرك وروابط حساباتك على مواقع التواصل الاجتماعي وغيرها من البيانات.

بريد التحقق من بياناتك من قبل كلاودويز.PNG

بعد التحقق من هويتك سيرسل لك بريد تفعيل حسابك الذي يتضمن رابط باسم Activate My Account.

ايميل تفعيل الحساب على كلاود ويز.PNG

بالنقر على هذا الرابط ستتمكن من الدخول مباشرة لحسابك في كلاودويز على الرابط التالي https://platform.cloudways.com/server/create وستظهر لك صفحة تطلب منك إنشاء السيرفر الافتراضي الخاص بك وتثبيت التطبيق عليه والمقصود بالتطبيق هنا ووردبريس، وفي المرات القادمة ستتمكن من الدخول لحسابك من خلال إدخال بريدك الإلكتروني وكلمة المرور التي كتبتها أثناء إنشاء الحساب.

تسجيل الدخول لحساب الاستضافة كلاود ويز.png

إذا لم تحصل على رسالة التحقق أو واجهت أي خطأ خلال عملية التفعيل، يمكنك التواصل مع الدعم الفني للموقع أو شرح المشكلة عبر مربع الدردشة الظاهر على الصفحة الرئيسية لموقع كلاودويز وستحصل على رابط التفعيل بسرعة.

الآن عليك إعداد خادم الاستضافة الذي سيتضيف موقع الويب أو المتجر الخاص بك، حدد من القسم APPLICATION & SERVER DETAILS في الأعلى نوع التطبيق الخاص بك افتراضيًا يكون WordPress وستجد خيارات أخرى مثل Laravel و Magento، اكتب اسم التطبيق وليكن testapp واسم السيرفر Test Server واسم الموقع كي تتذكرها وتميز بين المواقع لاحقًا.

ثم حدد البينية التحتية للاستضافة وهنا سنتركه على الخيار الافتراضي Digital Ocean لكونه الوحيد المتاح في الفترة التجريبية المجانية ثم سنحدد من القسم SERVER SIZE حجم السيرفر ليكون 2GB وبالطبع يمكننا إضافة المزيد من موارد الخادم في وقت لاحق حسب الحاجة. وأخيرًا نحدد الموقع الجغرافي لمراكز البيانات لتكون أقرب ما يمكن لموقع زوار موقعك وليكن Amsterdam وعند الانتهاء ننقر زر Launch Now لبدء إنشاء الخادم.

إعداد السيرفر والتطبيق على كلاودويز.png

تستغرق عملية الإعداد عدة دقائق يمكنك خلالها الاطلاع على ميزات الاستضافة السحابية كلاودويز ومشاهدة الفيديو التوضيحي وقراءة المعلومات التعريفية المتاحة على الصفحة.

إعداد الخادم على كلاودويز.PNG

بعد الانتهاء من عملية الإعداد سيظهر اسم السيرفر وهو في حالتنا Fine Choice Server وبجانبه أيقونتان في الأعلى الأولى www وبجانبها رقم 1 باللون البرتقالي الذي يمثل عدد التطبيقات أو المواقع المثبتة على هذا السيرفر والثانية أيقونة بشكل مجلد وبجانبها رقم 1 باللون الأزرق والذي يمثل عدد المشاريع المرتبطة بهذا السيرفر.

السيرفرات والتطبيقات على كلاودويز.PNG

عند النقر فوق اسم السيرفر ستظهر لك لوحة تحكم الخادم Server management الذي أنشأته على الاستضافة ومن هنا يمكنك إدارة كل ما يتعلق بالخادم وضبط إعداداته ومراقبة أدائه.

إدارة السيرفر في كلاودويز.PNG

بالنقر على أيقونة www سيظهر لك التطبيق أو موقع ووردبريس الذي أنشأته انقر فوق اسمه finalchoice.app لتظهر لك لوحة تحكم التطبيق Application Management والتي يمكنك من خلالها معرفة كافة المعلومات حول الموقع عنوان الموقع المؤقت APPLICATION URL لعرض الموقع المباشر وعنوان IP وعنوان وبيانات الوصول للوحة تحكم الموقع أو لوحة المسؤول ADMIN PANEL ومعلومات الوصول لقاعدة البيانات MYSQL ACCESS وغيرها من الخيارات.

لوحة إدارة التطبيق في كلاودويز.png

انقر فوق رابط لوحة تحكم المسؤول وأدخل البريد الإلكتروني وكلمة مرور المسؤول.

تسجيل الدخول للأدمن.PNG

بعد إدخال البيانات الصحيحة ستصل إلى النافذة التالية وهي لوحة تحكم ووردبريس التي يمكنك من خلالها إدارة موقع ووردبريس والتحكم بكافة أموره كما سنشرح بالتفصيل في المقال التالي من السلسلة.

لوحة تحكم أدمن ووردبريس.PNG

لا توفر لوحة تحكم استضافة Cloudways مدير ملفات مضمن، لذا سيتوجب عليك استخدام أحد برامج SFTP أو SSH مثل FileZilla من أجل رفع ملفاتك على الخادم أو الوصول  لملفات موقعك مباشرة.

كيفية ربط اسم الدومين مع استضافة كلاودويز

الأمر بسيط إن كنت تملك النطاق والاستضافة من نفس الشركة حيث يمكنك التواصل مع الدعم عبر حسابك على موقع الشركة وطلب ربط اسم النطاق مع الاستضافة أو خلال عملية شراء الاستضافة سوف يطلب منك تحديد اسم النطاق الذي تريد ربطه مع الاستضافة هل هو مملوك من قبلك أم تريد حجز اسم نطاق جديد وفي هذه الخطوة إذا كان اسم النطاق موجود ضمن نفس الشركة سوف يتم الربط تلقائيًا.

لكن المشكلة التي تواجهنا هي في حال وجود اسم النطاق والاستضافة ضمن شركتين منفصلتين ولنقل على سبيل المثال اسم النطاق على شركة جوجل دومين والاستضافة على شركة الاستضافة السحابية كلاودويز كما هو الحال في مثالنا.

فبعد إنشاء حساب في شركة الاستضافة كلاودويز وإنشاء الخادم الافتراضي وتثبيت ووردبريس عليه كما شرحنا في الفقرة السابقة ستكون الخطوة التالية هي ربط النطاق الذي شرحنا كيفية شراءه من جوجل دومين في مقال سابق مع استضافة الموقع، وتختلف الخطوات هنا حسب الشركة التي اشتريت النطاق منها في حالتنا اشترينا النطاق من Google Domain لذا ستكون خطوات الربط كالتالي.

بداية قم بتسجيل الدخول لحسابك في استضافة كلاودويز سيتم توجيهك مباشرة إلى التبويب servers انقر من هنا فوق أيقونة التطبيقات www الموجودة أعلى يمين التبويب ثم انقر فوق اسم تطبيقك أو موقعك الخاص.

التبويب Servers في كلاودويز.PNG

بعدها ستظهر لك لوحة تحكم التطبيق في كلاودويز اختر من هنا التبويب الجانبي Access Details وانسخ العنوان Public IP الذي يمثل عنوان الخادم الخاص بك.

العنوان Public IP للموقع.png

عد الآن إلى موقع تسجيل النطاق وهو في حالتنا Google Domin وعرض النطاق الخاص بك واختيار التبويب DNS ثم من القسم Resource records الذي يضم قائمة بكافة الخدمات التي يستخدمها نطاقك سيتوجب عليك إنشاء سجل جديد في القسم Custom records.

في الحقل Host name اكتب الرمز @ للدلالة على أنك تضيف نطاق أساسي وليس فرعي للموقع وفي الحقل Type اختر النوع A وأخيرًا في الحقل Data ألصق عنوانIP الذي نسخته.

ربط الدومين مع الاستضافة 1.PNG

الخطوة الأخيرة هي العودة لموقع الاستضافة كلاود ويز والدخول للوحة إدارة التطبيق من جديد والنقر هذه المرة فوق التبويب الجانبي Domain Management وانقر فوق الزر Add Domin بجانب الحقل Primary Domain ولصق عنوان النطاق وهو في حالتنا finechoice.org والنقر فوق الزر Add Domin من جديد لحفظ التغييرات وإتمام عملية الربط، وبهذا نكون قد ربطنا اسم النطاق من جوجل دومين مع خادم كلاودويز بنجاح.

ربط الدومين مع الاستضافة 2.PNG

تجدر الإشارة لأنك تحتاج للانتظار لبعض الوقت بعد ربط النطاق بالاستضافة كي يتم نشر تغييرات DNS وتتمكن من استخدام اسم المجال للوصول لموقعك من خلاله.

وهكذا نكون قد انتهينا من شرح الخطوات المختلفة لتثبيت ووردبريس على استضافة فعلية أو محلية وربط اسم الدومين الخاص بموقعنا مع الاستضافة، كما يمكنك مطالعة المزيد من التفاصيل حول تثبيت ووردبريس من خلال مساهدة الفيديو التالي:

خاتمة

تعلمت من خلال هذا المقال كيف تقوم بتثبيت خادم محلي على حاسبك إضافة إلى تثبيت ووردبريس عليه وهو أمر مفيد لك لتتعلم التعامل مع ووردبريس دون الحاجة لشراء استضافة فعلية، والخيار الآخر كان استخدام استضافة سحابية لتثبيت ووردبريس عليها وربط اسم النطاق بموقع ووردبريس وهو أمر مفيد عندما تريد لشخص آخر متابعة التطويرات التي تقوم بها على متجرك من مكان بعيد جغرافيًا عنك.

اقرأ أيضًا


تفاعل الأعضاء

أفضل التعليقات

لا توجد أية تعليقات بعد



انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أضف تعليق

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • أضف...