Creați un șablon de pagină personalizat într-o temă WordPress

Unul dintre cele mai importante puncte de vânzare ale WordPress este ideea temelor. O singură temă adaugă o mare valoare designului și funcționalității site-ului web. Cu toate acestea, există site-uri web care au modele diferite pe pagini diferite.

Din păcate, mai multe teme WordPress restricționează utilizatorii să modifice aspectele și funcționalitatea pentru o altă pagină din ierarhie. Șablonul de pagină personalizată WordPress permite utilizatorilor să integreze cerințe personalizate, cum ar fi bara laterală dreaptă / stângă pe o anumită pagină, o funcționalitate suplimentară de îndemn sau poate un antet unic pentru o anumită pagină de destinație. Să ne adâncim în continuare pentru a vedea cum șablonul de pagină personalizată WordPress afișează diferite tipuri de conținut.

Un șablon de pagină personalizat WordPress ar putea fi utilizat în mai multe scopuri. Unele idei includ:

• Afișați postările recente din fiecare categorie
• Încorporați Google Map sau orice script
• Lista tuturor autorilor.
• Imagini încărcate recent
• Pagina de design personalizat pentru portofoliu
• Pagina de contact

Aspectul tuturor paginilor și postărilor care sunt create pe un site web WordPress este gestionat de un fișier șablon numit page.php . Crearea sau editarea unui șablon de pagină personalizat în WordPress necesită cunoștințe de bază despre HTML, CSS și PHP.

Pur și simplu deschideți orice editor de text și lipiți următorul cod în el.

 <? php / * Nume șablon: PageWithoutSidebar * /?>

Linia de cod de mai sus spune WordPress că este un fișier șablon numit PageWithoutSidebar . Puteți folosi orice nume doriți. Acum salvați acest fișier ca PageWithoutSidebar.php . Din nou, puteți utiliza orice alt nume pentru fișier. Dar nu uitați să păstrați extensia ca .php

Acum, vom testa noul fișier șablon nou creat.

Conectați-vă la panoul dvs. de găzduire. În acest exemplu, folosesc Cloudways - O găzduire WordPress cu cea mai rapidă gestionare. Cloudways acceptă aplicații WordPress cu opțiunile furnizorului pentru AWS, DigitalOcean, GCP, Linode și Vultr. Navigați la folderul / wp-content / themes . Deschideți folderul temei curent și încărcați fișierul PageWithoutSidebar.php acolo.

Accesați Panoul de administrare WordPress > Pagini> Adăugați un nou . Puteți vedea noul șablon de pagină personalizată listat în partea dreaptă.

Creați o pagină nouă și setați șablonul acesteia la PageWithoutSidebar. După ce ați terminat, publicați- l.

Deschideți pagina nou creată. Deoarece nu există încă elemente de design în șablon, este afișată o pagină goală precum imaginea de mai jos.

Acest lucru arată că șablonul de pagină personalizat din WordPress este implementat cu succes, prin urmare puteți crea o temă WordPress adaptabilă personalizată

Este timpul să adăugați câteva linii de cod pentru a afișa conținutul paginii.

Pentru această demonstrație, voi discuta despre modul în care ați putea personaliza șablonul de pagină implicit Twenty Sixteen.

Aspectul implicit al paginilor este generat de fișierul page.php situat în folderul / wp-contents / themes / YOUR THEME / . Deschideți page.php și copiați acest cod.

 <? php get_header (); ?>

<div class = "content-area">
                <main class = "site-main" role = "main">
                                <? php
                                // Porniți bucla.
                                while (have_posts ()): the_post ();

                                                // Includeți șablonul de conținut al paginii.
                                                get_template_part ('template-parts / content', 'page');

                                                // Dacă comentariile sunt deschise sau avem cel puțin un comentariu, încărcați șablonul de comentarii.
                                                if (comments_open () || get_comments_number ()) {
                                                                comments_template ();
                                                }

                                                // Sfârșitul buclei.
                                în cele din urmă;
                                ?>

                </main> <! - .site-main ->

                <? php get_sidebar ('content-bottom'); ?>

</div> <! - .content-area ->

<? php get_sidebar (); ?>
<? php get_footer (); ?>

Lipiți acest cod în PageWithoutSidebar.php chiar sub această linie de cod.

 <? php / * Nume șablon: PageWithoutSidebar * /?>

Salvați-l!

Fișierul dvs. complet PageWithoutSidebar.php va arăta ca mai jos.

 <? php / * Nume șablon: PageWithoutSidebar * /?>

<? php get_header (); ?>

<div class = "content-area">

                <main class = "site-main" role = "main">

                                <? php

                                // Porniți bucla.
                                while (have_posts ()): the_post ();

                                                // Includeți șablonul de conținut al paginii.
                                                get_template_part ('template-parts / content', 'page');

                                                // Dacă comentariile sunt deschise sau avem cel puțin un comentariu, încărcați șablonul de comentarii.
                                                if (comments_open () || get_comments_number ()) {

                                                                comments_template ();

                                                }

                                                // Sfârșitul buclei.
                                în cele din urmă;

                                ?>

                </main> <! - .site-main ->

                <? php get_sidebar ('content-bottom'); ?>

</div> <! - .content-area ->

<? php get_sidebar (); ?>

<? php get_footer (); ?>

Reveniți la pagina dvs. și actualizați-o. Veți observa că totul funcționează așa cum funcționează pe tema implicită WordPress Twenty Sixteen.

Acum, să-l personalizăm. După cum puteți vedea, există o bară laterală în partea dreaptă. Îl voi elimina numai din această pagină. Toate celelalte pagini vor avea aspectul implicit al temei Twenty Sixteen.

Deschideți fișierul PageWithoutSidebar.php . Derulați în jos până la sfârșitul fișierului și eliminați :

 <? php get_sidebar (); ?>

Aceasta este linia de cod care obține bara laterală pe pagină. După îndepărtarea liniei, salvați-o . Deschideți adresa URL a paginii, iar bara laterală nu mai este!

După cum puteți vedea, bara laterală a fost eliminată cu succes din această pagină. Cu toate acestea, alinierea textului nu este bună. Există un spațiu gol în partea dreaptă. Remedierea constă în justificarea și extinderea textului pentru a umple ecranul.

Reveniți la PageWithoutSidebar.php și găsiți:

 <div class = "content-area">

Pur și simplu schimbați „ conținut-zonă ” la „ site-conținut-lățime completă ” și ați terminat. Reîmprospătați pagina, iar conținutul este pe toată lățimea.

Încă curios de ce am creat un șablon de pagină personalizat când aș fi putut edita cu ușurință fișierul page.php ? Este destul de evident că dacă fișierul page.php este editat, toate paginile de pe site ar afișa modificările. Pentru a aplica aspect personalizat pe anumite pagini, șablonul de pagină personalizat din WordPress este util. De asemenea, puteți defini un rol de utilizator personalizat în WordPress pentru a atribui diferite privilegii utilizatorilor.

Dacă aveți întrebări, nu ezitați să întrebați postând în secțiunea de comentarii de mai jos.