هل تريد تطوير أفضل سير عمل لبناء مواقع الويب؟
كان إنشاء موقع الويب الخاص بك دون تعلم كيفية البرمجة أو التعاقد مع مطور أمرًا شبه مستحيل. ومع ذلك ، بفضل منصات مثل ووردبريس والمكونات الإضافية مثل Elementor ، فإن ما كان يومًا ما مهمة مستحيلة أصبح الآن حقيقة واقعة.
في هذا البرنامج التعليمي ، سنوضح لك كيفية استخدام ووردبريس و Elementor لإنشاء موقع ويب جديد وإرشادك خلال العملية بأكملها خطوة بخطوة. سنغطي الإعداد التقني الذي ستحتاجه ، ونوضح لك كيفية إنشاء الصفحات ، ونوجهك خلال عملية تخصيص موقعك. دعنا نتعمق!
ووردبريس هو نظام إدارة محتوى قوي يمكن تنزيله واستخدامه مجانًا ويسمح لك بإنشاء أي نوع من مواقع الويب ؛ من المدونات الشخصية البسيطة ومواقع الشركات الصغيرة إلى مواقع الشركات الكبيرة والتطبيقات الغنية بالميزات. من ناحية أخرى ، يعد Elementor أداة إنشاء صفحات سهلة الاستخدام لكنها قوية تجعل من السهل على أي شخص إنشاء موقع الويب الخاص به ، بغض النظر عن مدى تعقيده.
لأغراض هذا البرنامج التعليمي ، سننشئ موقعًا بسيطًا من أربع صفحات لشركة صغيرة. لمتابعة البرنامج التعليمي ، سوف تحتاج إلى:
اسم المجال والاستضافة
ووردبريس
العنصر
عناصر إنفاتو
موضوع TwentySeventeen
سنبدأ بسمة TwentySeventeen كقاعدة لدينا ثم سنستخدم قوالب مصممة مسبقًا من المكون الإضافي Envato Elements لإنشاء الصفحات. بمجرد إعداد الصفحات ، سنخصصها بألواننا وخطوطنا وصورنا ومحتوياتنا.
بمجرد الانتهاء من هذا الدليل ، قد ترغب في التحقق من أدلةنا وبرامجنا التعليمية الأخرى لصفحات أكثر تحديدًا.
للحصول على برنامج تعليمي حول إنشاء موقع ويب للتجارة الإلكترونية ، نوصيك بإلقاء نظرة على برنامج WooCommerce التعليمي .
إذا كنت ترغب في معرفة المزيد حول كيفية إنشاء مدونة على ووردبريس ، فلدينا دليل ممتاز عنها هنا .
ولدينا أيضًا دليل إذا كنت تبحث عن معرفة المزيد حول كيفية إنشاء صفحة مقصودة في ووردبريس باستخدام Elementor.
باستخدام هذه الأدلة ، ستتمكن من تحسين موقع الويب الخاص بك وتحقيق أقصى استفادة منه.
تتمثل الخطوة الأولى لإنشاء موقع جديد خاص بك باستخدام ووردبريس و Elementor في التأكد من توفر كل شيء في مكانه الصحيح. في هذا الجزء من البرنامج التعليمي ، سنغطي الحصول على اسم المجال الخاص بك واستضافة الويب ، ونوضح لك كيفية تثبيت ووردبريس و Elementor و Envato Elements بالإضافة إلى كيفية تثبيت قالب TwentySeventeen.
عندما تبدأ في إنشاء موقع الويب الخاص بك ، فإن أول شيء عليك القيام به هو الحصول على اسم مجال وخدمة استضافة الويب. سيسمح اسم المجال الخاص بك للزوار بالوصول إلى موقع الويب الخاص بك.
إذا كنت تقوم بإنشاء موقع ويب شخصي مثل مدونة أو سيرة ذاتية ، فقد ترغب في التفكير في استخدام اسمك الخاص لاسم المجال. سيساعدك هذا في بناء علامة تجارية شخصية ، ومن المرجح أن يظهر اسم المجال الخاص بك في نتائج البحث عندما يقرر شخص ما اسمك على Google.
بدلاً من ذلك ، إذا كنت تقوم بإنشاء موقع ويب لعملك ، فإن الخيار الأكثر وضوحًا هو استخدام اسم عملك لاسم المجال. هناك مجموعة متنوعة من الإضافات التي يمكنك الاختيار من بينها ، ولكن ضع في اعتبارك أن COM هو الأكثر شيوعًا وما يكتبه معظم الأشخاص في شريط العناوين افتراضيًا. ومع ذلك ، إذا وجدت أن اسم المجال الذي تريده غير متوفر مع .COM ، فحاول اختيار .ME أو .CO أو .NET التي تحظى بشعبية كبيرة أيضًا.
إذا كنت عالقًا تمامًا في اسم مجال ولا يمكنك التفكير في أي شيء ، ففكر في استخدام أدوات مثل Namemesh أو Panabee للتوصل إلى اسم.
بينما يمكنك شراء اسم المجال الخاص بك بشكل منفصل عن خطة الاستضافة الخاصة بك ، فإن أسهل طريقة للبدء هي الجمع بين الاثنين حيث يتيح لك ذلك إدارة كل شيء في مكان واحد.
ستسمح لك خطة الاستضافة بإيواء جميع الملفات التي يتكون منها موقعك. خادم الاستضافة الخاص بك هو المكان الذي ستقوم فيه بتثبيت ووردبريس والإضافات المذكورة في هذا البرنامج التعليمي.
بقدر ما تذهب خطط الاستضافة ، فهي تتراوح من خطط الاستضافة المشتركة ذات الأسعار المعقولة إلى استضافة ووردبريس المُدارة الأكثر تكلفة والخوادم المخصصة المتميزة. تعد خطة الاستضافة المشتركة خيارًا رائعًا إذا كان هذا هو موقع الويب الأول الخاص بك وكنت قد بدأت للتو. هناك العديد من شركات استضافة الويب ، مثل Bluehost و SiteGround وغيرها لتختار من بينها.
لا يوجد نقص في موفري خدمات استضافة ووردبريس الموصى بهم ولكن لأغراض هذا البرنامج التعليمي ، سنستخدم SiteGround. للبدء ، اتبع الخطوات أدناه:
قم بزيارة SiteGround وانقر على زر البدء
اختر خطة الاستضافة المناسبة لموقعك.
أدخل اسم المجال المطلوب لمعرفة ما إذا كان متاحًا
راجع طلبك وأكمله عن طريق إدخال معلومات الاتصال والدفع الخاصة بك.
بمجرد الاشتراك في خطة الاستضافة الخاصة بك ، ستتلقى بريدًا إلكترونيًا ترحيبيًا من Siteground يحتوي على جميع التفاصيل المتعلقة بحسابك. ابحث عن رابط تسجيل الدخول إلى منطقة حساب الاستضافة واستخدم اسم المستخدم وكلمة المرور لتسجيل الدخول إلى حسابك.
قبل أن نبدأ في التثبيت ، نود أن نشير إلى الفرق بين ووردبريس.org و ووردبريس.com ، حيث أنهما غالبًا ما يتسببان في حدوث ارتباك ، ويتم استخدامهما بالتبادل.
ووردبريس.org هو المكان الذي يجب أن تذهب إليه لتثبيت ووردبريس ، لهذا الدليل. هذا هو المكان الذي ستجد فيه الإصدار المجاني من برنامج ووردبريس. النقطة الأساسية هنا ، بصرف النظر عن حقيقة أنه مجاني ، هو أنه سيتعين عليك استضافة الموقع من خلال خدمة استضافة تابعة لجهة خارجية.
يقدم موقع ووردبريس.com المزيد من الخدمات والخيارات ، وبالتالي فهو اشتراك مدفوع. هنا سيكون لديك خيار الحصول على موقع على شبكة الإنترنت ، مع الاستضافة في غضون دقائق ، دون خدمات إضافية من طرف ثالث.
ووردبريس.org
ووردبريس.com
إنه مفتوح المصدر ومجاني للاستخدام. الجانب السلبي الوحيد لذلك ، هو أنك ستحتاج إلى خطة استضافة لطرف ثالث ، والتي تختلف تكلفتها ، ولكن يمكن أن تكون حوالي 40 دولارًا سنويًا.
لديها خمس خطط تسعير ، بما في ذلك الخطط المجانية حيث تبلغ أغلى خطة حوالي 45 دولارًا في الشهر.
الفائدة الرئيسية من ووردبريس.org هي حقيقة أنك تمتلك الموقع وأنك تتحكم فيه بالكامل ، على الرغم من أنه مجاني.
بينما يحتوي موقع ووردبريس.com على خطة مجانية ، إلا أنه محدود للغاية من حيث الملكية والتحكم. على سبيل المثال:
إذا انتهكت شروط الخدمة الخاصة بهم ، فيمكنهم ببساطة حذف موقع الويب الخاص بك.
النسخة المجانية تأتي مع اسم مجال ووردبريس.com.
سيعرض الموقع رابط “مدعوم من ووردبريس”.
لإزالة هذه العوامل المقيدة ، سيتعين عليك الترقية إلى خطة أكثر تكلفة (وليس بالضرورة الأقل تكلفة التالية).
يمكن أيضًا قياس تحكم المستخدم الكامل في موقع ووردبريس.org من حيث أنه يسمح بما يلي:
أضف أي مكون إضافي من مستودع مكونات ووردبريس الإضافية.
أضف أي موضوع متوافق.
من ناحية أخرى ، لا يسمح ووردبريس.com بتحميل المكونات الإضافية المخصصة ، حيث يأتي الإصدار المجاني مع Jet Elements مثبتة مسبقًا. بالإضافة إلى ذلك ، على الرغم من وجود مجموعة مختارة من السمات المجانية بالإضافة إلى السمات المميزة ، إلا أنها تتضاءل مقارنة بعدد لا يحصى من السمات التي يقدمها ووردبريس.org بشكل مباشر أو عبر أدوات إضافية تابعة لجهات خارجية.
فائدة أخرى رائعة لهذه الميزة هي أنه يمكنك وضع الإعلانات على موقع الويب الخاص بك ، وكسب المال مباشرة ، دون مشاركة الأرباح.
لا يسمح ووردبريس.com بوضع الإعلانات ، ويستخدم نظامًا يسمى WordAds ، يجب مشاركة أرباحه مع ووردبريس.com من خلال عمولة ..
بالإضافة إلى ذلك ، يتيح لك موقع ووردبريس.org استخدام أداة تحليلية مهمة مثل Google Analytics.
لا تسمح الخطة المجانية باستخدام Google Analytics ، وفي الواقع ، من أجل استخدامها ، سيتعين عليك الاشتراك في الخطة المميزة.
يجب أن يدرك المبتدئون أنه باستخدام ووردبريس.org ، يتحمل المستخدمون مسؤولية تحديث البرنامج وإنشاء نسخ احتياطية
يعتني ووردبريس.com بهذه المشكلات ، وسيتعين على المستخدمين القلق بشأن التحديثات والنسخ الاحتياطية.
بعد تسجيل الدخول إلى حساب الاستضافة الخاص بك ، انقر فوق علامة التبويب ” حساباتي” ثم قم بتسجيل الدخول إلى cPanel الخاص بك. في cPanel ، انقر فوق رمز ووردبريس في منطقة التثبيت التلقائي واتبع الخطوات لتثبيت ووردبريس.
ستحتاج إلى إدخال اسم مستخدم وكلمة مرور ستستخدمهما لتسجيل الدخول إلى موقعك جنبًا إلى جنب مع بعض المعلومات الأخرى. بعد ذلك ، انقر فوق الزر إنهاء التثبيت وانتظر تثبيت ووردبريس.
بعد تثبيت ووردبريس ، امض قدمًا وقم بزيارة موقع ووردبريس الخاص بك. أدخل الاسم وكلمة المرور اللذين أعددتهما وانقر فوق تسجيل الدخول للوصول إلى لوحة معلومات ووردبريس الخاصة بك.
في لوحة معلومات ووردبريس الخاصة بك ، انتقل إلى الإضافات> إضافة جديد . ابحث عن Elementor وانقر فوق تثبيت . عندما يتم تثبيت Elementor ، انقر فوق تنشيط .
ستحتاج أيضًا إلى Elementor Pro للاستفادة الكاملة من إمكانات Elementor. قم بزيارة Elementor.com واشتر إصدار Pro من المكون الإضافي ثم قم بتثبيته وتنشيطه بنفس الطريقة المذكورة أعلاه. بمجرد تثبيت Elementor Pro ، ستحتاج إلى إدخال الترخيص الخاص بك بالانتقال إلى لوحة معلومات ووردبريس الخاصة بك والانتقال إلى Elementor> License .
Envato Elements هو مكون إضافي مجاني لبرنامج ووردبريس تم إنشاؤه بواسطة Envato ، الشركة الأم التي تقف وراء ThemeForest. لا يزال المكون الإضافي جديدًا ولكنه يحتوي بالفعل على مجموعة رائعة من القوالب المصممة خصيصًا لـ Elementor.
يمكن استيراد كل قالب إلى مكتبة قوالب Elementor الفردية الخاصة بك ويمكنك العثور عليها ضمن القوالب الخاصة بي. يمكنك أيضًا إنشاء صفحة ويب مباشرة على الفور يتم حفظها كمسودة حتى تتمكن من البدء في تحريرها. سنستخدم عددًا من القوالب من Envato Elements لتسريع تصميم الموقع وعملية الإنشاء وجعله سهل الاستخدام قدر الإمكان لمستخدمي ووردبريس الجدد.
لتثبيت Envato Elements ، ارجع إلى الإضافات> إضافة جديد ، وابحث عن Envato Elements ، وانقر فوق تثبيت . بمجرد التثبيت ، قم بتنشيط المكون الإضافي.
الخطوة الأخيرة هي تثبيت موضوع TwentySeventeen. في معظم الحالات ، سيتم تثبيت سمة ووردبريس هذه مسبقًا مع تثبيت ووردبريس الخاص بك ، ولكن في حالة عدم وجودها ، اتبع هذه الخطوات لتثبيتها – إنها سمة مجانية.
في لوحة معلومات ووردبريس الخاصة بك ، انتقل إلى المظهر> السمات . في تلك الشاشة ، انقر فوق الزر ” إضافة جديد” . ابحث عن TwentySeventeen ، ثم انقر فوق تثبيت . عند انتهاء تثبيت النسق الجديد ، انقر فوق تنشيط .
الآن بعد أن غطينا الإعداد الفني ولديك كل شيء في مكانه ، حان الوقت لبدء العمل على موقعك. في هذا البرنامج التعليمي ، سنقوم ببناء موقع ويب من 4 صفحات يتكون من صفحة رئيسية وصفحة قائمة وصفحة حول وصفحة اتصل بنا. سنستخدم نموذج Juice Bar لبقية البرنامج التعليمي. هيا نبدأ.
في لوحة معلومات ووردبريس الخاصة بك ، انتقل إلى Elements . انقر على رابط الطعام والشراب في الجزء العلوي ، ثم قم بالتمرير لأسفل للعثور على قالب شريط العصير . انقر فوق القالب السادس المسمى Home 6 ثم انقر فوق الزر Import Pro template.
عندما يتم استيراد القالب ، أدخل اسم الصفحة وانقر فوق إنشاء صفحة جديدة سيتم حفظها في مسوداتك حتى تتمكن من العودة وتحرير القالب بمجرد إنشاء جميع الصفحات.
أثناء إنشاء الصفحة ، لديك خيار النقر فوق ارتباط الصفحة في الرسالة التي تظهر بعد إنشاء الصفحة بنجاح. يمكنك أيضًا تحرير النموذج الذي تم استيراده.
الآن وقد تم إنشاء جميع الصفحات ، حان الوقت لتخصيص موقعك وجعله خاصًا بك. سنبدأ بالتعرف على كيفية عمل Elementor ، ثم سنغوص في تعديل الأنماط المرئية مثل الألوان والخطوط والتخطيط.
لإنشاء صفحة القائمة ، اختر القائمة 5 ، وانقر فوق استيراد قالب Pro . يمكنك بعد ذلك اتباع نفس الخطوات المذكورة أعلاه لإنشاء مسودة لصفحة القائمة الخاصة بك باستخدام قالب Elementor هذا.
قم بتسمية قائمة الصفحة واضغط على زر إنشاء الصفحة . سيقوم المكون الإضافي بعمله السحري وسينتظرك القالب في قسم المسودات .
قم بإنشاء صفحة “حول” الخاصة بك بنفس الطريقة الموضحة أعلاه ، ولكن هذه المرة فقط اختر نموذج ” حوالي 1″ .
أخيرًا ، قم بإنشاء صفحة اتصل بنا باتباع نفس الخطوات السابقة. حدد نموذج ” اتصل بنا 2″ وقم باستيراده ، ثم قم بإنشاء الصفحة عن طريق إدخال الاسم الخاص بها والنقر فوق الزر ” إنشاء صفحة جديدة” .
تخصيص موقعك
أفضل طريقة للتعرف على Elementor هي رؤيته أثناء العمل. ابدأ بالانتقال إلى الصفحات> كافة الصفحات . ابحث عن الصفحة الرئيسية التي أنشأتها للتو وقم بالمرور فوق اسم الصفحة. عندما تظهر روابط القائمة أدناه ، انقر فوق تحرير باستخدام Elementor .
بمجرد تحميل الصفحة ، سترى قسمين على الشاشة. على اليسار ، ستلاحظ شاشة التحرير الخاصة بـ Elementor بينما يوضح لك الجانب الأيمن كيف تبدو صفحتك ويسمح لك بتعديل الهيكل والمحتويات.
يستخدم Elementor الأقسام والأعمدة وعناصر واجهة المستخدم لإنشاء تخطيط أي صفحة. الأقسام هي أكبر الكتل الإنشائية وستقوم بإضافة أعمدة تسمى الأقسام الداخلية بداخلها. داخل الأقسام أو الأعمدة الداخلية ، ستتمكن من إضافة عناصر واجهة مستخدم عبارة عن كتل محتوى تضيف نصًا وصورًا وأزرارًا وعناصر أخرى إلى صفحتك.
العمل مع الأقسام
عندما تحوم فوق قسم ، ستلاحظ ظهور حد أزرق بمقبض يتيح لك تحرير القسم أو إضافة قسم جديد أو حذف قسم من الصفحة بالكامل. يمكنك أيضًا النقر بزر الماوس الأيمن فوق المقبض وعناصر التحكم في قسم الوصول من هناك ، كما ترى من لقطة الشاشة أدناه.
يتيح لك النقر فوق الرمز + إضافة قسم جديد فوق القسم الحالي. سيتعين عليك بعد ذلك النقر فوق اللون الوردي + أو أيقونة المجلد لإنشاء هيكل للقسم الخاص بك أو اختيار قالب معدة مسبقًا.
العمل مع الأقسام الداخلية أو الأعمدة
بطريقة مماثلة ، يمكنك النقر فوق الحد الرمادي والمقبض المقابل لتحرير الأقسام الداخلية. يمكنك تعديل عرض الأعمدة وتغيير التباعد بين الأعمدة.
يتيح لك النقر بزر الماوس الأيمن فوق المقبض إضافة المزيد من الأعمدة وتكرار الأعمدة الموجودة وحذفها والمزيد.
العمل مع الحاجيات
أخيرًا ، يمكنك تحرير عناصر واجهة المستخدم الحالية بالنقر فوق رمز Pencil في مقبض الأداة أو عن طريق النقر بزر الماوس الأيمن فوقه. يمكنك تغيير محتوياته بالإضافة إلى الوصول إلى عناصر التحكم في الأنماط وتكرار عناصر واجهة المستخدم وحذفها والمزيد.
يمكنك أيضًا إضافة أدوات جديدة بسحب وإفلات بسيط من الجانب الأيسر من الشاشة وإفلاتها على صفحتك.
من أولى التخصيصات التي قد ترغب في القيام بها هي تعديل الألوان التي يستخدمها القالب. سيسمح لك ذلك بدمج ألوان عملك أو علامتك التجارية وتخصيص القالب بأسلوبك الخاص.
يمكنك تعديل الألوان على المستوى العام وعلى مستوى عنصر واجهة المستخدم الفردي. يعني تحرير الألوان على المستوى العام أن أي صفحة جديدة تقوم بإنشائها باستخدام Elementor سترث هذه الأنماط ، لذا كل ما عليك فعله هو إنشاء الهيكل وإدخال المحتوى. لتعديل إعدادات الألوان العامة ، انقر فوق قائمة الهامبرغر اليسرى في شاشة تحرير الصفحة. ثم انقر فوق الارتباط “الألوان الافتراضية” ضمن قائمة “النمط”.
كما ترى ، يمكنك تعديل مخطط الألوان الافتراضي عن طريق إدخال رموز الألوان السداسية الخاصة بك أو يمكنك تطبيق نظام ألوان معد مسبقًا إذا لم يكن لديك نظام ألوان خاص بك.
يمكن تجاوز إعدادات النمط العام من خلال تخصيص كل عنصر واجهة مستخدم على حدة. لتخصيص ألوان عناصر واجهة المستخدم الفردية ، حدد الأداة التي تريد تصميمها ثم انقر فوق علامة التبويب ” النمط” في شاشة تحرير عنصر واجهة المستخدم.
على غرار الألوان ، يمكنك تعديل أسلوب طباعة موقعك على المستوى العالمي وعلى مستوى عنصر واجهة المستخدم الفردي.
بشكل عام ، يمكنك تعيين مجموعات الخطوط وأوزان الخطوط للعناوين الأساسية والثانوية ونص النص والتشكيل.
لتحديد نمط طباعة عناصر واجهة المستخدم الفردية ، انقر فوق الأداة التي تريد تحريرها ثم انقر فوق النمط. من القائمة المنسدلة بجوار العائلة ، يمكنك الاختيار من بين مئات من خطوط Google أو يمكنك تحديد الخطوط الافتراضية وسيتم تطبيق الخطوط الافتراضية التي قمت بتعيينها ضمن الإعدادات العامة.
بمجرد تخصيص الألوان والخطوط على موقعك ، فقد حان الوقت لاستبدال الصور المخزنة بالصور الخاصة بك. للقيام بذلك ، انقر فوق القسم الذي تريد العمل معه. في هذه الحالة ، أرغب في تغيير الصورة في قسم “القوائم المميزة”. لقد قمت بالنقر فوق عمود Kiwi Bliss ثم انتقل إلى علامة التبويب Style .
أولاً ، ستحتاج إلى حذف الصورة الحالية بالنقر فوق حذف ثم النقر فوق علامة + لتحميل صورتك الخاصة. بمجرد تحميل مكتبة الوسائط ، انقر فوق تحميل الملفات ثم انقر فوق الزر تحديد الملفات .
ستقوم بعد ذلك بتحديد الصورة التي تريدها والنقر فوق الزر ” إدراج وسائط” . إذا كنت تعمل باستخدام صور الخلفية كما في المثال أعلاه ، فيمكنك أيضًا تغيير موضعها والتحكم في حجمها. لديك أيضًا خيار تغيير تراكب الخلفية أو إزالته تمامًا بالإضافة إلى تعيين الألوان لنص الصورة.
إذا كنت تعمل باستخدام صور عادية بدلاً من صور الخلفية ، فستتوفر لديك خيارات أقل قليلاً. على سبيل المثال ، لتغيير الصور وتخصيصها في قسم تسعير الوجبات بالصفحة الرئيسية ، ستتبع نفس الخطوات لحذف الصورة الموجودة ثم تحميل الصورة الخاصة بك. يمكنك بعد ذلك تغيير عتامة الصورة وإضافة عوامل تصفية CSS متنوعة مثل Blur والسطوع والمزيد.
يمكنك تطبيق أنماط مختلفة لحالة التمرير على الصورة وستظهر هذه الأنماط بمجرد تمرير الزائر فوق الصورة بالماوس.
لتخصيص بقية الصور على موقعك ، ما عليك سوى تكرار الخطوات أعلاه ثم النقر فوق ” نشر” لحفظها.
بمجرد تكوين جميع الأنماط حسب رغبتك ، فقد حان الوقت لبدء التغيير والتبديل في التخطيط. على سبيل المثال ، الصفحة الرئيسية التي نعمل بها تحتوي على 3 أعمدة ولكن ماذا لو كان عملك يحتوي على 4 خدمات؟ في هذه الحالة ، سترغب في إضافة عمود آخر.
للقيام بذلك ، انقر بزر الماوس الأيمن فوق مقبض القسم الداخلي وحدد إضافة عمود . سيتم إنشاء عمود جديد ويمكنك بعد ذلك المتابعة لإضافة الأدوات التي تريدها. بدلاً من ذلك ، يمكنك تكرار عمود موجود لتوفير الوقت. بمجرد نسخ العمود ، استبدل المحتوى بالمحتوى الخاص بك.
يمكنك أيضًا إضافة قسم آخر إلى صفحتك ، كما ذكرنا سابقًا. فيما يلي عملية خطوة بخطوة لإضافة مثال على قسم “حول”:
انقر فوق رمز + في مقبض القسم الموجود أسفل قائمة تسعير القائمة.
اضبط الهيكل على عمود واحد
اضبط العمود على العرض الكامل
اسحب عنصر واجهة مستخدم العنوان واكتب العنوان الخاص بك
اسحب عنصر واجهة المستخدم للقسم الداخلي واختر عمودين
أضف صورة إلى العمود الأيسر وأضف أداة نص إلى العمود الأيمن
اختر صورة من جهاز الكمبيوتر الخاص بك وقم بتحميلها إلى عنصر واجهة المستخدم الصورة
أدخل وصفًا موجزًا لعملك في أداة النص
اسحب فوق أداة الزر أسفل عنصر واجهة النص
قم بتعيين الزر للارتباط بصفحة “حول” الخاصة بك.
عند الانتهاء من إجراء التغييرات المطلوبة ، انقر فوق الزر “نشر” الأخضر وستظهر تغييراتك على الموقع.
كما ترى ، يأتي النموذج الذي نعمل معه مع روابط وسائل التواصل الاجتماعي في التذييل. يمكنك تحريرها بسهولة من خلال النقر على الرموز واستبدالها بأيقونات ترتبط بملفات تعريف الوسائط الاجتماعية المفضلة لديك.
يمكنك إضافة المزيد من الروابط بالنقر فوق الزر ” إضافة عنصر” . قم بتخصيص الرموز عن طريق تغيير الشكل ثم انقر فوق علامة التبويب ” النمط” للتحكم في لون الرمز وحجمه وتركيبه وغير ذلك. كما ترى من لقطة الشاشة أدناه ، أضفت رمز Pinterest وقمت بتغيير الرموز إلى شكل مربع بلون أزرق.
تجدر الإشارة إلى أنه يمكنك إضافة أيقونات اجتماعية في أي مكان على الصفحة عن طريق السحب فوق أداة الروابط الاجتماعية . يمكنك بعد ذلك اختيار الرموز التي تريد عرضها وتهيئة طريقة عرضها عن طريق تغيير الشكل والحجم والألوان والمزيد.
في هذا المثال ، أضفت الرموز إلى قسم “حول” الذي تم إنشاؤه في الخطوة السابقة.
بمجرد الانتهاء من تعديل صفحتك الرئيسية ، انقر فوق ” نشر” ثم انقر فوق الزر ” الخروج إلى لوحة المعلومات” .
حتى الآن حدثت غالبية التخصيصات الخاصة بك على الصفحة الرئيسية. دعنا نلقي نظرة على كيفية تعديل عناصر أخرى مثل نموذج الاتصال في صفحة اتصل بنا. ابدأ بالرجوع إلى Pages> جميع الصفحات وتحديد صفحة اتصل بنا . انقر فوق تحرير باستخدام Elementor .
انقر فوق عنصر واجهة المستخدم للنموذج ثم ابدأ في تعديل المعلومات. يمكنك النقر فوق عناصر النموذج الفردية لإضافة حقول للبريد الإلكتروني ورقم الهاتف والتاريخ والنص وموقع الويب والمزيد. يمكنك أيضًا إضافة المزيد من الحقول بالنقر فوق الزر ” إضافة عنصر” .
في هذا المثال ، أضفت حقلاً لخيارات المقاعد بحيث يمكن للعملاء المحتملين اختيار طاولة داخلية أو خارجية.
يتيح لك النموذج أيضًا اختيار بريد إلكتروني يتلقى عمليات إرسال النماذج وكذلك ما يجب أن يحدث بمجرد ملء النموذج. يمكنك اختيار تلقي إشعار بالبريد الإلكتروني وإعادة توجيه الزائرين إلى صفحة شكر خاصة وإضافتهم إلى قائمة بريدك الإلكتروني والمزيد. عند الانتهاء ، انقر فوق الزر ” نشر” الأخضر وستظهر تغييراتك مباشرة على الصفحة.
المهمة التالية في قائمتك هي تخصيص النسخة على القوالب. للقيام بذلك ، ستقوم بتحرير الأدوات مباشرة واستبدال النص بالنص الخاص بك. يمكنك البدء بأي صفحة بالانتقال إلى Pages> All Pages ثم تمرير مؤشر الماوس فوق الصفحة التي تريد تحريرها. انقر فوق تحرير باستخدام Elementor . في المثال أدناه ، أقوم بتحرير نسخة صفحة “حول”.
بمجرد تحميل شاشة التحرير ، انقر فوق النص الذي تريد تحريره. ستلاحظ ظهور محرر نصوص على الجانب الأيسر يشبه محرر منشور ووردبريس العادي. يمكنك بعد ذلك تغيير النص وإضافة الصور والنماذج والروابط وتنسيق النص والمزيد.
لتحرير مناطق النص الأخرى على موقعك ، كل ما عليك فعله هو تكرار الخطوات المذكورة أعلاه. انقر فوق النص ، واحذف النسخة الحالية ، وأدخل نسختك الخاصة. كما هو الحال دائمًا ، عند الانتهاء ، انقر فوق الزر ” نشر” الأخضر وستظهر تغييراتك مباشرة على الصفحة.
من الجدير بالذكر أنه أثناء قيامك بتحرير النص ، لا يزال بإمكانك إجراء تعديلات على الطباعة وضبط لون النص كما وصفناه سابقًا في المقالة.
باستخدام ميزة Elementor و block ، يمكنك إضافة قوالب رأس وتذييل مخصصة أو معدة مسبقًا واستخدامها في كل صفحة من صفحات موقعك أو يمكنك إنشاء رؤوس مختلفة لكل صفحة.
مضيفا رؤوس
لإنشاء رأس ، انقر فوق رمز + في القسم العلوي في أي صفحة ، ثم انقر فوق رمز المجلد . بمجرد تحميل مكتبة القوالب ، انقر فوق Blocks ، ومن القائمة المنسدلة اختر فئة Header .
اختر كتلة رأس تريدها ثم انقر فوق الزر ” إدراج” . ثم ، انقر فوق إعدادات القسم وضمن إعدادات التخطيط ، قم بتعيين علامة HTML على رأس الصفحة . يمكنك أيضًا ضبط العرض على العرض الكامل ، وضبط التباعد بين عناصر واجهة المستخدم ، وإضافة المزيد من الأدوات إليه ، والمزيد.
كما ترى في لقطة الشاشة أدناه ، قمت بإزالة رمز البحث واستبدله بالرموز الاجتماعية. عندما تنتهي من تعديل الرأس ، انقر بزر الماوس الأيمن على مقبضه وحدد حفظ كقالب . يمكنك بعد ذلك إعادة استخدام العنوان عبر جميع الصفحات على موقعك.
إضافة تذييلات مخصصة
بطريقة مماثلة ، يمكنك إنشاء أقسام تذييل لصفحاتك. ابدأ بالنقر فوق رمز المجلد أسفل القسم الأخير في الصفحة واختر ” كتل” ، ثم ” تذييل الصفحة” من القائمة المنسدلة. اختر كتلة تذييل تريدها وانقر فوق إدراج .
يمكنك بعد ذلك تصميم عنصر التذييل بنفس طريقة أي قسم وعناصر واجهة مستخدم أخرى في صفحتك. عندما تنتهي من تصميم تذييل الصفحة ، انقر على مقبضه واضغط على حفظ كقالب . قم بتسميته وانقر فوق حفظ ، ثم لا تتردد في إعادة استخدامه على أي صفحة على موقعك.
عندما تنتهي من إضافة عناصر الرأس والتذييل وتصميمها ، ما عليك سوى النقر فوق الزر ” نشر” على الجانب الأيسر من الشاشة وسيتم تخصيص صفحتك بالكامل وستظهر على موقعك.
بمجرد حفظ الرأس والتذييل ، يمكنك الرجوع وتطبيقهما على صفحات أخرى. للقيام بذلك ، انتقل إلى Pages> جميع الصفحات وحدد صفحة لتحريرها باستخدام Elementor . بعد ذلك ، انقر فوق رمز + أعلى القسم العلوي ، وانقر فوق رمز المجلد وانتقل إلى القوالب الخاصة بي . ابحث عن قسم الرأس المحفوظ وانقر فوق الزر ” إدراج” .
لإضافة التذييل ، قم بالتمرير إلى أسفل الصفحة وانقر فوق رمز المجلد في الجزء السفلي. انقر فوق القوالب الخاصة بي ثم اختر كتلة التذييل المحفوظة. انقر فوق ” تحديث” لحفظ التغييرات.
بمجرد الانتهاء من إجراء جميع التغييرات على صفحاتك ، هناك بعض التخصيصات الأخيرة التي تحتاج إلى إجرائها في ووردبريس نفسه. تحتاج إلى تحميل شعارك وإنشاء قائمة حتى يتمكن الزوار من التنقل في موقعك ، ثم تعيين الصفحة الرئيسية لموقعك في النهاية.
لنبدأ بتحميل شعار. للقيام بذلك ، في لوحة معلومات ووردبريس الخاصة بك ، انتقل إلى المظهر> تخصيص . بمجرد تحميل أداة التخصيص ، انقر فوق Site Identity ثم انقر فوق Select Logo .
عند تحميل مكتبة الوسائط ، انقر فوق تحميل الملفات ، وحدد ملف الشعار من جهاز الكمبيوتر الخاص بك وانقر فوق تحديد . ثم انقر فوق ” نشر” لحفظ التغييرات.
بمجرد تحميل الشعار ، انتقل إلى المظهر> القوائم وأدخل اسمًا لقائمتك. ثم انقر فوق ” إنشاء قائمة” . من هناك ، تحقق من الصفحات التي قمت بإنشائها وتخصيصها أعلاه على الجانب الأيمن من الشاشة.
يمكنك بعد ذلك سحب الصفحات لتخصيص ترتيب عرضها وتحديد موضع هذه القائمة. عند الانتهاء من تخصيص القائمة ، انقر فوق حفظ القائمة .
الخطوة الأخيرة لتخصيص ووردبريس هي تعيين الصفحة التي ستكون بمثابة الصفحة الرئيسية لموقعك. للقيام بذلك ، انتقل إلى الإعدادات> القراءة . بجوار السطر الذي يقول “يتم عرض صفحتك الرئيسية” ، حدد صفحة ثابتة وحدد الصفحة الرئيسية التي قمت بإنشائها. انقر فوق حفظ التغييرات ، ثم قم بزيارة موقعك لترى كيف يبدو.
بمجرد إضافة صفحة أو منشور ، ستتمكن من الوصول إلى إعدادات تحسين محركات البحث ، مثل عناوين التعريف والأوصاف وتنسيقات السلاج والمزيد. نحن نشجعك على التأكد من ملئها بالشكل المناسب.
يلخص عنوان التعريف (المعروف أيضًا باسم علامة العنوان) المحتوى الموجود في الصفحة المحددة. يظهر هذا العنوان في المتصفحات والنتائج في محركات البحث والمواقع الأخرى مثل Twitter أو Facebook. يجب عليك تضمين الكلمات الرئيسية ذات الصلة في العنوان.
يسمح لك الوصف التعريفي بكتابة ملخص قصير للصفحة ومحتواها. يظهر هذا أيضًا في صفحة نتائج البحث.
الرخويات هي ، في جوهرها ، الجزء الأخير من عنوان URL. يجب أن تكون قصيرة وفي صلب الموضوع وأن تلتقط جوهر الصفحة أو المنشور.
هذه بعض من مُحسّنات محرّكات البحث التي يمكنك تغييرها دون تنزيل مكونات إضافية ، ويجب عليك التأكد من تحسينها لصالح موقع الويب الخاص بك.
قبل أن نختتم هذا البرنامج التعليمي ، دعنا ننتقل إلى الخطوات التي تحتاجها لإنشاء قالب منشور لمدونتك بالإضافة إلى تخطيط مخصص لصفحة مدونتك. سيسمح لك ذلك بإنشاء منشور واحد وتخطيط صفحة مدونة يتطابق مع بقية موقعك.
على الرغم من أن السمة الخاصة بك توفر هذه القوالب خارج منطقة الجزاء ، فإنها لن تشبه باقي موقعك عند استخدام قالب معدة مسبقًا أو إنشاء نموذج من البداية باستخدام Elementor. قد يتسبب ذلك في إرباك الزوار وقراء المدونة ، لذا يوصى بشدة بإنشاء نموذج خاص بك لهاتين الصفحتين.
لإنشاء قالب منشور مدونة واحد ، انتقل إلى Elementor> My Templates . انقر فوق Single ثم Add New Single . من القائمة المنسدلة ، حدد فردي ، ثم ضمن تحديد نوع المنشور ، حدد نشر ، وأدخل اسمًا يسهل العثور على القالب لاحقًا. انقر فوق إنشاء نموذج .
بمجرد تحميل المكتبة ، تصفح القوالب للعثور على النموذج الذي يعجبك والذي يتطابق مع بقية موقعك. بعد ذلك ، انقر فوق إدراج قالب . يمكنك أيضًا إنشاء قسم خاص بك من البداية عن طريق إضافة أقسام وعناصر واجهة مستخدم إلى القالب. تأكد من ضبط تخطيط الصفحة على Elementor Canvas ثم أدخل كتلة الرأس والتذييل المحفوظة.
بمجرد الانتهاء من تصميم القالب ، انقر فوق نشر . يمكنك بعد ذلك اختيار ما إذا كان هذا القالب مستخدمًا لجميع المنشورات أو لفئات معينة فقط ، وأكثر من ذلك. اضبط الشروط حسب رغبتك ثم اضغط على زر النشر .
لا يعد قالب أرشيف المدونة أكثر من صفحة تعرض جميع منشورات المدونة بترتيب زمني عكسي. يتيح لك إنشاء قالب لصفحة المدونة الخاصة بك باستخدام Elementor تطبيق نفس الأنماط مثل باقي موقعك بالإضافة إلى جعل صفحة المدونة بنفس الشكل والأسلوب كبقية الصفحات على موقعك.
لإنشاء قالب أرشيف مدونة ، انتقل إلى لوحة معلومات ووردبريس وانتقل إلى Elementor> My Templates . انقر فوق ” أرشيف” ثم الزر ” إضافة أرشيف جديد” . هذه المرة ، ستختار الأرشفة من القائمة المنسدلة ثم تدخل اسمًا لها. ثم ، انقر فوق الزر ” إنشاء نموذج” الأخضر .
هذه المرة ، تأكد من تحديد الأرشيف في القائمة المنسدلة عند تحميل المكتبة وحدد قالب الأرشيف الذي تريده. انقر فوق الزر ” إدراج” أو قم بإنشاء واحد من البداية. عيّن تخطيط الصفحة إلى Elementor Canvas ثم أضف رأس الصفحة وتذييلها المحفوظين.
الخطوة الأخيرة هي النقر فوق نشر عند الانتهاء من تصميم قالب الأرشيف. على غرار نموذج المنشور الفردي ، ستتمكن من اختيار ما إذا كان يجب تطبيق ذلك على جميع الأرشيفات أو فئات معينة أو علامات أو تصنيفات أخرى. انقر فوق نشر وسيتم الانتهاء من أرشيف المدونة المخصص الخاص بك.
قد تكون مهمة إنشاء موقع ويب على ووردبريس صعبة ومرهقة وربما حتى مخيفة للأشخاص الجدد في بناء مواقع الويب. ومع ذلك ، مع Elementor ، تصبح هذه المهمة سهلة وبسيطة بشكل استثنائي.
يقدم Elementor كل ما تحتاجه لبناء موقع الويب. من منشئ مرئي رائع – حيث يمكنك تعديل موقع الويب الخاص بك بصريًا بسحب وإفلات بسيط (بما في ذلك رأس الصفحة وتذييلها) ، إلى العديد من الأدوات – التي تعزز وظائف موقع الويب الخاص بك وتسمح له بالتميز عن المنافسة ، والكثير ، أكثر.
خدمة لغوية وبحثية ومكتبية
خدمة جامعية في ماليزيا
متجر الكتروني للمنتجات والانظمة البرمجية المدفوعة، المجانية والتي يتم الحصول عليها بطريقة رسمية وآمنة وسريعة، تساعد موثوق في بناء بيئات تشغيل متكاملة تساعد اصحاب الاعمال والفريلانسر والشركات الكبيرة على اداء عملها بشكل متميز
تم وبكل فخر وحب 
تصميم وتطوير الموقع باستخدام تقنية الوردبريس 
واستضافة نيم تشيب العالمية 
تم تطوير الصفحات بواسطة تقنية الاليمنتور 
00970599163031
00970599163031
تم تصميم وتطوير موقع موثوق من قبل المصمم والمبرمج عبدالرحمن قدورة لصالح شركة موثوق للمعلومات الرقمية وخدمات الاونلاين، جميع الحقوق محفوظة لموثوق لعام 2020 – 2021
تقدم موثوق خدمة تصمم وتطوير المتاجر الالكترونية والمواقع بمختلف اشكالها على منصة الوردبريس، نصمم ونطور المواقع بأدوات قوية حسب احتياجات العميل، سرعة، أداء عالي.
00970599163031
