Vil du oprette en side med fuld bredde på WordPress?

Mange af WordPress-temaer kommer allerede med en indbygget sideskabelon i fuld bredde, som du kan bruge. Nogle WordPress-temaer har dog ikke denne funktion. i dette tutoriel, viser vi dig, hvordan du nemt opretter en side med fuld bredde på WordPress.

Men før, hvis du aldrig har installeret WordPress-opdagelse Sådan installeres en WordPress blog 7 trin et Hvordan at finde, installere og aktivere et WordPress tema på din blog 

Så tilbage til, hvorfor vi er her.

Metode 1: Brug af en indbygget breddeskabelon på dit WordPress-tema

Denne metode anbefales, hvis dit WordPress-tema allerede er forsynet med en sideskabelon i fuld bredde. Hvis du ikke har en, skal du tjekke følgende valg og få en.

Først skal du redigere en side eller oprette en ny ved at gå til " Sider> Tilføj En ny side.

I sideværtsredigeringsvinduet skal du vælge Fuld bredde som en skabelon under afkrydsningsfeltet sideattributter.

Efter at have valgt modellen Fuld breddeskal du registrere din side. Du kan fortsætte med at tilpasse siden for at tilføje mere indhold eller klikke på preview-knappen for at se den i handling.

Hvis du ikke har en fuld bredde - fuld bredde - skabelonindstilling på din side redigeringsskærm, betyder det, at dit WordPress-tema ikke har det. 

Men rolig, vi viser dig, hvordan du nemt opretter en side i fuld bredde uden at ændre et WordPress-tema.

2-metode: Sådan opretter du en sideskabelon med fuld bredde

Denne metode kræver, at du redigerer filerne i det WordPress-tema, du bruger, og at du har en grundlæggende forståelse af PHP, CSS og HTML.

For øvrig inviterer vi dig også til at konsultere 8 bedste WordPress-plugins til nemt at oprette dine layouts 

Men inden du går videre, skal du opret en WordPress-sikkerhedskopi eller i det mindste en sikkerhedskopi af dit nuværende WordPress-tema. Dette hjælper dig med nemt at gendanne dit websted, hvis der sker noget dårligt. 

Først skal du åbne en teksteditor som Notesblok og indsætte følgende kode i en tom fil:

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

Nu skal du gemme denne fil som " Full-width.php På din computer.

Denne kode angiver simpelthen navnet på en filskabelon og beder WordPress om at udtrække header-skabelonen.

Dernæst skal du bruge indholdet af koden. Opret forbindelse til dit websted ved hjælp af en FTP-klient (eller filhåndtering i cPanel) gå derefter til " / Wp-content / temaer / din-tema-mappe / '.

Derefter skal du finde filen kaldet " page.php ". Dette er dit temas standardsideskabelonfil.

Kopier alt efter funktionen « get_header () Og indsæt den i en fil " Full-width.php At du har oprettet på din computer.

Nu skal du se på indholdet af filen "full-bredde.php" og slette denne kodelinje:

<?php get_sidebar(); ?>

Denne linje tager simpelthen sidebjælken og viser den i dit WordPress-tema. Ved at fjerne dette viser dit tema ikke sidebjælken, når du bruger skabelonen Fuld bredde.

Du kan muligvis se denne linje vises mere end én gang på dit WordPress-tema. Hvis dit WordPress-tema har flere sidebjælker (widgetområder, som sidefoden kaldes også sidebjælker)du vil se hver sidebar henvist til én gang i koden. Du skal beslutte, hvilke sidebjælker du vil beholde.

Dit websted ser ud til at indlæses langsomt, opdag Hvorfor du skal begynde at optimere din WordPress-blog efter billeder

Hvis dit tema ikke viser sidebjælker på din side, kan du muligvis ikke finde denne kode i din fil.

Sådan tager vores fuld-bredde.php-kode at udføre ændringerne. Din kode kan se lidt anderledes ud afhængigt af dit tema.

<?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 -->
</div><!-- .content-area -->
<?php get_footer(); ?>

Derefter skal du downloade filen Full-width.php »På din WordPress-temamappe ved hjælp af FTP-klient.

Du har oprettet og uploadet en tilpasset sideskabelon i fuld bredde til dit tema. Det næste trin er at bruge denne skabelon til at oprette en side med fuld bredde.

Gå til dit betjeningspanel, og rediger eller opret en ny side.

På skærmbilledet til redigering af sider skal du finde afkrydsningsfeltet til sideattributter og klikke på rullemenuen under indstillingen "Skabelon".

Du kan se din model. Gå videre, vælg den og gem eller opdater siden.

Nu kan du besøge dit websted, og du vil se, at sidebjælkerne er væk, og din side vises som en enkelt kolonneside. Det er muligvis ikke fyldt endnu, men nu er du klar til at streame det anderledes.

Gør dit websted populært ved at opdage 7 WordPress plugins til at optimere SEO af dine billeder

Du bliver nødt til at bruge inspiceringsværktøjet til at finde de CSS-klasser, dit tema bruger til at definere indholdsområdet.

