آموزش طراحی قالب تمام عرض وردپرس

آموزش طراحی قالب تمام عرض وردپرس

آیا شما می خواهید سایت تمام عرض داشته باشید پس این مقاله را تا انتها بخوانید. در وردپرس بسیاری از قالب ها هستند که این قابلیت را دارا می باشند و شما می توانید به راحتی از آن استفاده کنید.

قالب تمام عرض چیست؟

تم و قالب های وردپرس امکانی در وردپرس است که همگی با آن آشنا هستند قالب تمام عرض به این معنی است که در صفحه اصلی کل فضای و صفحه مرورگر را می پوشاند و محیطی خالی نمیماند و هیچ گونه ساید باری در چپ و یا سمت راست سایت دیده نمی شود.

استفاده از قابلیت تمام عرض پیشفرض در قالب

این مورد در قالب هایی قابل استفاده است که خود دارای این قابلیت باشد برای فهمیدن این موضوع ابتدا وارد قسمت مدیریت وردپرس شده و در بخش برگه ها و افزودن برگه کلیک کنید و یا صفحه مورد نظر خود را ویرایش کنید و در صفحه قابلیت تمام عرض را در زیر متاباکس ویژگی های برگه انتخاب کنید و بعد صفحه را ذخیره نمایید.
حال اگر قالب شما از این قابلیت پشتیبانی نکند باید چه کرد؟ چگونه باید این قابلیت را فعال کرد و یا به وجود آورد؟
هیچ جای نگرانی نیست لازم نیست شما به صورت دستی این قابلیت را در قالب خود ایجاد نمایید.

 

ایجاد قابلیت تمام صفحه در قالب به صورت دستی

برای انجام این کار شما باید فایل های قالب را ویرایش کنید و کد هایی را به آن ها بیفزایید قبل از انجام این کار از سایت خود پشتیبان تهیه کنید. نوت پد را باز کنید و کد زیر را در آن قرار دهید.

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>

این فایل را با نام full_width. Php ذخیره کنید سپس با ftp client به سایت خود متصل شوید و فایل page. Php را باز کنید بعد از خط get _header را کپی کنید و در فایل full_width قرار دهید. وارد فایل full_width شوید و کد زیر را از داخل آن حذف نمایید

<?php get_sidebar();?>

با استفاده از کد بالا ساید بار را از صفحه حذف کنید ولی ممکن است کد بالا را پیدا نکنید و دیگر نیازی به این کار نیست چرا که قالب ها با هم متفاوت است و ممکن است به صورت کد زیر باشد:

<div id="primary" class="content-area"><!--?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; ?--> <!-- .site-main --></div>

<!-- .content-area --> <!--?php get_footer(); ?-->

سپس فایل full_width را در سایت خود آپلود کنید و از آن در سایت خود استفاده کنید سپس در صفحه به دنبال متا باکس ویژگی های صفحه باشید و سپس در منوی بازشو گزینه قالب را انتخاب کنید سپس صفحه خود را مشاهده کنید خواهید دید که سایت شما تمام عرض شده است و هیچ گونه ساید بار و فضای خالی مشاهده نخواهید کرد.
در صورتی که این اتفاق نیافتاده است مشکل از استایل قالب شماست و باید استایل را به قالب اضافه کنید برای اضافه کردن از کد زیر استفاده کنید

.page-template-full-width .content-area {
width: 100%;
margin: 0px;
border: 0px;
padding: 0px;
 }
.page-template-full-width .site {
margin:0px;
 }

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

پارس وی دی اس