نظرة عامة
Markup Studio منشئ مواقع بصري. تنشئ موقعاً (مشروعاً)، تضيف صفحات، تصمم كل صفحة في محرر الصفحات، وتضبط الثيم والشريط العلوي والتذييل على مستوى الموقع. موقعك الحي يُعرض على نطاقك المخصص عند إعداده.
كل ما تصممه يُخزَّن كبيانات منظمة (وليس ملفات HTML يدوية). تعدّل في لوحة التحكم ويرى الزوار النسخة المنشورة على نطاقك.
الخطوات
- أنشئ حساباً → سجّل الدخول → لوحة التحكم
- أنشئ موقعاً → أضف صفحات → افتح محرر الصفحة
- اضبط الثيم والشريط العلوي والتذييل وSEO
- احفظ الصفحات → معاينة → انشر على نطاقك
إنشاء حساب
اذهب إلى إنشاء حساب من الصفحة الرئيسية أو `/signup`. أدخل الاسم الأول واسم العائلة والبريد وكلمة المرور (6–16 حرفاً). أكّد كلمة المرور في الحقل الثاني.
الخطوات
- افتح `/signup`
- أدخل بياناتك وكلمتي مرور متطابقتين
- أرسل — عند النجاح تُوجَّه إلى تسجيل الدخول بعد رسالة قصيرة
- إذا كان البريد مسجلاً مسبقاً، ستظهر رسالة خطأ
نصائح
- استخدم كلمة مرور قوية لا تعيد استخدامها في مواقع أخرى.
- النموذج يتضمن حقل honeypot مخفياً للبوتات — اتركه فارغاً.
تسجيل الدخول والخروج
استخدم تسجيل الدخول في `/signin` ببريدك وكلمة مرورك. بعد الدخول تُوجَّه إلى لوحة التحكم (`/dashboard`).
الخطوات
- افتح `/signin`
- أدخل البريد وكلمة المرور → تسجيل الدخول
- من الشريط العلوي، استخدم لوحة التحكم في أي وقت وأنت مسجّل
- استخدم تسجيل الخروج في الشريط العلوي لإنهاء الجلسة
نصائح
- إذا انتهت الجلسة أثناء العمل، قد تظهر «انتهت الجلسة» — سجّل الدخول مجدداً.
نسيت كلمة المرور وإعادة التعيين
إذا نسيت كلمة المرور، استخدم نسيت كلمة المرور في صفحة الدخول (`/forgot-password`). أدخل بريدك لتصلك رسالة برابط إعادة التعيين.
الخطوات
- أرسل بريد حسابك في نموذج نسيت كلمة المرور
- افتح الرابط في البريد (رابط إعادة التعيين مع الرمز)
- عيّن كلمة مرور جديدة في `/reset-password`
- سجّل الدخول بكلمة المرور الجديدة
لوحة التحكم
لوحة التحكم (`/dashboard`) تعرض كل مواقعك. كل صف يظهر الاسم والنطاق واستخدام التخزين وحالة الاشتراك وإجراءات سريعة.
الخطوات
- انقر إنشاء موقع لبدء مشروع جديد
- استخدم إجراءات الصف: صفحات، مدونة، تحديث، SEO، تذييل، شريط علوي، ثيم، صور، فيديو
- اتبع إعدادات DNS في لوحة التحكم عند ربط نطاق مخصص
إنشاء موقع
إنشاء موقع يسجّل مشروعك في Markup Studio. يمكنك تعيين اسم عرض، نطاق مخصص اختياري، وأيقونة (.ico فقط).
الخطوات
- لوحة التحكم → إنشاء موقع (`/dashboard/website/create-website`)
- أدخل اسم الموقع (مطلوب)
- أضف اختيارياً نطاقاً مخصصاً وملف أيقونة
- أرسل — تعود للوحة التحكم؛ افتح صفحات لذلك الموقع لإضافة محتوى
نصائح
- إذا فشل ربط النطاق تلقائياً، قد يُنشأ الموقع مع ذلك — يمكنك إعادة المحاولة من إعدادات الموقع لاحقاً.
- حد التخزين ينطبق على كل محتوى الصفحات والرفوعات لذلك الموقع.
تحديث معلومات الموقع
غيّر الاسم أو النطاق أو الأيقونة من تحديث الموقع (`/dashboard/website/update-website?uuid=…`). الوصول من أيقونة القلم في صف الموقع.
الخطوات
- افتح نموذج التحديث مع `uuid` موقعك في الرابط
- عدّل الحقول واحفظ
- رابط إعدادات SEO متاح من هذه المنطقة لخيارات الفهرسة
إدارة الصفحات
كل موقع له صفحة أو أكثر (رئيسية، من نحن، تواصل، إلخ). افتح إدارة صفحات الموقع من صف الموقع (`/dashboard/website/page?uuid=…`).
الخطوات
- اعرض كل صفحات الموقع
- إنشاء صفحة — عنوان، حقول SEO، علم الصفحة الرئيسية، وقالب اختياري
- تحديث صفحة — عدّل العنوان والحقول الوصفية دون فتح المحرر البصري
- افتح بناء / المحرر للتصميم البصري
- احذف أو انسخ الصفحات عند التوفر
إنشاء صفحة
عند إنشاء صفحة تختار البيانات الوصفية واختيارياً قالباً جاهزاً. القوالب تملأ المحرر بأقسام يمكنك تغييرها بالكامل.
الخطوات
- قائمة الصفحات → إنشاء صفحة (`/dashboard/website/page/create-page?uuid=…`)
- أدخل العنوان والوصف والكلمات المفتاحية إن لزم
- علّم الصفحة الرئيسية لصفحة واحدة فقط لكل موقع (المسار `/`)
- تحت ابدأ من قالب، اختر تخطيطاً أو فارغ
- أرسل — تُوجَّه إلى محرر الصفحة لتلك الصفحة
نصائح
- القوالب النشطة فقط تظهر للمستخدمين العاديين.
- تعارض الصفحة الرئيسية يظهر خطأ إذا وُجدت صفحة رئيسية أخرى.
محرر الصفحة (build-page)
المحرر البصري (`/dashboard/website/page/build-page?uuid=…&pageId=…`) حيث تصمم الصفحة. اللوحة تعرض المحتوى؛ الشريط الجانبي الأيسر فيه تبويبات كتل، ذكاء اصطناعي، نمط، وتخطيط.
شريط الأدوات العلوي: معاينة الأجهزة (جوال/لوحي/سطح مكتب)، رابط ثيم، قوالب، حفظ، ومعاينة.
الخطوات
- رجوع — العودة لقائمة الصفحات
- أجهزة — تبديل نقطة التوقف؛ الأنماط لكل جهاز
- ثيم — إعدادات الألوان والخطوط على مستوى الموقع
- قوالب — استبدال محتوى الصفحة بقالب آخر أو فارغ (يتطلب تأكيداً)
- حفظ — تخزين تصميم الصفحة والخطوط
- معاينة — فتح معاينة مصادق عليها في تبويب جديد (`/preview/{pageId}`)
نصائح
- الشريط العلوي والتذييل ليسا جزءاً من اللوحة — اضبطهما منفصلين؛ شاهدهما في المعاينة أو على النطاق الحي.
- احفظ دائماً بعد تغييرات كبيرة. تطبيق القالب يحفظ تلقائياً.
تبويب الكتل — إضافة محتوى
اسحب عناصر من كتل إلى اللوحة أو داخل الأقسام. استخدم جاهز للاستخدام لأقسام كاملة (بطل، من نحن، خدمات، أسئلة شائعة، نموذج تواصل، معرض، شريط تمرير، آراء، فريق، إلخ).
الخطوات
- وسّع الفئات في لوحة الكتل
- اسحب كتلة أو قسماً إلى منطقة الإفلات
- انقر عنصراً لتحديده؛ استخدم أشرطة الأدوات للأنواع الخاصة
- انقر مرتين على أيقونات وصور/فيديو لفتح المنتقيات
- انقر مرتين على معرض / شريط تمرير / شبكة / آراء لأشرطة أدوات مخصصة
نصائح
- نماذج التواصل تحتاج بريد مستلم محفوظاً في إعدادات النموذج.
- بطاقات الآراء يجب أن تستخدم عنصر review-stars، وليس رموز نجوم مكتوبة.
تبويبا النمط والتخطيط
نمط — طباعة، ألوان، تباعد، حدود، ظلال، عرض/flex/grid، حركات (Animate.css)، وحركات التمرير (AOS) للعنصر المحدد.
تخطيط — شجرة قابلة للترتيب لكل العناصر؛ أعد ترتيب أو حدّد عناصر متداخلة.
الخطوات
- حدّد عنصراً على اللوحة أو في شجرة التخطيط
- تبويب نمط: عدّل الخصائص؛ التغييرات تنطبق على جهاز نقطة التوقف الحالية
- استخدم تبديل hover عند تعديل أنماط التمرير
- تبويب تخطيط: اسحب الصفوف لإعادة ترتيب الأقسام
نصائح
- خيارات flex-child في أخرى تظهر فقط عندما يستخدم الأب عرض flex.
- امسح اسم حركة التمرير لإعادة تعيين حقول AOS ذات الصلة معاً.
قوالب الصفحات
القوالب تخطيطات صفحات مبنية مسبقاً من المنصة. تستخدمها عند إنشاء صفحة أو لاحقاً عبر قوالب في شريط المحرر.
الخطوات
- عند الإنشاء: اختر بطاقة أو فارغ → أنشئ الصفحة → يفتح المحرر بذلك المحتوى
- في المحرر: قوالب → اختر تخطيطاً → تطبيق → تأكيد (يستبدل التصميم الحالي)
- اختر فارغ لمسح الصفحة إلى لوحة فارغة
نصائح
- تطبيق قالب لا يُلغى إلا بتطبيق قالب آخر أو التعديل اليدوي.
- خطوط مستوى الصفحة من القالب تُطبَّق؛ ثيم الموقع يتحكم بالألوان العامة ما لم تُلغَ في النمط.
منشئ الصفحات بالذكاء الاصطناعي
تبويب ذكاء اصطناعي يولّد أقسام الصفحة من موجز نشاطك باستخدام قوالب جاهزة فقط (بدون HTML خام من الذكاء الاصطناعي). يمكنك توليد صفحة كاملة أو إعادة توليد قسم واحد.
الخطوات
- افتح تبويب ذكاء اصطناعي في محرر الصفحة
- صفحة كاملة: املأ اسم النشاط، العرض، الجمهور، النمط، الهدف، النقاط البارزة، اللغة؛ ألوان اختيارية و«تضمين تواصل»
- شغّل التوليد → راجع الخطة → أكّد لاستبدال محتوى اللوحة
- قسم واحد: اختر قسماً من القائمة المنسدلة، أضف موجزاً قصيراً، أعد التوليد
نصائح
- بعد توليد صفحة أو قسم، تُضاف صور مخزنة تلقائياً حيث يحتاج التخطيط (بطل، من نحن، خدمات، معرض، شريط تمرير، فريق، وكتل مشابهة).
- إذا فشل التوليد أو انتهت المهلة، انتظر قليلاً وحاول بموجز أقصر.
- مخرجات الذكاء الاصطناعي تدمّر المحتوى الحالي — حوارات التأكيد تحذّر قبل الاستبدال.
- يمكنك تعديل كل كتلة بعد ذلك في كتل، نمط، وتخطيط كأي محتوى آخر.
ثيم الموقع (ألوان وخطوط)
تصميم الثيم (`/dashboard/website/design-theme?uuid=…`) يضبط ألوان الموقع العامة (أساسي/ثانوي/تمييز/نص/خلفية) وخطوط Google الافتراضية. الصفحات يمكنها تجاوز خطوط أساسي وثانوي لكل صفحة في المحرر (تُحفظ مع الصفحة).
الخطوات
- افتح تصميم الثيم من صف الموقع (أيقونة الشبكة)
- اضبط منتقيات الألوان وقوائم الخطوط
- احفظ — الثيم يُطبَّق على المعاينة والموقع المنشور
- في شريط المحرر، ثيم يفتح نفس الإعدادات؛ عينات الألوان تعرض الألوان الحالية
نصائح
- الخطوط الفعلية على الصفحة: خطوط الصفحة إن وُجدت، وإلا خطوط الثيم.
إعدادات الشريط العلوي
شريط التنقل على مستوى الموقع، وليس جزءاً من محتوى الصفحة. اضبطه في `/dashboard/website/navbar-settings?uuid=…`.
الخطوات
- تفعيل/تعطيل الشريط العلوي
- رفع شعار (ملف صورة، وليس SVG)
- اختر التخطيط: درج يسار أو يمين على الجوال
- أخفِ صفحات من التنقل أو أضف روابط مخصصة (مسارات مثل `/about` أو مراسي `#section-id`)
- ألوان الثيم للخلفية/النص أو قيم hex مخصصة
- احفظ — تحقق في معاينة أو الموقع الحي
نصائح
- رابط مدونة يظهر تلقائياً عند وجود منشور مدونة منشور واحد على الأقل.
- الشريط العلوي لا يظهر داخل لوحة build-page عن قصد.
SEO وفهرسة البحث
إعدادات SEO (`/dashboard/website/seo-settings?uuid=…`) تتحكم فيما إذا كان محرك البحث يفهرس موقع نطاقك المخصص. عنوان كل صفحة والوصف الوصفي يُضبطان في نماذج إنشاء/تحديث الصفحة.
الخطوات
- اضبط السماح لمحركات البحث بالفهرسة تشغيل أو إيقاف
- احفظ الإعدادات
- على نطاق حي: `/sitemap.xml` و`/robots.txt` يُولَّدان ديناميكياً
- استخدم الروابط في صفحة SEO لفحص خريطة الموقع/robots الحية عند إعداد النطاق
نصائح
- خريطة الموقع تتطلب نطاقاً مخصصاً مُعداً؛ عناوين localhost للمنصة ليست خرائط عملاء.
- روابط المعاينة تبقى noindex — لا تُدرج في خريطة الموقع.
المدونة
منشورات المدونة منفصلة عن محتوى منشئ الصفحات. أدرها في `/dashboard/website/blog?uuid=…`.
الخطوات
- أنشئ منشوراً — عنوان، slug، مقتطف، نص، صورة غلاف، قالب (كلاسيكي أو مقسوم)، علم النشر
- عدّل أو احذف من القائمة
- المنشورات المنشورة تظهر في `https://your-domain.com/blog` على الموقع الحي
- عاين المنشورات في `/preview/blog?uuid=…` وأنت مسجّل
نصائح
- الـ slug `blog` محجوز — لا تستخدمه لصفحة عادية.
الصور والفيديو
كل موقع له مكتبة صور ومكتبة فيديو من صف الموقع. في المحرر، انقر مرتين على الصور أو الفيديو لاختيار من مكتبتك أو تعيين رابط.
الخطوات
- افتح مدير الصور أو الفيديو من صف الموقع → ارفع ملفات
- في محرر الصفحة، انقر مرتين على كتلة صورة أو فيديو لتحديثها
- استخدم إعدادات الفيديو في النافذة لخيارات التشغيل (تحكم، ملصق، مصدر)
نصائح
- مقياس التخزين في لوحة التحكم يشمل تصاميم الصفحات والوسائط المرفوعة.
- صور المستخدم ليست SVG لأسباب أمنية.
النماذج على الموقع المنشور
نماذج التواصل (وغيرها) التي تضيفها في المحرر تعمل على موقعك الحي. عند إرسال زائر، يرى رسالة نجاح أو خطأ، وتصلك الرسالة على بريد المستلم الذي ضبطته في إعدادات النموذج.
الخطوات
- أضف قسم نموذج تواصل أو عناصر نموذج في المحرر
- اضبط بريد المستلم في إعدادات عنصر النموذج واحفظ الصفحة
- عند النشر، يرسل الزوار — يُعرض النجاح/الخطأ كإشعار على الصفحة الحية
نصائح
- اختبر النماذج على نطاقك المخصص الحي. وضع المعاينة قد لا يرسل إرسالات حقيقية.
الموقع الحي والنطاق
الزوار يفتحون موقعك على النطاق المخصص الذي أعددته. الصفحات تُحل بالمسار؛ الصفحة الرئيسية هي المعَلَّمة كرئيسية.
الخطوات
- أضف نطاقاً مخصصاً في إعدادات الموقع
- وجّه DNS كما يظهر في إعدادات DNS في لوحة التحكم
- انشر المحتوى بحفظ الصفحات — لا زر «نشر» منفصل للصفحات
- اشترك/جدّد عبر إجراءات الفوترة في صف الموقع عند الحاجة
نصائح
- المواقع المعلّقة تعيد خطأ على الرابط العام حتى يُستعاد الاشتراك.
التخزين والاشتراك
كل موقع له حصة تخزين (ميغابايت). حفظ صفحات كبيرة أو وسائط كثيرة يزيد الاستخدام. حالة الاشتراك والتجديد تظهر في صف الموقع في لوحة التحكم.
الخطوات
- راقب شريط التخزين في صف الموقع
- إذا فشل الحفظ بخطأ تخزين، احذف وسائط أو صفحات غير مستخدمة
- استخدم اشترك عند انتهاء التجربة أو الفترة