Derefter kan du justere bredden til 100% ved hjælp af CSS. Vi brugte følgende CSS-kode:

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

.page-template-full-width .site {
margin:0px;
}

Sådan ser det ud Twenty Seventeen.

Det er alt sammen til denne tutorial, jeg håber, det giver dig mulighed for at oprette sider i fuld bredde.

Ovenstående metoder er gratis for dem, der har råd til og vil hurtigt oprette layout i fuld bredde eller fuld bredde.

Oplev også nogle premium WordPress-plugins  

Du kan bruge andet WordPress plugins for at give et moderne udtryk og for at optimere håndteringen af ​​din blog eller hjemmeside.

Vi tilbyder dig her nogle premium WordPress-plugins, der hjælper dig med det.

1. Divi Builder

Divi Builder er en højbygger af sider, der er meget værdsat af Elegant Temaer. Selvom det generelt bruges som en del af Divi WordPress-temaet, er Divi Builder også et enkeltstående plugin, som du kan bruge på andre WordPress-temaer.

Divi Builder giver dig mulighed for at redigere dit indhold ved hjælp af en visuel grænseflade i front-enden samt en grænseflade på back-end, selvom de fleste brugere foretrækker den første grænseflade.

Dybest set i stedet for sidebjælker er det alt i pop op-vinduer og flydende knapper. Det giver dig adgang til 316 foruddesignede skabeloner fordelt på 40 forskellige præsentationspakker samt muligheden for at gemme dine egne designs som skabeloner.

Vi foreslår, at du opdager Sådan opretter du en professionel blog

Et af Divis træk har altid været kontrollen med de stilarter, han giver dig. På tre forskellige faner kan du konfigurere forskellige indstillinger, herunder responsive kontroller, tilpasset afstand og mere.

Du kan endda tilføje tilpasset CSS, da dens CSS-editor inkluderer grundlæggende validering og automatisk udfyldelse. En af kritikken fra Divi Builder har altid været, at den er afhængig af kortkoder. Hvilket betyder, at hvis du deaktiverer det en dag, vil det efterlade en masse shortcodes i dit indhold. Selvom dette er lidt deprimerende, er det mindre af et problem nu, hvor der findes plugins som Shortcode Cleaner.

Downloade | demo | Web-hosting

2. Themify Builder

Themify Builder er overraskende tilbudet af Themify-teamet. Det integrerer det i flere af deres WordPress-temaer for at give kunderne enkle tilpasningsmuligheder. Men du kan også købe det som et enkeltstående plugin og bruge det med ethvert WordPress-tema.

Ligesom Divi Builder og WPBakery Page Builder, lader Themify Builder dig oprette layouts i front-end eller back-end. En anden god ting er, at dette plugin giver dig mulighed for at tilpasse dine responsive breakpoints (men kun på et website-dækkende niveau).

Oplev Sådan installeres og konfigureres WooCommerce for oprette en online butik og nemt sælge dine produkter på internettet 

En cool ting ved Themify Builder er, at den stadig lader dig bruge standard WordPress-editoren, mens andre sidebyggere tvinger dig til at bruge WordPress-grænsefladen. sidebygger for alt.

Downloade | demo | Web-hosting

3. Elementor

Oprindeligt lanceret i 2016, er Elementor WordPress-plugin en af ​​de yngste sidebygere på denne liste. På trods af sin sene start samlede Elementor hurtigt over 1 aktive installationer på WordPress.org, hvilket gør det til en af ​​de mest populære WordPress-sidebygere.

Hvad der gør sit omdømme er det flydende visuelle interface, dets forskellige stilindstillinger og andre kraftfulde funktioner såsom fuldstændig oprettelse af WordPress-temaer.

Dens interface er opdelt i to hoveddele med en tredje zone til bestemte parametre. Den gratis version af Elementor tilbyder 28 gratis widgets. Pro-versionen medfører 30 andre widgets, i alt 58-widgets i Pro-versionen. Den gratis version inkluderer omkring 40 gratis skabeloner, mens Pro-versionen bringer hundreder af ekstra skabeloner.

 Downloade | demo | Web-hosting

Andre anbefalede ressourcer

Find ud af om andre anbefalede ressourcer, der hjælper dig med at opbygge og administrere dit websted.

• Sådan ændres dit WordPress-tema sikkert
• Sådan konfigureres leverancer på WooCommerce
• 10 premium WordPress plugins fra Booking og Booking
• Hvornår og hvordan du installerer WordPress i en undermappe
• 10 WordPress plugins til at forbedre hastigheden på din blog

Konklusion

Her er ! Det er det til denne tutorial. Hvis du har et WordPress-tema, der ikke tilbyder en fuld bredde-side som en skabelon, så håber vi, at denne vejledning har hjulpet dig med at løse den mangel. Tøv ikke med at del med dine venner på dine foretrukne sociale netværk. 

Du vil dog også kunne konsultere vores ressourcer, hvis du har brug for flere elementer til at udføre dine projekter med oprettelse af internetsider ved at konsultere vores guide om WordPress blog oprettelse.

Hvis du har forslag eller bemærkninger, skal du lade dem stå i vores afsnit kommentarer.

...