هل تريد إنشاء صفحة كاملة العرض في ووردبريس ، حتى تتمكن من توسيع المحتوى الخاص بك عبر الشاشة؟
تأتي معظم قوالب ووردبريس بالفعل مع قالب صفحة مدمج كامل العرض يمكنك استخدامه. ومع ذلك ، إذا لم يكن القالب الخاص بك يحتوي على واحد ، فمن السهل إضافته.
كما يمكنك الاطلاع على كيفية تكرار صفحة في ووردبريس
في هذه المقالة ، سنوضح لك كيفية إنشاء صفحة كاملة العرض بسهولة في ووردبريس وحتى إنشاء تخطيطات صفحة مخصصة بالكامل بدون أي كود.
فيما يلي 5 طرق لإنشاء صفحة كاملة العرض:
الطريقة الأولى: استخدم نموذج العرض الكامل للقالب الخاص بك
إذا كان القالب الخاص بك يأتي بالفعل مع قالب صفحة كامل العرض ، فمن الأفضل استخدامه ببساطة. تقريبًا جميع قوالب ووردبريس الجيدة تفعل ذلك.
غالبًا ما تأتي أفضل قوالب ووردبريس المجانية بقالب كامل العرض ، لذلك هناك فرصة جيدة لامتلاك واحد بالفعل.
أولاً ، تحتاج إلى تحرير صفحة أو إنشاء صفحة جديدة بالانتقال إلى Pages » Add New في لوحة معلومات ووردبريس الخاصة بك.
في جزء “المستند” الأيمن من محرر المحتوى ، تحتاج إلى توسيع قسم “سمات الصفحة” من خلال النقر على السهم المتجه لأسفل بجواره. سترى بعد ذلك القائمة المنسدلة “نموذج”.
إذا كان لديك قالب كامل العرض لموضوعك ، فسيتم إدراجه هنا. يجب أن يطلق عليه شيء مثل “نموذج العرض الكامل”:
ستختلف الخيارات التي تراها هنا وفقًا لموضوعك. لا تقلق إذا لم يكن القالب الخاص بك يحتوي على قالب صفحة كامل العرض.
يمكنك بسهولة إضافة واحدة باستخدام الطرق أدناه.
الطريقة الثانية: إنشاء قالب صفحة عرض كامل باستخدام الإضافات
هذه الطريقة هي الأسهل وتعمل مع جميع سمات ووردبريس وإضافات أداة إنشاء الصفحات.
أولاً ، تحتاج إلى تثبيت وتفعيل الإضافات Fullwidth Templates.
سيضيف الإضافة Fullwidth Templates ثلاثة خيارات جديدة إلى قوالب صفحتك:
هذه الخيارات هي:
FW No Sidebar: يزيل الشريط الجانبي من صفحتك ، لكنه يترك كل شيء آخر كما هو
FW Fullwidth: يزيل الشريط الجانبي والعنوان والتعليقات ويمد التخطيط إلى العرض الكامل
FW Fullwidth No Header Footer: يزيل كل ما يفعله FW Fullwidth ، بالإضافة إلى الرأس والتذييل
إذا كنت ستستخدم محرر ووردبريس المدمج ، فمن المحتمل أن يكون “FW No Sidebar” هو الخيار الأفضل.
بينما يتيح لك هذه الإضافة إنشاء قالب صفحة كامل العرض ، فإن خيارات التخصيص لديك محدودة.
إذا كنت ترغب في تخصيص قالب العرض الكامل الخاص بك دون أي رمز ، فأنت بحاجة إلى استخدام أداة إنشاء الصفحات.
الطريقة الثالثة: تصميم صفحة كاملة العرض في ووردبريس باستخدام ملحق Page Builder
إذا لم يكن القالب الخاص بك يحتوي على قالب كامل العرض ، فهذه هي أسهل طريقة لإنشاء قالب كامل العرض وتخصيصه.
يسمح لك بتحرير صفحة العرض الكامل الخاصة بك بسهولة وإنشاء تخطيطات مختلفة للصفحة لموقع الويب الخاص بك باستخدام واجهة السحب والإفلات.
لهذه الطريقة ، ستحتاج إلى إضافة منشئ صفحات ووردبريس . في هذا المقال ، سنستخدم Beaver Builder. إنها واحدة من أفضل الإضافات لإنشاء صفحات السحب والإفلات ، وتتيح لك إنشاء تخطيطات الصفحة بسهولة دون كتابة أي رمز.
أولاً ، قم بتثبيت وتفعيل الإضافة Beaver Builder.
بمجرد تنشيطه ، يمكنك إما تعديل صفحة حالية أو إنشاء صفحة جديدة.
في جزء “المستند” على الجانب الأيمن من شاشتك ، انتقل إلى “سمات الصفحة” وحدد قالبًا بالعرض الكامل من القائمة المنسدلة.
بعد ذلك ، انقر فوق الزر “Launch Beaver Builder” في منتصف شاشتك.
الآن ، استخدم واجهة السحب والإفلات في Beaver Builder لإنشاء صفحتك.
أفضل طريقة للبدء هي النقر على علامة التبويب “النماذج” في الأعلى. حدد أحد القوالب المعدة مسبقًا لاستخدامها كأساس لصفحة العرض الكاملة الخاصة بك.
انقر فوق قالب لتحديده وسيقوم مصمم الصفحة بتحميله. يمكنك بعد ذلك تحرير أي عنصر تريد تغييره ، مثل الصور.
تم تصميم تخطيطات Beaver Builder باستخدام صفوف ووحدات نمطية. يمكن أن يحتوي كل صف على عدة أعمدة وداخل كل صف ، يمكنك إضافة وحدات المحتوى وعناصر واجهة المستخدم.
لتحرير صف أو وحدة في التخطيط ، ما عليك سوى النقر فوقه. في هذه الحالة ، نحن بصدد تعديل وحدة العنوان:
سيفتح Beaver Builder تفاصيل العنصر في نافذة منبثقة حيث يمكنك تعديل إعداداته. يمكنك تغيير النص وتغيير الخطوط والألوان وإضافة صور الخلفية أو تغييرها والمزيد.
يمكنك إضافة وحدات وعناصر واجهة مستخدم في أي وقت إلى التخطيط الخاص بك. يأتي Beaver Builder مع العديد من وحدات المحتوى الأساسية والمتقدمة التي يمكنك فقط سحبها وإفلاتها في صفحتك.
بمجرد الانتهاء من التحرير ، انقر فوق “تم” في الجزء العلوي من الصفحة. يمكنك بعد ذلك حفظ مسودتك أو نشرها.
يمكنك الآن زيارة صفحتك لرؤية صفحتك كاملة العرض النهائية.
الطريقة الرابعة: إنشاء صفحات كاملة العرض مخصصة بالكامل باستخدام SeedProd
بينما يعد Beaver Builder حلاً أنيقًا ، إلا أنه من المحتمل أن يبطئ مدونة ووردبريس الخاصة بك.
إذا كنت تبحث عن إنشاء صفحة مقصودة مخصصة تمامًا حيث تريد تخصيص رأس الصفحة وتذييلها وجميع مناطق الصفحة ، فإننا نوصي باستخدام SeedProd.
إنها أفضل إضافة للصفحة المقصودة لـ ووردبريس ، وهي تأتي مع واجهة إنشاء صفحات السحب والإفلات سهلة الاستخدام للغاية.
أولاً ، تحتاج إلى تثبيت وتفعيل الإضافة SeedProd. بعد التنشيط ، ما عليك سوى الانتقال إلى SeedProd » Pages لإضافة صفحة مقصودة جديدة.
يمكنك الاختيار من بين العديد من القوالب الجاهزة ، والتي تتضمن العديد من خيارات العرض الكامل. أو يمكنك إنشاء صفحة مقصودة مخصصة بعرض كامل من البداية.
أفضل جزء في SeedProd هو أنه سريع للغاية ، ويأتي مع ميزات تحويل مضمنة لإدارة المشتركين ، وتكامل خدمة التسويق عبر البريد الإلكتروني ، والمزيد.
بصرف النظر عن منشئ الصفحة المقصودة ، فإن SeedProd لديه أيضًا ميزة السحب والإفلات منشئ القوالب. هذا يعني أنه يمكنك بسهولة إنشاء قالب ووردبريس مخصصة كاملة العرض دون تعديل أي رمز.
ما عليك سوى الانتقال إلى SeedProd »Theme Builder لإنشاء قالب ووردبريس جديدة. مرة أخرى ، يمكنك الاختيار من بين 28+ قالب قابل للتخصيص أو يمكنك تصميم كل جزء من القالب الخاص بك من البداية.
بمجرد التأشير والنقر ، يمكنك تعديل كل جزء من قالبك . على سبيل المثال ، يمكنك إضافة صورة خلفية جديدة وتعيين الموضع وعرض القسم على ملء الشاشة.
الطريقة الخامسة: إنشاء قالب صفحة ووردبريس بعرض كامل يدويًا
هذه الطريقة هي الملاذ الأخير إذا لم تعمل أي من الطرق المذكورة أعلاه من أجلك. يتطلب منك تعديل ملفات قالب ووردبريس الخاصة بك. ستحتاج إلى بعض الفهم الأساسي لـ PHP و CSS و HTML.
قبل المضي قدمًا ، نوصي بإنشاء نسخة احتياطية من ووردبريس أو على الأقل نسخة احتياطية من القالب الحالي الخاص بك. سيساعدك هذا في استعادة موقعك بسهولة إذا حدث خطأ ما.
بعد ذلك ، افتح محرر نص عادي مثل Notepad والصق الكود التالي في ملف فارغ:
<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>
- احفظ هذا الملف كملف full-width.php على جهاز الكمبيوتر الخاص بك. قد تحتاج إلى تغيير “حفظ كنوع” إلى “كل الملفات” لتجنب حفظه كملف .txt:
يحدد هذا الرمز ببساطة اسم ملف القالب ويطلب من ووردبريس إحضار قالب الرأس.
بعد ذلك ، ستحتاج إلى جزء المحتوى من الكود. اتصل بموقعك على الويب باستخدام عميل FTP (أو مدير ملفات استضافة ووردبريس في cPanel) ثم انتقل إلى / wp-content / theme / your-theme-folder /.
أنت الآن بحاجة إلى تحديد موقع ملف page.php. هذا هو ملف قالب الصفحة الافتراضي لموضوعك.
افتح هذا الملف وانسخ كل شيء بعد سطر get_header () والصقه في ملف full-width.php على جهاز الكمبيوتر الخاص بك.
في ملف full-width.php ، ابحث عن هذا السطر من التعليمات البرمجية واحذفه:
<?php get_sidebar(); ?>
يجلب هذا الخط الشريط الجانبي ويعرضه في القالب الخاص بك. سيؤدي حذفه إلى إيقاف القالب الخاص بك من إظهار الشريط الجانبي عند استخدام قالب العرض الكامل.
قد ترى هذا السطر أكثر من مرة في القالب الخاص بك. إذا كان القالب الخاص بك يحتوي على عدة أشرطة جانبية (تسمى مناطق عنصر واجهة مستخدم التذييل أيضًا أشرطة جانبية) ، فسترى كل شريط جانبي مشار إليه مرة واحدة في الكود. حدد الأشرطة الجانبية التي تريد الاحتفاظ بها.
إذا كان القالب الخاص بك لا يعرض الأشرطة الجانبية على الصفحات ، فقد لا تجد هذا الرمز في ملفك.
إليك كيفية ظهور رمز full-width.php بالكامل بعد إجراء التغييرات. قد تبدو التعليمات البرمجية الخاصة بك مختلفة قليلاً حسب القالب الخاص بك.
<?php
/*
*
Template Name: Full Width
*/
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
// Start the loop.
while ( have_posts() ) :
the_post();
// Include the page content template.
get_template_part( 'template-parts/content', 'page' );
// If comments are open or we have at least one comment, load up the comment template.
if ( comments_open() || get_comments_number() ) {
comments_template();
}
// End of the loop.
endwhile;
?>
</main><!-- .site-main -->
<?php get_sidebar( 'content-bottom' ); ?>
</div><!-- .content-area -->
<?php get_footer(); ?>
بعد ذلك ، قم بتحميل ملف full-width.php إلى مجلد القالب الخاص بك باستخدام عميل FTP.
لقد نجحت الآن في إنشاء وتحميل قالب مخصص لصفحة العرض الكامل إلى قالبك. الخطوة التالية هي استخدام هذا القالب لإنشاء صفحة كاملة العرض.
توجه إلى منطقة إدارة ووردبريس الخاصة بك وقم بتحرير أو إنشاء صفحة جديدة في محرر قوالب ووردبريس .
في جزء “المستند” على اليسار ، ابحث عن “سمات الصفحة” وانقر على السهم المتجه لأسفل لتوسيع هذا القسم إذا لزم الأمر. من المفترض أن ترى القائمة المنسدلة “نموذج” حيث يمكنك تحديد نموذج “العرض الكامل” الجديد الخاص بك:
بعد تحديد هذا النموذج ، قم بنشر أو تحديث الصفحة.
عند عرض الصفحة ، ستلاحظ اختفاء الأشرطة الجانبية ، وستظهر صفحتك كعمود واحد. قد لا يكون العرض كاملًا بعد ، لكنك الآن جاهز لتصميمه بشكل مختلف.
ستحتاج إلى استخدام أداة الفحص لمعرفة فئات CSS المستخدمة بواسطة قالبك لتحديد منطقة المحتوى.
بعد ذلك ، يمكنك ضبط عرضه على 100٪ باستخدام CSS. يمكنك إضافة كود CSS بالانتقال إلى Appearance » Customize والنقر على” CSS إضافي “أسفل الشاشة.
استخدمنا كود CSS التالي في موقع الاختبار الخاص بنا:
.page-template-full-width .content-area {
width: 100%;
margin: 0px;
border: 0px;
padding: 0px;
}
.page-template-full-width .site {
margin:0px;
}
إليك كيفية ظهوره على موقعنا التجريبي باستخدام قالب Twenty Sixteen.
إذا كنت ترغب في استخدام الطريقة اليدوية وتريد إجراء المزيد من التخصيص ، فيمكنك أيضًا استخدام الإضافة CSS Hero الذي يتيح لك تعديل أنماط CSS باستخدام محرر التأشير والنقر.
ومع ذلك ، بالنسبة لمعظم المستخدمين ، نوصي باستخدام نموذج العرض الكامل للقالب الخاص بك ، أو استخدام إضافة لإنشاء واحد.
نأمل أن تساعدك هذه المقالة في تعلم كيفية إنشاء صفحة كاملة العرض بسهولة في ووردبريس .