✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

WordPress-teeman opetusohjelma aloittelijoille – Osa 5: Viestitietojen käyttö

25

Tämä WordPress-teeman opetusohjelman oppitunti aloittelijoille käsittelee sitä, kuinka voimme käyttää ja tulostaa tietoja, kuten sen linkin, otsikon ja muuta jokaisesta viestistä, kun olemme viestisilmukan sisällä. Teemme tämän mallitunnisteilla. Samanaikaisesti lisäämme teemaamme myös yksittäisen näkymän mallit.

Edellisessä vaiheessa lisäsimme post-silmukan, joka sisältää the_post()toiminnon. Tämä funktio määrittää globaalit muuttujat ja varmistaa, että voimme käyttää yksinkertaisia ​​ja intuitiivisia funktiokutsuja, joita kutsutaan mallitunnisteiksi, kun olemme whilesilmukan sisällä.

Yleisimmät postaussilmukassa käytettävät mallitunnisteet

Tämä on luettelo yleisimmistä mallitunnisteista, joita haluat käyttää postauksen tietojen käyttämiseen:

  • the_title()toistaa viestin otsikon.
  • the_permalink()tulostaa viestin pysyvän linkin/URL-osoitteen.
  • the_content()tulostaa viestin sisällön (editorilta)
  • the_excerpt()toistaa viestin otteen. Jos otekenttä on tyhjä, tämä toistaa tekstin sisällöstä ensimmäiset 55 sanaa "…" kanssa.
  • the_ID()tulostaa viestin tunnuksen.
  • the_category()toistaa kaikki liittyvät luokat.
  • the_tags()tulostaa kaikki liittyvät tunnisteet.
  • the_date()toistaa viestin julkaisupäivämäärän.
  • the_time()tulostaa viestin julkaisuajan.
  • the_author()toistaa viestin kirjoittajan näyttönimen
  • the_post_thumbnail()tulostaa viestin esittelykuvan. Opimme lisäämään tuen esiteltyille pikkukuville myöhemmin tässä opetusohjelmassa.

On monia muitakin. Jos olet kiinnostunut, katso WordPress Codexin dokumentaatio kaikista viestitunnisteista. Katso lisää myös otsikon "post tags" ulkopuolelle – ne ovat hieman hajallaan tällä sivulla.

Aloitetaan joidenkin näiden tunnisteiden käyttöönotto index.php. Lisään myös hyvin yksinkertaista HTML:ää vain muotoillakseni tulosteen paremmin. Suosittelen lisäämään oman HTML-koodisi! Lisää divsejä, jaksoja, osioita, otsikoita ja niin edelleen haluamillasi luokilla.

Täsmennetään silmukkaa index.php:ssä

index.phpHaluaisin lisätä silmukan sisään linkin, joka menee viestin pysyvään linkkiin. Linkin sisällä haluaisin toistaa viestin otsikon. Sitten haluaisin myös toistaa postauksen otteen ja sen luokat.

<?php get_header(); ?>
<?php 
if (have_posts()) {
    while (have_posts()): the_post();
        <article <?php post_class(); ?>>
            <h2>
                <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
            </h2>
            <?php the_excerpt(); ?>
            <?php the_category(); ?>
        </article>
    endwhile;
    the_posts_pagination();
} else {
    ?><p>No posts, sorry.</p><?php
}
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Mitä yllä oleva koodi tekee on;

  • Rivi #5 lisää HTML- <article>tunnisteen kutsulla, post_class()joka luo hyödyllisiä viestiluokkia – aivan kuten body_class()käytimme edellisessä vaiheessa.
  • Riville #6-8 lisäämme <h2>otsikon tunnisteen, jossa on linkki, joka johtaa viestin pysyvään linkkiin (yksi näkymä).
  • Rivi #9 toistaa viestikatkelman.
  • Ja rivillä #10 toistamme viestin luokat. Koska en välitä argumentteja tälle kutsulle, se on oletuksena <ul>luettelo.

Tämä johtaa seuraavan tulosteen etusivua päivitettäessä:

WordPress-teeman opetusohjelma aloittelijoille – Osa 5: Viestitietojen käyttö

Olemme tulossa jonnekin! Kehotan sinua tutustumaan kunkin tunnistefunktion dokumentaatioon, jonka parametrit ne hyväksyvät. Voit muokata tulosta melko vähän! Ja päätä itse, mitä mallitunnisteita käytät.

Kokeile napsauttaa viestin linkkiä ja katso, että pääset kyseiselle yksittäiselle viestisivulle. Voit nyt nähdä, että silmukka näyttää vain yhden viestin. Koska meillä on kuitenkin tällä hetkellä vain yksi malli, index.phpyksi näkymä käyttää myös tätä mallia. Joten yksittäisessä näkemyksessä ei ole paljon järkeä. Meidän ei tarvitse linkittää sitä itseensä, vaan haluamme nähdä koko postauksen sisällön! Korjataan tämä luomalla toinen mallimme teemaamme.

