Sisällysluettelo
Sisällön järjestäminen sarakkeisiin on lastenleikkiä WordPress Columns -lohkon ansiosta. Tämä lohko kuuluu ydinlohkoihin, joita saatetaan käyttää jokaisessa WP-teemassa. Columns-lohkossa voi olla enintään 6 saraketta. Sinulla voi siis olla 6 erilaista sisältöä vierekkäin. Tänään me...
Tänään näytämme sinulle, miten tehdä sarakkeita WordPress ilman plugin - käyttämällä sarakkeet lohko. Tuomme sinulle myös yhteenvedon uusimmat ominaisuudet WP 5.3 versiosta päivitys.
Tässä opetusohjelmassa löydät tietoa seuraavista asioista:
- Mikä on sarakkeiden tarkoitus
- Kuinka sarakkeet toimivat vanhassa editorissa
- Kuinka tehdä sarakkeita WordPressissä ilman pluginia (lohkoeditorissa)
- Sarakkeiden peruslohkon asetukset
- Miten työskennellä WordPress Columns lohko
- Sisäkkäisten lohkojen muokkaaminen
- Sarakkeiden lohkon edut
Mikä on sarakkeiden tarkoitus
Verkkosivuston sarakkeilla voi olla useita sovelluksia. Ensinnäkin ne voivat tehdä sisällöstä hyvin järjestettyä, luettavampaa ja helpommin selattavaa. Järjestämällä sisältöä sarakkeisiin voit korostaa tärkeitä tietoja tai parametreja.
Voit esimerkiksi käyttää monisarakkeista asettelua palvelujesi esittelyyn. Lisää sinne havainnollistava kuva, kuvaus tai painike. Voit tietenkin tehdä kuvasta klikattavan.
Samoin kuin palveluissa, voit käyttää WordPressissä sarakkeita tuotteiden tai tuoteryhmien näyttämiseen. Se on ihanteellinen, jos sinulla on yksinkertainen yrityssivusto.
Blogikirjoituksissa voit käyttää sarakkeita sisällön erottamiseen. Voit sijoittaa tekstiä, luetelmakohtia tai kuvia vierekkäin.
Kuinka sarakkeet toimivat vanhassa editorissa
Jos halusit tehdä monisarakkeista sisältöä, sinun oli ennen WordPress 5+:a käytettävä taulukoita. Se oli paljon vaikeampaa kuin uusimmassa editorissa. Lisäksi tyyleissä ja taulukoiden näyttämisessä mobiililaitteissa oli yleensä ongelmia. Miten se toimi ennen?
Sinulla on ollut useita vaihtoehtoja, miten luoda sarakkeita WordPress verkkosivuilla:
1. Lisää HTML-koodi manuaalisesti tekstieditoriin
<table> <tr> <td></td> <td></td> </tr> </table>
Tätä lähestymistapaa käyttivät pääasiassa kehittäjät, jotka pystyivät nopeasti luomaan taulukon tai sarakkeen vaatimustensa perusteella. Haittapuolena oli, että kaikki WordPress-teemat eivät pystyneet käsittelemään sarakkeita hyvin. Taulukot eivät yleensä olleet täydellisiä, eikä keskivertokäyttäjä voinut helposti ratkaista kaikkia mahdollisia ongelmia.
2. Taulukoiden salliminen WordPress-editorissa
Koska WordPress käytti TinyMCE-editoria, oli mahdollista sallia toimintojen muokkaaminen taulukoissa. Jos olet kiinnostunut oppimaan lisää, löydät kaikki yksityiskohdat tällä foorumilla. Jos teet saman AIT-teemoillemme, taulukot toimivat oikein.
3. Columns elementin käyttäminen AIT-teemoissa
Jos käytät jotakin vanhemmista WordPress-teemoistamme, tunnet varmasti Columns -elementtimme. Tätä elementtiä voidaan käyttää sarakkeiden lisäämiseen sivujen sisälle. Se on tilattavissa oleva elementti, eli voit sijoittaa sen minne haluat. Etuna on sen muunneltavuus sivujen sisällä.
4. Lataa kolmannen osapuolen lisäosa taulukoiden hallintaan
Toinen ratkaisu sarakkeiden tekemiseen WordPress-viesteihin ja -sivuihin oli ladata yksi saatavilla olevista liitännäisistä taulukoiden luomiseen. Nämä laajennukset mahdollistavat sarakkeiden/taulukoiden lisäämisen muutamalla klikkauksella ilman koodausta. Myös vähemmän kokeneet käyttäjät pystyivät käyttämään tätä.
Kuinka tehdä sarakkeita WordPressissä ilman pluginia (lohkoeditorissa)
Uuden lohkoeditorin ansiosta sarakkeiden luomisesta tuli erittäin helppoa. Jos käytät vielä vanhaa WordPressiä, nyt on oikea aika päivittää uusimpaan versioon. Pystyt lisäämään ja hallitsemaan sarakkeita yksinkertaisesti, muutamalla napsautuksella Columns-lohkon avulla.
Tämä lohko on tervetullut muutos kaikille, jotka haluavat työskennellä monisarakkeisen sisällön kanssa, esitellä tuotteita tai kirjoittaa blogia eikä heillä ole kokemusta ohjelmoinnista.
Katsotaanpa, miten lisätä sarakkeet lohko ja miten luoda sarakkeita WordPress ilman plugin:
- Ensimmäinen vaihtoehto on napsauttaa yläpalkin "+" -painiketta ja valita Columns-lohko käytettävissä olevista lohkoista.
- Toinen vaihtoehto on klikata "+" missä tahansa editorin sisällä.
WordPress Columns -lohkon ennalta määritellyt asettelut (UUSI WP 5.3:sta)
Uusin versio toi valtavia parannuksia sarakkeiden asetuksiin. Ensinnäkin käytettävissä on oletusasettelutyylejä. Mitä se tarkoittaa?
Käyttäjät voivat valita ulkoasun ja tasaustyylin lisätessään uuden lohkon sisältöalueelle. Ennalta määritellyt asettelut voivat olla erittäin hyödyllisiä - erityisesti niille käyttäjille, joilla ei ole kehittyneitä WordPress-taitoja. Tämä ominaisuus edustaa sitä, miten kuvittelemme tavan tehdä sarakkeita WordPressissä (ilman lisäosaa tai muuta lisäosaa).
Jos et halua valita WordPress Columns -lohkossa esiasennettua asettelua, ohita se. Tämän vaiheen ohittamisen jälkeen sisältö erotetaan kahteen samaan osaan/ kahteen yksittäiseen sarakkeeseen, joita voidaan muokata.
Sarakkeet Lohkon perusasetukset
WordPress Columns -lohkossa itsessään ei ole paljon vaihtoehtoja. Miksi näin on, selitämme myöhemmin. Yläpalkissa voit vaihtaa kohdistuksen leveäksi tai täysleveäksi. Voit vaihtaa tämän linjauksen, jos aktiivinen teemasi tukee sitä.
Tärkein Columns-lohkon asetus on oikealla puolella olevan tarkastajan sivupalkin sarakkeiden määrä. Oletusarvoisesti sarakkeita on 2, mutta voit lisätä määrän 6:een. Voit muuttaa sitä hiirellä tai syöttämällä numeron. Näet heti, miltä se näyttää, kun olet lisännyt tai vähentänyt sarakkeita. Lohko muuttuu dynaamisesti liukusäätimestä riippuen.
Se on erittäin käytännöllinen, koska voit muuttaa sarakkeiden lukumäärää kirjaimellisesti sekunneissa ilman vaikeita muutoksia asetuksiin tai koodaukseen.
Samoin kuin muut lohkot WordPress-editorissa, voit lisätä Custom CSS Class myös Columns-lohkoon.
Lohko-sovitin lohkojen kanssa työskentelyn sujuvoittamiseksi
Columns-lohko on erityinen, koska sillä voi luoda useita lohkoja. Ennen kuin uusi versio julkaistiin, oli melko vaikeaa työskennellä yksittäisten lohkojen kanssa. Kun halusit lisätä jonkin lohkon, et tiennyt tarkalleen, mistä kohtaa klikata. Lohkojen lisäyksen (ja sen erottamisen taustavärin mukaan) ansiosta on helpompi lisätä sisältöä oikeaan sarakkeeseen.
Kuinka työskennellä WordPress Columns Blockin kanssa
Columns-lohkon kauneus on se, että jokainen sarake voi sijoittaa muita lohkoja. Se voi olla Kappale, Kuvan lohko tai painikkeen lohko. Sarakkeiden enimmäismäärä on 6, joten voit luoda monisarakkeista sisältöä tarpeen mukaan. Kuten aiemmin mainittiin, tuotteiden esittelemiseksi voit lisätä tuotteen kuvan, nimen, hinnan ja painikkeen vierekkäin.
Voit myös käyttää useita pylväslohkoja toistensa alla luodaksesi ruudukon. Voit käyttää sitä palvelujesi esittelyyn tai tärkeiden ominaisuuksien edistämiseen.
Sisäkkäisten lohkojen muokkaaminen
Kuten jo mainitsimme, voit sijoittaa muita lohkoja sarakkeiden sisään. Jokaisella sisäkkäisellä lohkolla on kaikki sen asetukset käytettävissä. Tämä tarkoittaa, että jos lisäät Image-lohkon sarakkeeseen, voit muokata sitä täsmälleen samalla tavalla kuin itsenäisessä sarakkeessa. Kuvalohko.
Johtopäätökset: Pylväiden lohkon edut
WordPressin lohkoeditorin vapauttaminen ja sarakkeiden käyttömahdollisuus sivuilla ja viesteissä yksinkertaistivat merkittävästi käyttäjien tapaa käsitellä sisältöä. WordPress Columns -lohkon ansiosta ei ole enää tärkeää käyttää kolmannen osapuolen ratkaisuja tai kirjoittaa HTML-koodia. Sarakkeiden lisääminen tai poistaminen on mahdollista muutamalla klikkauksella. Kaikki on hyvin intuitiivista ja nopeaa myös vähemmän teknisesti taitaville käyttäjille.
Sisältösi monisarakkeisessa asettelussa on kauniisti linjassa ruudukkoon. Se näyttää hyvältä myös responsiivisessa versiossa heti.
Työskentelimme kovasti uuden Citadela WordPress-teeman parissa, joka on kehitetty erityisesti WordPress-lohkoeditorille. Lue lisää Citadela-teemasta ja saatavilla olevista layout-paketeista.
Miten voin muuttaa sarakkeiden leveyttä?
Hei David,
Kiitos, että kirjoitit. Sinun pitäisi aktivoida Gutenberg-editori, joka tarjoaa mahdollisuuden valita yksittäisen sarakkeen, asetusten sivupalkissa (oikealla puolella) voit säätää sen leveyttä.
Terveisin!
Zlatko
AIT-tiimi