أحد أقربائي الأعزاء يحب الطبخ كثيرًا. حتى أنه يجلس بالساعات يقرأ عن أنواع السكاكين المُستخدمة في المطبخ. وعن النسب الدقيقة التي تستخدم من كل بهار لنصنع البهارات السبع في المنزل! كان مُغرمًا بوصفات ستيك اللحم على وجه الخصوص! اقترحنا عليه جميعًا أن ذلك الشغف لابد أن يُشارك مع الآخرين. وكان بها؛ قرر افتتاح مطعمه. لكن ماذا ينقصه الآن؟
موقع فاخر!
نحن الآن في عالم حيث كل شيء يمكن أن يُطلب من المنزل؛ وحيث كل شيء يوجد على الإنترنت أيضًا! ولأنني كنت الأكثر تشجيعًا لهذا المشروع، طلب مني قريبي أن أُنشئ له موقعًا تعريفيًا يحتوي على منيو مطعمه. بالإضافة إلى عنوان أو لوكيشن وأرقام التواصل. ونظرًا للتكلفة الهائلة التي تحملها بالفعل، بحثت عن ما يحقق المعادلة الصعبة! موقع احترافي، دون تعقيدات برمجية، وأسعار ممتازة؛ ووقع الاختيار أخيرًا على سنديان.
سنديان هو منشئ مواقع بالسحب والإفلات؛ يتضمن أكثر من 90 قالبًا للاختيار من بينهم. ويتميز سنديان أن هذه القوالب مُوزعة في عدة تصنيفات تخدم مجالات متعددة. وقد وجدت بالفعل تصنيفًا مخصصًا للمطاعم. في تلك المقالة؛ سنعمل على إنشاء موقع مطعم كامل مثل الذي صممته لقريبي. وهذا المطعم من وحي خيالي بالكامل، وأخترت له قالب يُدعى «مذاق».
لفت نظري في البداية أن سنديان يتيح معاينة وتجربة تخصيص كل القوالب المتاحة بصورة مجانية تمامًا. بل إنه يتيح ذلك أصلًا دون الحاجة إلى تسجيل دخول. لذا يمكنك اختيار أي قالب يظهر أمامك ومعاينته بدقة قبل اتخاذ قرارك والبدء في إنشاء موقعك.
تخصيص الهيدر
بعد اختيار القالب بدأت عملية التخصيص التي وجدتها ممتعة جدًا. بدأت بالهيدر؛ وهو الشريط العلوي في الصفحة. ولأبدأ في التخصيص ضغطت عليه لتحديده.
غيرت اسم القالب، إلى اسم المطعم. فقط ضغطت على كلمة «مذاق» بالهيدر وكتبت اسم المطعم.
بعدها وجدت الباقي مناسبًا للإبقاء عليه. ما عدا القائمة التي تضمنت وجبات الإفطار؛ وهي شيء ليس متاحًا لدينا في مطعم ستيك، لذا استبدلتها بالغداء بنفس طريقة تعديل اسم المطعم.
وفي زر اتصل؛ يمكن أن نخصصه للانتقال إلى رسائل الواتساب. من خلال لصق رابط الواتساب في مكان رابط الاتصال. أولًا حددت الزر، ثم اخترت تعديل.
بعد ذلك ظهر شريط التحكم في المكون على اليسار. وفي خانة «الرابط»، وضعت رابط بدء محادثة مباشرة عبر الواتساب.
تخصيص الهيرو
الهيرو هي المنطقة الأكبر التي يراها العملاء عند دخولهم إلى موقعنا؛ لذا حرصت على أن تكون مميزة وجذابة! أولًا حددت صورة قسم الهيرو، واخترت زر استبدال. بعدها ظهر شريط التحكم على اليسار لأرفع من خلاله الصورة الجديدة.
رفعت الصورة ثم ضغطت إدراج، وتلك هي النتيجة:
ولكنك بالتأكيد تلحظ لونًا برتقاليًا لا يتماشى مع هوية الشعار والمطعم؛ وهنا ننتقل إلى تغيير ألوان الهوية!
ألوان الهوية
في أقصى اليمين ستجد شريط التحكم الجانبي يتضمن الآتي: الصفحات - إعدادات - ترتيب - أضف قسم. عندما ضغطت على الإعدادت ظهرت جميع التخصيصات؛ سواءً ألوان الموقع (الهوية)، أو الخطوط.
اخترت لونين مناسبين للهوية البصرية للموقع. وتلك هي النتيجة:
أطباقنا
بعد الانتهاء من قسم الهيرو يأتي قسم الأطباق.وهنا كان عليّ تحديد الأصناف التي نقدمها فقط؛ إذ كانت متنوعة جدًا على مطعم ستيك.
من خلال الضغط على كل مكون؛ يغتح شريط تحكم على اليسار يتضمن كل ما يتعلق بالمكون. لون الخط مثلًا، لون الإطار وحجمه. وفي التباعد تجد الحاشية (Padding). وهي المسافة التي تفصل بين الكلمة والإطار من الداخل. فإذا زادت، زادت المساحة الداخلية التي تحيط بالكلمة.
وكذلك نجد الهامش (Margin) وهنا نتحرك في الخارج؛ لأنها المسافة التي تحيط بالإطار الخارجي. إذا زادت تبدأ في تكوين مساحة خارجية حول المكون تبعده عن المكونات الأخرى من حوله. عمومًا وجدت هذه الإعدادات الافتراضية ممتازة ومناسبة. لكن قلصت فقط عدد الأصناف إلى ثلاثة. وأعدت ضبط أسماء المكونات لتلائم أصنافنا بهذا الشكل:
أشهر الأطباق
أحببت ذلك القسم جدًا؛ نظرًا لتصميمه الاحترافي الذي يُسهل تخصيصه. وبدأت باستبدال صور الأطباق بما نقدمه. وهي تقريبًا نفس الخطوات التي اتبعناها في استبدال صورة الهيرو.
بعد إدراج الصور في القسم، خصصت كافة النصوص عبر اختيارها وتعديلها مباشرةً كما فعلنا سابقًا في المكونات النصية. غيرت الأسعار واسم الأطباق أيضًا. كما غيرت الوصف على الأيمن ليناسب هويتنا.
ويأتي بعد هذا قسم الأسئلة الشائعة. وكانت بالنسبة لي الأسئلة مثالية، وقد غيرت فقط بعض الإجابات وفقًا لهويتنا بنفس طريقة تخصيص مكونات النصوص.
جزء المصداقية!
يميل العملاء دائمًا إلى قراءة المراجعات والآراء عند الشراء من مطعم جديد. لذا تضمن قالب مذاق قسم مخصص لآراء العملاء. بدأت بتخصيص القسم مباشرةً عبر تعديل النصوص.
كما فعلنا سابقًا، غيَّرت المحتوى بداخل تلك المكونات ليلائم محتوانا. وذلك عبر إعادة كتابة آراء العملاء التي تركوها لنا سابقًا على منصات أخرى، أو عبر إخبارنا بها مباشرةً.
تذييل الصفحة الرئيسية - الفوتر
في نهاية الصفحة، يأتي قسم التذييل أو الفوتر (Footer). وهو جزء يتضمن جميع الروابط الهامة ومعلومات الاتصال، ونبذة عن المطعم. والذي عملت أيضًا على تغيير معلوماته فقط، ولم أُغير فيه الكثير. وهو واضح لك في لقطة الشاشة السابقة.
غيَّرت فقط العنوان ومعلومات الاتصال. بالإضافة إلى تغيير اسم القالب إلى اسم المطعم وإضافة وصف مُخصص يناسب هوية المطعم.
هكذا انتهينا من الصفحة الرئيسية؛ وحان الوقت للانتقال إلى أهم صفحة؛ صفحة المنيو!
صفحة قائمة الطعام
ستصل إلى صفحة المنيو عبر تبويب الصفحات من شريط التحكم الجانبي على اليمين، وستجد اسمها «القائمة».
بدأت بتعديل اسم القالب في الهيدر إلى اسم المطعم. ثم خصصت صورة الخلفية لتلائم أجواء المطعم الذي نتخيله؛ بنفس الطريقة السابقة لتغيير الصور. فقط اضغط على الصورة، ثم استبدال، وارفع صورتك وادرجها!
ثم بدأت في تغيير الوجبات لتطابق التي وضعناها في الصفحة الرئيسية:
عدَّلت الأسعار بعد ذلك. وغيرت إطار صورة بعض الأصناف الرائجة. والتي يمكن تغييرها من خلال الضغط على أي شكل من الأشكال أسفل الصورة كما موضح:
وهكذا نكمل باقي المنيو، ثم ننتقل إلى الصفحة التي يتعرف فيها الجميع على مطعمنا!
من نحن؟
في صفحة من نحن، يتعرف زائروا الموقع على مطعمنا. ماذا قدمنا؟ ما هي إنجازاتنا؟ ما هي رؤيتنا ورسالتنا. وهذا ما قدمه قالب مذاق بشكل أعجبني صراحةً. بدايةً غيرت اسم المطعم في الهيدر، وصورة الهيرو كالمعتاد.
أعدت تخصيص المحتوى مجددًا؛ لم أرغب في زيادة أي بلوكات أو حذفها. فضلت الإبقاء عليها وتعديلها ببساطة بما يتناسب مع هوية المطعم، بتلك الطريقة:
وفي النصف الثاني من صفحة من نحن؟ عدلت الصورة والنصوص تمامًا كما في الخطوات السابقة.
صفحة التواصل
كحال الصفحات السابقة يا عزيزي؛ أول خطوة هي تغيير صورة الهيرو، وتعديل اسم المطعم في الهيدر.
بعد ذلك ذهبت لتغيير موقع الخريطة؛ إذ انتقلنا من الرياض الموجود في القالب نفسه، إلى الدمام. كل ما عليك أن تضغط على الخريطة مثل الصور، وستظهر لك النافذة من على اليسار. ويُمكنك أيضًا إضافة إحداثيات اللوكيشن بدقة في خانة «المكان» بعد نسخها من خرائط جوجل.
ولتحديد مظهر المكان بدقة على الخريطة؛ يمكنك التكبير حتى 18 وستكون بذلك الوضوح:
وأخيرًا يا عزيزي بدأت في تغيير معلومات التواصل. ويتضمن القالب بلوكات لإبراز أهم معلومات الاتصال؛ مثل الإيميل والواتساب والموقع ورقم الهاتف.
وهكذا قد انتهينا من موقعنا الاحترافي لمطعم إمبيريا!
المعاينة على جميع الأجهزة
تناسب قوالب سنديان العمل على جميع الأجهزة؛ سواء كمبيوتر أو تابلت أو هاتف ذكي. ويمكنك معاينة ذلك بالضغط على زر المعاينة أسفل شريط التحكم على اليمين، ثم تحديد الجهاز من القائمة العلوية كما موضح بالصورة التالية:
إطلاق الموقع
الآن، انتهينا من تصميم الموقع، وجاء وقت الإطلاق! اضغط على زر «أكمل الإنشاء» في الشريط الأصفر بالأعلى لتبدأ عملية إطلاق الموقع.
أولًا اكتب اسم موقعك ثم اختر مجال الموقع من القائمة.
بعد ذلك تأتي مرحلة اختيار الدومين (النطاق). ابحث عن دومين مناسب لمطعمك واسم علامته التجارية، ثم اختر الدومين الأفضل واضغط التالي.
أخيرًا، جاء وقت إطلاق الموقع، أدخل بيانات الدفع وسيصبح موقعك حيًا وجاهزًا للمشاركة ضمن أي استراتيجية تسويقية.
المميز في سنديان أيضًا أنه يتيح المرونة والاحترافية في تخصيص كافة عناصر الصفحة. ذلك من خلال محرر للأكواد جعلني قادرةً على إضافة أكواد CSS مخصصة لأرفع قليلًا من حجم النصوص في الهيدر. ويدعم محرر الأكواد المخصصة إمكانية وضع كود HTML وكود Javascript أيضًا. لذا يمكنك التحكم بالكامل في أدق تفاصيل الصفحة وتصميمها، وأنماطها التفاعلية.
لاستخدام هذه الخاصية، يجب أن تمتلك موقعًا منشورًا بالفعل على حسابك. بعد ذلك توجه إلى لوحة التحكم بالمواقع في حسابك، ثم اختر موقعك. ومن لوحة التحكم على اليمين، اختر الإعدادات.
بعد ذلك اختر «أكواد مخصصة»، ثم اختر تنسيقات لإضافة كود CSS.
في محرر الأكواد، وضعت كود CSS لزيادة حجم الخط في الهيدر، ثم أضفت أمر !important لأتأكد من تفعيل الكود. وبعدها ضغطت Save.
هكذا نكون قد أنهينا رحلتنا في إطلاق موقع احترافي بكل سلاسة. كل ما تحتاج إليه هو رؤية واضحة لما ترغب أن يكون عليه مطعمك؛ ما نوع الأطباق التي تقدمها؟ كيف تحب أن يراك عملاؤك؟ حتى هذه الأسئلة يُساعدك في تشكيلها تنوع القوالب المخصصة للمطاعم داخل سنديان.
كانت تجربتي لسنديان سلسة وممتعة. وقد تمكنت من إنشاء الموقع بالكامل في دقائق معدودة. وإن كنت صاحب مطعم، أو تخطط لإطلاق واحد قريبًا، فـسنديان هو الخيار الأمثل الذي يجمع بين البساطة، والتكلفة المناسبة، والاحترافية في آن واحد.