Yhden näkymän mallien luominen

Jos muistat aloittelijoille tarkoitetun WordPress-teeman opetusohjelman 1. oppitunnilla, tarkastelimme mallihierarkiaa? Kun olemme yhdellä viestillä tai sivulla, WordPress etsii single.phpviestejä ja page.phpsivuja. Jos jotakin näistä ei löydy, WordPress palaa siihen, singular.phpmikä jaetaan viestityypistä riippumatta. Teemat kuitenkin yleensä toteutetaan single.phpja page.phpjohtuen viestien ja sivujen välisistä eroista. Sivuilla ei ole luokkia ja tunnisteita, ja koska sivuja käytetään yleensä staattiseen sisältöön, niillä ei yleensä näy julkaisupäivämäärää tai kommentteja. Tämä on kuitenkin täysin sinusta kiinni.

Luomme single.phpja page.phpteemme. Aloitetaan ensin viesteistä.

Yhden viestin malli

Tee teemakansiossasi kopio index.phpja nimeä se uudelleen muotoon single.php. single.phpPoistamme pysyvän linkin (joka linkittää itseensä) ja vaihdamme otteen koko viestin sisältöön. Ja lopuksi emme tarvitse arkiston navigointia täällä.

<?php get_header(); ?>
<?php 
if (have_posts()) {
    while (have_posts()): the_post();
        <article <?php post_class(); ?>>
            <h2><php the_title(); ?></h2>
            <?php the_content(); ?>
            <?php the_category(); ?>
        </article>
    endwhile;
} else {
    ?><p>No posts, sorry.</p><?php
}
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Lisätään lisää hyödyllisiä tietoja; kuten julkaisun päivämäärä ja kirjoittajan nimi. Suosittelen jälleen lisäämään HTML-tunnisteita, jotta saat paljon mukavamman HTML-rakenteen.

<?php get_header(); ?>
<?php 
if (have_posts()) {
    while (have_posts()): the_post();
        <article <?php post_class(); ?>>
            <h2><php the_title(); ?></h2>
            <?php the_content(); ?>
            <?php the_category(); ?>
            <p>Posted: <?php the_date(); ?> at <?php the_time(); ?></p>
            <p>Author: <?php the_author(); ?></p>
        </article>
    endwhile;
} else {
    ?><p>No posts, sorry.</p><?php
}
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Toiminnot the_time()ja the_date()toistavat päivämäärän ja kellonajan muodossa, jonka olet määrittänyt hallintapaneelissa > Asetukset. Voit kuitenkin ohittaa tämän antamalla eri päivämäärämuodon parametriksi näille menetelmille.

Toiminto the_author()toistaa tekijän "näyttönimen". Jos käyttäjä ei ole antanut muuta nimeä profiilissaan, tämä toistaa käyttäjänimen.

Suosittelen vahvasti, että et koskaan tulosta käyttäjätunnuksia, koska se voi muodostaa turvallisuusuhan. Varmista aina, että kirjoittajat ovat antaneet oikean nimen, tai älä käytä the_author().

WordPress-teeman opetusohjelma aloittelijoille – Osa 5: Viestitietojen käyttö

Tältä yksi postaus näyttää minusta nyt. Mahtava! Tehdään yksisivuinen malli.

Yhden sivun malli

Tee kopio tiedostostasi single.phpja nimeä se uudelleen muotoon page.php. Tein page.phpvain poistamisen kaiken, mikä ei liittynyt sivuihin. Sivujen luokkien toistaminen ei toimi, ja poistin myös päivämäärän, kellonajan ja tekijän. Tämä on mitä saamme sisään page.php:

<?php get_header(); ?>
<?php 
if (have_posts()) {
    while (have_posts()): the_post();
        <article <?php post_class(); ?>>
            <h2><php the_title(); ?></h2>
            <?php the_content(); ?>
        </article>
    endwhile;
} else {
    ?><p>No posts, sorry.</p><?php
}
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Alamme vihdoin päästä jonnekin malliemme kanssa! En kuitenkaan voi toistaa tätä tarpeeksi; Kehotan sinua muokkaamaan malleja ja parametreja funktioiden mukaisiksi. Varsinkin lisäämällä lisää HTML-kääreitä, jotta sen muotoilu on helpompi myöhemmin.

Seuraavassa vaiheessa siirrymme hieman pois malleista ja siirrymme enemmän WordPress-teemojen taustakoodaukseen.

Dokumentaatio käytetyistä menetelmistä

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja