Skip to content

CTA-painikkeen luominen ja lisääminen DIVI-mallin valikkoon | Tyylikäs teema

16 de heinäkuu de 2021
variedad plantillas

Kuten kaikki tietävät, Divi on malli, jota käytetään WordPress-alustalla, ja sen avulla voit tehdä kaiken mitä voit kuvitella ja mitä et. Koska voidaan sanoa, että niiden malleilla ei ole rajoituksia. Ja näyttääksesi hieman enemmän, kaiken mitä voit tehdä tällä mallilla. Olemme tuoneet sinulle seuraavan artikkelin, joka selittää kuinka luoda ja lisätä CTA-painike DIVI-mallin, Elegant Themes, valikkoon.

Tästä mallista on tullut käyttäjien eniten käytetty tällä hetkellä, koska se on helppo käsitellä ja että sinun ei pitäisi aloittaa alusta. Kuten tekisit muiden mallipohjien kanssa verkkosivustoja. Ei myöskään tarvitse muuntaa HTML-muotoon, ja tässä näet esimerkin, joka myös merkitsee huomattavaa ajansäästöä.

Ensisijaisena tarkoituksena on näyttää näiden työkalujen oikea toiminta. Kanssa Divi Olemme opettaneet, kuinka muotoilla yhteyslomake 7.

CTA-painikkeen luominen ja lisääminen DIVI-mallin valikkoon

Ennen kuin aloitamme, meidän on sanottava, että lisäämällä a CTA-painike tai toimintakehotus päävalikossa osoittautuu erittäin tärkeäksi ja yksinkertaiseksi. Aivan kuten linkin lisääminen puhelimeen, ja tämä tekee siitä erityisen painikkeen, jolla on erityisominaisuuksia. Ja tämän pitäisi herättää huomiota eri tavalla kuin muut painikkeet, jotka löydät päävalikosta.

Tätä painiketta voi käyttää moniin toimintoihin, kuten levyn kommentoimiseen, tuotteen myyntiin, tietojen pyytämiseen jne. Kun tämä kohta on selvitetty, menemme verkkosivustollemme ja sitten sijoitamme itsemme vasemmanpuoleiseen valikkoon. Siellä aiomme tehdä leikkeen Ulkoasu-välilehdessä ja sitten Valikoissa.

Tämä toiminta vie meidät Valikko-ikkuna ja haluamme uuden painikkeen näkyvän valikkorakenteessa. Sitten menemme Mukautetut linkit -vaihtoehtoon ja kirjoitamme linkin tyypin, joka voi olla Varaukset. Ja URL-osoitteeseen laitamme numeromerkin (#) ja lopuksi teemme leikkeen Lisää valikkoon -vaihtoehtoon.

Seuraava tehtävä on siirtyä ikkunan oikeaan yläkulmaan ja valita Näytön asetukset -välilehti. Kun teet tämän, jotkin vaihtoehdot näytetään ja valikon Näytä lisäominaisuudet -osiossa. Meidän on vahvistettava, että vaihtoehto on valittu CSS-luokatJos se ei ole, valitsemme sen.

Kun tämä on tehty, siirrymme Tallenna-valikkoon ja teemme leikkeen, sitten siirrymme luotuun painikkeeseen, joka tässä tapauksessa on Varaukset. Ja aiomme tehdä leikkeen oikealla olevaan nuoleen, kun teet tämän, useita vaihtoehtoja ilmestyy ja siirrymme valinnaisiin CSS-luokkiin. Ja aiomme kirjoittaa seuraavan cta-valikon ja viimeistellä teemme leikkeen Tallenna-valikko.

Koodin syöttäminen CTA-painikkeen luomiseksi ja lisääminen valikkoon

Kun tämä on tehty, aiomme palata vasempaan sivupaneeliin ja aiomme tehdä leikkeen Divi-välilehdessä ja sitten Teema-asetukset. Tämä vie meidät ikkunaan ja vieritämme alaspäin, kunnes löydämme mukautetun CSS-vaihtoehdon. Siihen on liitettävä seuraava koodi:

.cta-menu – {

reunus: 2px kiinteä #fff;

täyte: 10px! tärkeä;

reunan säde: 25 kuvapistettä;

tausta: # ffcd02;

väri: #fff! tärkeä;

}

.cta-menu a: vie hiiri {

reunus: 2px solid # ffcd02;

tausta: # ef5555;

väri: # 000! tärkeä;

opasiteetti: 1! tärkeä;

}

Tämä koodi tulee lisää muodon painikkeeseen, kuten väri, sisäinen erottelu, reunus jne. ensimmäisessä koodissa se näyttää painikkeen ulkonäön ja toinen koodi näyttää siltä kuin se tulee, kun vietämme hiiren sen päälle. Tämän jälkeen emme siirry ikkunan loppuun ja aiomme tehdä leikkeen Tallenna muutokset -vaihtoehdossa.

valikkomallit divi

Nyt meidän tarvitsee vain mennä verkkosivustollemme ja päivittää sivu, jotta voimme nähdä luodun painikkeen. Ja tällä didaktisella ja yksinkertaisella tavalla olemme saaneet aikaan vielä yhden opetusohjelman, joka auttaa sinua luoda ja lisätä CTA-painike DIVI-mallin valikkoon.