كيف تربط الدومين بموقعك على Cloudflare Pages خطوة بخطوة

لربط الدومين بموقع على Cloudflare Pages تمر بثلاث مراحل: تضيف الدومين إلى حسابك في Cloudflare، ثم تغيّر الـ Nameservers عند شركة التسجيل (مثل Namecheap) إلى خوادم Cloudflare، وأخيراً تضيف الدومين كنطاق مخصص (Custom domain) داخل مشروع Pages. بعدها يصدر Cloudflare شهادة SSL تلقائياً ويعمل موقعك على https://.

باختصار: أضف الدومين إلى Cloudflare بالخطة المجانية، انسخ خادمَي الأسماء وضعهما في Namecheap بخيار Custom DNS، أنشئ مشروع Pages، اربط الدومين من إعدادات المشروع، ثم حوّل www إلى الدومين الرئيسي بقاعدة تحويل.

ماذا تحتاج قبل أن تبدأ؟

• دومين محجوز لدى أي مسجّل. إذا لم تحجز دوميناً بعد، اتبع شرح حجز دومين من Namecheap.
• حساب مجاني على Cloudflare.
• موقع جاهز: مجلد HTML بسيط، أو مشروع على GitHub مبني بأداة مثل Astro أو Vite أو Hugo. إذا كنت جديداً على Git، راجع دليل Git وGitHub.
• صلاحية الدخول إلى لوحة تحكم الدومين عند المسجّل.

واجهة Cloudflare تتغير من وقت لآخر، لذلك قد تختلف أسماء الأزرار أو أماكنها قليلاً عمّا تراه هنا. الفكرة والترتيب يبقيان كما هما.

الخطوة 1: أضف الدومين إلى Cloudflare

1. سجّل الدخول إلى لوحة Cloudflare واختر خيار إضافة موقع أو دومين جديد.
2. اكتب الدومين الرئيسي بدون www، مثل example.com.
3. اختر الخطة المجانية (Free)، فهي تكفي لهذا الشرح.
4. سيفحص Cloudflare سجلات الـ DNS الحالية ويستوردها. راجع القائمة بعناية، خصوصاً سجلات البريد MX وTXT إذا كنت تستخدم بريداً على الدومين.
5. في النهاية يعطيك Cloudflare خادمَي أسماء (Nameservers) بصيغة اسم.ns.cloudflare.com. انسخهما كما هما تماماً.

كل حساب يحصل على خوادم أسماء محددة، لذلك لا تنسخ خوادم من شرح آخر أو من حساب صديق.

الخطوة 2: غيّر الـ Nameservers في Namecheap

1. ادخل إلى حسابك في Namecheap وافتح Domain List، ثم اضغط Manage بجانب الدومين.
2. في قسم Nameservers اختر Custom DNS من القائمة.
3. احذف أي قيم قديمة، وألصق خادمَي Cloudflare في الحقلين.
4. احفظ التغيير بالضغط على علامة الصح الخضراء.

إذا كانت خاصية DNSSEC مفعلة عند المسجّل، أوقفها قبل تغيير الخوادم، لأنها قد تمنع تفعيل الدومين على Cloudflare. يمكنك تفعيلها من جديد لاحقاً من داخل Cloudflare.

يستغرق التحديث عادة من دقائق إلى بضع ساعات. تستطيع التحقق من جهازك بهذا الأمر، وهو يعمل على Windows وmacOS وLinux:

nslookup -type=ns example.com

عندما تظهر خوادم Cloudflare في النتيجة، ستتحول حالة الدومين في لوحة Cloudflare إلى نشط (Active).

الخطوة 3: أنشئ مشروع Cloudflare Pages

من قسم Workers & Pages في لوحة Cloudflare، أنشئ تطبيقاً جديداً واختر Pages. قد تعرض اللوحة خيار Workers أولاً، لأن Cloudflare يدعم نشر المواقع الثابتة عبره أيضاً، لكن هذا الشرح يعتمد على Pages. أمامك طريقتان:

• الربط مع Git: تربط حسابك في GitHub أو GitLab وتختار المستودع. بعدها يُنشر الموقع تلقائياً مع كل git push.
• الرفع المباشر (Direct Upload): ترفع مجلد الموقع الجاهز من جهازك. مناسب للمواقع البسيطة.

