hur man designar en WordPress-Anpassad sidmall [uppdatering 2021]

Cutsom WordPress-mallar

WordPress-Teman är bara bra. De gör WordPress webbdesign så lätt.

men vad händer när du vill gå utöver ditt valda tema?

vad händer om du vill använda en anpassad WordPress-layout på en viss sida?

Tja, vissa teman tillåter dig inte att ändra deras layouter.

Bildresultat för min meme

men det finns några lösningar för detta.

Följ mig för att ta reda på det.

Vad är en anpassad sidmall och hur man tilldelar en?

WordPress-sidor och inläggslayout styrs av en mallfil med namnet ”sida.php”. Mallar är filer som berättar för WordPress hur man visar olika typer av innehåll.

nu kanske du inte vill att alla sidor och inlägg ska se likadana ut. Det här är när du behöver en anpassad sidmall.

vilka WordPress – sidmallar använder du?

vill du ta reda på vilken sidmall du använder eller hur du växlar mellan mallar?

det är lätt peasy, du måste:

  1. gå över till din WordPress Admin Dashboard,
  2. från menyn till vänster, Välj ”sidor”,
  3. håll muspekaren över titeln på en sida,alla sidor i WordPress
  4. från menyn under titeln, välj ”Quick Edit”,
  5. från ”Quick Edit”,
  6. redigera ”fönster, gå till rullgardinsmenyn” mall”.

WordPress-mallar

här kan du se alla tillgängliga temamallar och du kan tilldela en annan mall till din nuvarande sida.

det finns till exempel ett alternativ att ändra din sida till full bredd, om du vill. Men det finns inget alternativ för en mall som lägger till en andra sidofält.

det är därför anpassade WordPress-mallar kan komma till nytta. När du sparar en ny mall kommer den också att finnas tillgänglig tillsammans med de gamla.

nu kan du tilldela göra denna uppgift inne på sidan också. När du väljer att redigera en sida, på höger sida, gå över till ”Sidattribut”-> Mall.

tilldela en sidmall

hur man skapar ett barntema

nu, innan vi blir smutsiga med att skapa en WordPress Anpassad sidmall, finns det en sak att tänka på: Gör ändringarna på ett barntema. Du vill inte orsaka några oåterkalleliga ändringar av det överordnade temat.

ett WordPress-barntema är ett undertema som ärver alla funktioner och stilar i det överordnade temat. Om det överordnade temat får en uppdatering påverkas inte ditt barntema och dina ändringar skrivs inte över.

nu, Hur skapar du ett barntema? Här är stegen:

  1. logga in på din cPanel,
  2. gå till Filhanteraren,öppna filhanteraren i cPanel
  3. gå över till public_html -> wp-content -> teman mapp,Öppna teman mapp i cPanel
  4. medan du är inne i mappen ”teman”, Lägg till en ny mapp från ”+mapp” i den övre menyn. Ge det ett namn. En bästa praxis är att använda namnet på temat, som du lägger till ”-barn”. Använd också bindestreck istället för utrymme. I mitt fall kommer jag att använda mesmerize-child, för jag använder Mesmerize-temat,
  5. inuti mappen, skapa en ny fil och kalla den ”style.css”,skapa stil.css i cPanel
  6. . Högerklicka på filen och välj alternativet ”Redigera”.
    /* Theme Name: Your Theme Child Theme URL: http://yourdomain.comDescription: Your Theme Child Theme Author: Your NameAuthor URL: http://yourdomain.comTemplate: yourtheme Version: 1.0.0 Text Domain: yourtheme-child */

    här kan du klistra in en del av koden i den överordnade CSS-filen, eller lägga till din egen styling.

  7. Ändra tema och domännamn och tryck sedan på ”Spara”,
  8. skapa en annan fil i samma mapp. Den här gången heter det ” funktioner.php”. Klistra in följande kod:
    <?phpadd_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );}?>
  9. gå till WordPress Dashboard, utseende -> tema. Ditt barntema kommer att vara där, du måste bara aktivera det.

och du är klar.

nästa, låt oss göra en ny mall, ska vi?

hur man skapar en WordPress Anpassad sidmall?

du kan börja från den befintliga temakoden och göra nödvändiga justeringar.

här är stegen:

  1. gå till cPanel -> filhanterare,
  2. navigera till public_html -> wp-content -> teman mapp,
  3. öppna din huvudtema mapp,
  4. identifiera sidan.php-fil. Det kommer att se ut så här:
    <?php mesmerize_get_header(); ?> <div class="page-content"> <div class="<?php mesmerize_page_content_wrapper_class(); ?>"> <?php while (have_posts()) : the_post(); get_template_part('template-parts/content', 'page'); endwhile; ?> </div> </div><?php get_footer(); ?>
  5. välj filen och välj sedan”kopiera”,
  6. i fönstret som dyker upp, ändra sökvägen till filen, till den i din temabarnmapp,kopiera sida.php till ny filplats
  7. Byt namn på den nya filen så att du enkelt kan identifiera vad den gör.
  8. Lägg till en kommentar i filen så att du kan berätta för WordPress att det här är en ny anpassad mall. Gör detta genom att välja ”Redigera” och infoga den här texten:
    /* * Template Name: Your custom TEmplate's name * description: >- Explain what your new templates does */

    din nya fil ska se ut så här:

    <?php /* * Template Name: Custom Full Width * description: >- Page template without sidebar */mesmerize_get_header(); ?> <div class="page-content"> <div class="<?php mesmerize_page_content_wrapper_class(); ?>"> <?php while (have_posts()) : the_post(); get_template_part('template-parts/content', 'page'); endwhile; ?> </div> </div><?php get_footer(); ?>

du kan också lägga till kopior av andra filer här. Du kan till exempel anpassa singeln.php-fil, som kommer att ändra utseendet och känslan av blogginlägg.

Därefter måste du rulla upp ärmarna och skriva lite kod.

och om du vill ändra CSS-styling kan du göra detta i barntema Customizer, inuti Aditional CSS eller inuti stilen.css-fil.

det finns dock en enklare lösning…

med en webbplatsbyggare som Colibri står all kod ”bakom” och blockerar inte en icke-teknisk webbplatsskapare. Varje tillägg eller ändring till en anpassad sida återspeglas visuellt i Anpassaren. Således har webbplatsskaparen mer kontroll över designen. Den vackra anpassade sidan kommer att vara klar på ett ögonblick, utan att bry sig om koden bakom sidan.

Lämna ett svar

Lämna ett svar

Din e-postadress kommer inte publiceras.