تحويل قوالب HTML إلى ثيمات WordPress

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

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

في هذه المقالة ، سنغطي أربع طرق مختلفة لتحويل قالب HTML. لكل منها ، سنوفر الإرشادات والموارد التي يمكن أن تساعدك في جلب موقع ويب مستند إلى HTML في حظيرة WordPress. هناك الكثير لتغطيته ، لذلك دعونا نتعمق في الأمر!

تحويل HTML يدويًا

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

عادةً ، ستستخدم تطبيق بروتوكول نقل الملفات الآمن (SFTP) لهذا الغرض. بمجرد وصولك إلى موقع الويب الخاص بك ، يمكنك المتابعة مع الخطوات التالية.

الخطوة 1: قم بإنشاء مجلد سمة

أولاً ، ستحتاج إلى إنشاء مجلد للاحتفاظ بملفات السمات الجديدة الخاصة بك ، وتسميتها باسم القالب الجديد الخاص بك. باستخدام محرر الكود الخاص بك ، يمكنك إنشاء خمسة ملفات محددة:

• style.css
• index.php
• header.php
• تذييل. php
• الشريط الجانبي. php

في الوقت الحالي ، يمكنك ترك هذه الملفات فارغة وحفظها في المجلد الذي أنشأته للتو.

الخطوة 2: انسخ والصق CSS الحالي

أولويتك التالية هي تخصيص ملف ورقة الأنماط المتتالية (CSS). هذا هو المكان الذي ستحدد فيه جميع عناصر الأنماط المختلفة لموقعك.

في الجزء العلوي ، من الأفضل إضافة بعض المعلومات حول الملف. في الواقع ، عندما يتعلق الأمر بـ WordPress ، هناك بعض العناصر المطلوبة حتى يتم عرض السمة في دليل السمات.

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

الخطوة 3: افصل HTML الموجود

في موقع الويب الأصلي الخاص بك ، من المحتمل أن تكون تعليمات HTML البرمجية التي تعين الرأس والتذييل والشريط الجانبي ومناطق المحتوى الرئيسية في ملف index.html الخاص بك. الآن ، ستحتاج إلى تقسيم كل عنصر من هذه العناصر إلى الملفات الجديدة التي قمت بإنشائها لموضوع WordPress الخاص بك.

على سبيل المثال ، في ملف index.html لموقع الويب الأصلي الخاص بك ، يمكنك تحديد موقع علامة <div> الأولى بالفئة "main". يمكن بعد ذلك نسخ كل ما يسبق هذه العلامة ولصقه في ملف header.php الجديد.

ستقوم بعد ذلك بتكرار هذه العملية لعلامات "الشريط الجانبي" و "التذييل". انسخ الكود الموجود في كل عنصر من هذه العناصر ، والصقه في ملفات PHP المعنية.

الآن ، ما تبقى لديك هو الجزء الأساسي من ملف index.html الخاص بك. هذا هو ما يشكل تخطيط المحتوى الرئيسي لموقع الويب المستند إلى HTML. ستحتاج إلى نسخ هذا الرمز المتبقي ولصقه في ملف index.php الجديد.

الخطوة 4: تكوين ملف index.php الخاص بك

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

على سبيل المثال ، يمكنك جعل القالب الخاص بك يعرض ملف الرأس الذي قمت بإنشائه باستخدام العلامة التالية:

get_header();

ستضع هذا في ملف قالب index.php الخاص بك ، أو في الصفحات اللاحقة حيث تريد ظهور الرأس. الأمر نفسه ينطبق على التذييل الخاص بك.

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

الخطوة 5: قم بتحميل المظهر الجديد الخاص بك

الآن بعد أن أصبح المظهر الجديد جاهزًا للعمل ، ستحتاج إلى وضع مجلده في wp-theme / content / directory لموقع الويب الخاص بك:

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

استيراد محتوى HTML مع البرنامج المساعد

