Elementor on WordPressin tehokas sivunrakentaja, jonka avulla voit luoda houkuttelevia verkkosivuja ilman koodaustaitoja. Yksi Elementorin hyödyllisimmistä elementeistä on kuvakeluettelo. Tämän ominaisuuden avulla voit esittää tietoa visuaalisesti houkuttelevalla tavalla, olipa kyse sitten tehtävälistoista, sosiaalisen median linkeistä tai muusta sisällöstä. Tässä oppaassa näytän sinulle askel askeleelta, miten luot ja muokkaat houkuttelevan kuvakeluettelon.
Tärkeimmät havainnot
- Kuvakeluettelon avulla voit helposti lisätä visuaalisia elementtejä.
- Jokaista merkintää voidaan mukauttaa tekstillä, kuvakkeilla ja linkeillä.
- Luettelon tyyliä ja ulkoasua voidaan mukauttaa joustavasti.
Vaiheittaiset ohjeet
Vaihe 1: Avaa Elementor ja lisää kuvakeluettelo
Avaa ensin Elementor-editori verkkosivustolla, jota työstät. Etsi Elementorin widget-alueelta "Icon list" -vaihtoehto. Vedä tämä widget haluamaasi kohtaan sivullasi.
Vaihe 2: Muokkaa kuvakeluettelon elementtejä
Kun widget on sijoitettu, näet oletusarvoisesti joitakin luettelon elementtejä. Voit muuttaa kuvakkeiden ja tekstirivien määrää käyttämällä vasemmanpuoleisessa valikossa olevia vastaavia vaihtoehtoja. Muokkaa tekstiä napsauttamalla "Luetteloelementti 1". Tähän voit kirjoittaa esimerkiksi "YouTube".
Vaihe 3: Valitse kuvakkeet
Voit valita sopivan kuvakkeen kullekin luettelokohteelle napsauttamalla kuvakealuetta. Avautuu ikkuna, jossa voit valita laajasta kirjastosta. Etsi "YouTube" ja lisää haluamasi kuvake.
Vaihe 4: Lisää linkkejä
Voit myös määrittää linkin kullekin luettelokohteelle. Napsauta tätä varten tekstin vieressä olevaa "Linkki"-kenttää ja lisää vastaava URL-osoite, esimerkiksi linkki YouTube-kanavaasi.
Vaihe 5: Mukauta ulkoasua
Voit nyt määrittää asetteluvaihtoehtoja. Valitse "Inline" tai "Full width". Päätä, miten haluat visualisoida kuvakeluettelon, jotta se sopii verkkosivustosi yleiseen tyyliin.
Vaihe 6: Mukauta tyyliä
Siirry tyyli-välilehdelle muuttaaksesi kuvakeluettelon ulkoasua. Täällä voit määrittää yksittäisten rivien välit, säätää linjausta ja aktivoida mahdolliset erottimet. Voit esimerkiksi valita erottimeksi katkoviivan, joka antaa tyylikkään ulkoasun.
Vaihe 7: Säädä värejä
Voit muuttaa kuvakkeiden ja tekstin värejä. Valitse esimerkiksi vihreä väri, kun siirrät hiiren elementin päälle. Tämä luo vuorovaikutteisen varjoefektin, jonka kävijäsi huomaavat.
Vaihe 8: Aseta fonttikoot ja typografia
Varmista, että fonttikoko vastaa kuvakkeita visuaalisesti, säätämällä tekstin kokoa "Teksti"-välilehdellä. Aseta koko esimerkiksi 25:een ja valitse sopiva fontin väri, jotta saavutetaan harmoninen visuaalinen vaikutus.
Vaihe 9: Esikatsele ja tallenna
Kun olet tyytyväinen kuvakeluetteloosi, ota muutokset käyttöön napsauttamalla "Tallenna". Huomaa esikatselu nähdäksesi, miltä lista näyttää frontendissä.
Vaihe 10: Testaa toiminnallisuus
Testaa linkit julkaistulla sivulla varmistaaksesi, että kaikki toimii halutulla tavalla. Tarkista myös, että hover-efektit näkyvät oikein vuorovaikutteisuuden varmistamiseksi.
Yhteenveto
Tässä oppaassa olet oppinut, miten voit luoda houkuttelevan ja toimivan kuvakeluettelon askel askeleelta Elementor for WordPressin avulla. Sinun tarvitsee tehdä vain muutamia yksinkertaisia säätöjä, jotta voit mukauttaa luettelon omaan tyyliisi ja optimoida käyttökokemuksen.
Usein kysytyt kysymykset
Miten lisään uuden luettelokohteen kuvakeluetteloon? Voit yksinkertaisesti napsauttaa "+"-kuvaketta kuvakeluettelon widgetissä lisätäksesi uuden kohteen.
Voinko muuttaa kuvakkeita lisäämisen jälkeen?Kyllä, voit muokata mitä tahansa kuvaketta milloin tahansa napsauttamalla vastaavaa luettelokohdetta.
Miten voin muuttaa kuvakkeiden värejä? Voit muuttaa kuvakkeiden ja tekstin värejä Elementor-editorin tyyliosiossa.
Voinko lisätä linkkejä sosiaaliseen mediaan?Kyllä, voit lisätä linkin kuhunkin luettelokohteeseen, mikä on ihanteellista sosiaalista mediaa varten.
Onko Elementorissa esikatselutoiminto?Kyllä, näet esikatselun muutoksistasi ennen niiden tallentamista.