إذا اخترت Git، ستطلب منك Cloudflare إعدادات البناء. هذه قيم شائعة:

نوع الموقع	أمر البناء	مجلد المخرجات
HTML ثابت	اتركه فارغاً	المجلد الذي فيه index.html
Astro	npm run build	dist
Vite (مثل React)	npm run build	dist
Hugo	hugo	public

بعد أول نشر ناجح يحصل مشروعك على رابط مثل project-name.pages.dev. افتحه وتأكد أن الموقع يعمل قبل ربط الدومين. لمقارنة Cloudflare Pages بخيارات أخرى، راجع أفضل استضافة مجانية للمواقع.

الخطوة 4: اربط الدومين بمشروع Pages

1. افتح مشروع Pages واذهب إلى تبويب Custom domains.
2. اختر إعداد نطاق مخصص، واكتب example.com.
3. لأن الدومين أصبح على Cloudflare، ستعرض عليك اللوحة إضافة سجل الـ DNS المطلوب تلقائياً (سجل CNAME يشير إلى رابط pages.dev). وافق عليه.
4. انتظر حتى تصبح الحالة Active. تصدر شهادة SSL تلقائياً، وغالباً خلال دقائق.

قد تستغرب وجود سجل CNAME على الدومين الرئيسي، لكن Cloudflare يدعم ذلك بتقنية تسمى CNAME Flattening، فلا داعي للقلق.

أضف الدومين دائماً من داخل مشروع Pages. إذا أنشأت سجل CNAME يدوياً في صفحة DNS دون ربط الدومين بالمشروع أولاً، فغالباً ستظهر لك رسالة الخطأ 522.

الخطوة 5: حوّل www إلى الدومين الرئيسي

كثير من الناس يكتبون www.example.com. الأفضل أن تحوّلهم إلى نسخة واحدة من الموقع حتى لا يظهر محتواك في Google بعنوانين مختلفين.

1. من صفحة DNS أضف سجل CNAME باسم www يشير إلى example.com، وتأكد أن Proxy مفعل (السحابة البرتقالية). بدون ذلك لن تمر الطلبات عبر Cloudflare ولن يعمل التحويل.
2. اذهب إلى قسم Rules في إعدادات الدومين وأنشئ قاعدة تحويل (Redirect Rule). قد تجد قالباً جاهزاً لتحويل www إلى الدومين الرئيسي، وهو أسهل خيار.
3. إذا أنشأتها يدوياً: الشرط أن يكون Hostname مساوياً لـ www.example.com.
4. في الإجراء اختر تحويلاً ديناميكياً (Dynamic) بهذا التعبير، مع رمز الحالة 301 والإبقاء على معاملات الرابط (Query string):

concat("https://example.com", http.request.uri.path)

5. احفظ القاعدة وفعّلها، ثم اختبر التحويل:

curl -I https://www.example.com/about

يجب أن ترى الرمز 301 وسطراً يبدأ بـ location: https://example.com/about.

مشكلات شائعة وحلولها

• الخطأ 522: غالباً أضفت سجل CNAME يدوياً. احذفه، ثم أضف الدومين من تبويب Custom domains داخل المشروع.
• الدومين عالق في حالة الانتظار (Pending): تأكد أنك نسخت خادمَي الأسماء بدون أخطاء، وأن DNSSEC متوقف عند المسجّل.
• تحذير أمان عند فتح الموقع: الشهادة قد تحتاج دقائق بعد التفعيل. انتظر قليلاً ثم أعد المحاولة.
• البريد توقف عن العمل: سجلات MX لم تُستورد. أضفها يدوياً من صفحة DNS بنفس القيم التي كانت عند المسجّل.
• ما زال الموقع القديم يظهر: قد تكون ذاكرة DNS المؤقتة على جهازك أو شبكتك. جرّب من شبكة الهاتف أو انتظر قليلاً.

خطوات مفيدة بعد الربط

• فعّل خيار Always Use HTTPS من إعدادات SSL/TLS حتى يُحوَّل كل زائر إلى النسخة الآمنة.
• أضف موقعك إلى Google Search Console وأرسل خريطة الموقع (sitemap) حتى يبدأ Google بفهرسة صفحاتك.
• إذا كنت تبني موقعك الأول، فاقرأ كيف تبني موقعك من الصفر بدون خبرة لتكمل الصورة.