هناك طريقة أخرى للتعامل مع هذه العملية وهي استخدام مكون إضافي لنقل المحتوى من موقعك القديم المستند إلى HTML. لسوء الحظ ، يتوفر عدد قليل جدًا من الأدوات المتوافقة مع الإصدارات الحديثة من WordPress. يمكنك التحقق من نسخة تجريبية مجانية من WP Site Importer ، ومع ذلك:

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

استخدام موضوع الطفل

هناك طريقة أخرى لنقل موقع HTML الخاص بك إلى WordPress وهي استخدام سمة فرعية. يحتوي هذا على نفس الوظيفة والأسلوب الأساسي مثل موضوعه الأصلي ، ولكن ستتمكن من الحفاظ على أي تعديلات وتخصيصات تقوم بها ، حتى إذا قمت بتحديث الوالد.

الخطوة 1: اختر موضوعًا

هناك العديد من السمات المجانية المبنية جيدًا للاختيار من بينها في دليل سمات WordPress. بمجرد تحديد الملف الذي يعجبك ، ستحتاج إلى تثبيته حتى تكون ملفاته متاحة في دليل ملفات موقع الويب الخاص بك:

ومع ذلك ، لا تحتاج إلى تنشيط هذا الموضوع الأصلي.

الخطوة 2: قم بإنشاء مجلد لموضوع طفلك

بعد ذلك ، ستحتاج إلى الوصول إلى ملفاتك باستخدام تطبيق FTP ، وإنشاء مجلد جديد في دليل wp-content / theme . يجب أن يحمل هذا الملف نفس اسم القالب الرئيسي الخاص بك ، مع إضافة "-child" إلى نهايته.

على سبيل المثال ، إذا كنت ستنشئ قالبًا فرعيًا لـ Twenty Nineteen ، فيمكنك إنشاء مجلد يسمى twentynineteen-child:

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

الخطوة 3: قم بإعداد ورقة أنماط

ستكون خطوتك التالية هي إعداد ملف style.css الخاص بك. يتطلب WordPress بعض المعلومات المحددة في ورقة الأنماط لجعل علاقة موضوع الوالدين والطفل تعمل. يمكنك أيضًا لصق معلومات التصميم الإضافية من ملفات HTML الأصلية إذا لزم الأمر.

الخطوة 4: قم بإعداد ملف Function.php

الآن بعد أن أصبح لديك نسقان تعملان بهما ، ستحتاج إلى إخبار WordPress أن موضوع طفلك يعتمد على CSS الخاص بالوالد. لذلك ، يمكنك استخدام استدعاء PHP wp_enqueue_style () .

ستنشئ أولاً ملف function.php ، وتضعه في مجلد نسق طفلك. هذا هو الملف الذي ستنفذ فيه وظيفة قائمة الانتظار التي توضح تبعيات السمة والتسلسل الهرمي.

الخطوة 5: تفعيل موضوع طفلك

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

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

شراء خدمة تحويل الموقع

إذا لم يكن لديك الوقت أو الموارد لإجراء تحويل بنفسك ، يمكنك أيضًا التحقق من خدمة التحويل. بالإضافة إلى ذلك ، إذا كنت بحاجة إلى المزيد من الموارد أو المساعدة في ترحيل محتوى WordPress آخر ، فنحن هنا في WP Engine نقدم العديد من الحلول والموارد للترحيل والتحويل.

1. HireWPGeeks

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

2. حلول FantasTech

FantasTech Solutions هي خدمة تحويل أخرى من HTML إلى WordPress. تعلن عن تحويلات احترافية للغاية من HTML إلى قوالب قوالب WordPress عالية الجودة ومشفرة جيدًا. ستحتاج إلى أن تضع في اعتبارك أن التكاليف تبدأ من 297 دولارًا للصفحة الواحدة. تبدأ الصفحات الإضافية بسعر 147 دولارًا لكل منها ، مع تسعير دقيق اعتمادًا على التعقيد.

قم بتخصيص تجربة موقعك مع WP Engine

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

هنا في WP Engine ، نعتقد أن موارد المطور المناسبة يمكن أن يكون لها تأثير كبير على مشاريعك. بالإضافة إلى الحلول المبتكرة ، نقدم خططًا ومستويات تسعير لأي ميزانية!