Kuidas WordPressis kleepuvat jalust teha – põhjalik juhend

Kleepuvate elementide loomiseks WordPressis on palju meetodeid. Enamik hõlmab kohandatud CSS-i segamist või keeruliste kolmandate osapoolte lehekoostajate või tervete veebisaitide koostajate kasutamist.

Ja enamik neist võtab tasu, märkides need täiustatud funktsioonid esmaklassilisteks lisandmooduliteks.

See, et miski tundub keeruline, ei tähenda, et see nii peabki olema.



Kuidas WordPressis kleepuvat jalust teha

Kaks pistikprogrammi, mis lisavad WP-le kleepuva jaluse riba, on fikseeritud alumine menüü ja WPFronti teavitusriba. Töö tegemiseks saate kasutada ka kohandatud CSS-i. Premium-teemadel võib olla elementide konksud, mida saab kasutada kleepuva jaluse loomiseks. Lõpmatust kerimisest mööda pääsemiseks paigutage jaluse vidina sisu külgribale.

Kuidas luua WordPressi jaoks kleepuvat mobiili alumist menüüd

Rakendage KISS-i põhimõtet. Hoidke see lihtne, loll.

Installige ja aktiveerige Fixed Bottom Menu pistikprogramm

Lõppude lõpuks, mis on fikseeritud jalus? See on fikseeritud alumine menüü.

Alustage Fixed Bottom Menu pistikprogrammiga.

See pistikprogramm võimaldab teil lisada lehtede allossa kolm kuni viis linki. See on maksimum, mida tuleks väikese ekraaniga seadmete puhul nagunii kasutada.

Kõik muud muudaks navigeerimise keeruliseks.

Pärast aktiveerimist lisatakse fikseeritud alumine menüü silt teie seadete menüüsse vasakpoolsel külgribal.

Alumise menüü konfigureerimiseks seadete lehele minemiseks klõpsake menüüüksust.

Kuna see on mõeldud väiksemate ekraanide jaoks, vajate ikoone. On paar võimalust.

Võite minna üle ikooni lisavale pistikprogrammile või klõpsata linke, et avada tasuta allikad. Google Fonts ja Font Awesome on lingitud. Kõik Google'i fondid on tasuta ja avatud lähtekoodiga.

Teise võimalusena pidage kinni Dashiconidest, mis on juba WordPressi jaoks kodeeritud.

Kui olete lingid määranud, kerige allapoole ja vähendage ekraani maksimaalset laiust 760 piksliteni. Võite minna väiksemaks.

Selle ekraani suuruse reguleerimise põhjuseks on see, et fikseeritud menüü kuvatakse ainult mobiiltelefonides ja tahvelarvutites.

Lauaarvutitel (eeldusel, et teie teemal on külgribad) on nähtavad navigeerimislingid. Jaluse riba ekraanile kinnitamise eeliseks on püsivate navigeerimisnuppude lubamine.


Kleepuva jaluse teavitusriba loomine

Kui soovite kinnitada ainult kleepuva ujuvriba lehtede allserva, et kuvada reklaamsõnumeid või juhtida liiklust oma nurgakivi sisule (näidetena), on teavitusriba lihtsaim viis.

Kasutage WPFronti teavitusriba pistikprogrammi

Selle pistikprogrammi kasutatav osa on positsiooni fikseerimine.

Ujuva jaluse riba lubamiseks valige suvand kinnitada riba alumisse asendisse.

  1. Klõpsake luba
  2. Muutke positsiooni 'ülemisest' 'alt' asendisse.
  3. Märkige ruut, et lubada „asendis fikseeritud”, mis fikseerib selle ekraani allservas.
  4. Kuva seadmetes: valige „väikesed seadmed”, kui soovite, et riba kuvataks ainult telefonides ja tahvelarvutites. Selle kõigi seadmete jaoks lubamisel kuvatakse kleepuv jalus ka töölaual.
  5. Sisestage oma sõnum tekstialale, mida soovite jaluseribal kuvada.

Näiteks,

Manager Special: 25% allahindlus käsitsi valitud toodetele. Vaata pakkumisi.

Teksti „Kuva pakkumised” saab paigutada nupule, mis lingib teie saidi müügilehele või pakkumiste kategooriale.

Kuidas kinnitada WP jalus CSS-i abil WordPressi lehtede allserva

Enamikul WordPressi teemadel on jaluse teksti kuvamiseks juba jaluse menüüd või vidinaalad.

Nende jaoks saate lisada oma teemakohandajale CSS-i ploki, et fikseerida jalus iga lehe allserva.

Kood selle tegemiseks on:

.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: black;
color: white;
text-align: center;
}

Värve, suurust ja teksti joondamist saab igaüks vastavalt oma eelistustele muuta.

Kuidas luua mobiili jaoks kleepuvat ujuvat riba WooCommerce'i integratsiooniga

Selleks on vaja, et teie WordPressi teema oleks WordPressi konksude kasutamiseks kodeeritud.

Enamik teemasid, mis pakuvad raamistikku mitme lapseteema valikuga, on tavaliselt need, millel on rohkem konksu.

Ükskõik, millist teemat kasutate, vaadake teema dokumentatsiooni, et leida nende veebisaidil 'visuaalsete konksude juhend' või midagi sarnast.

WordPressi konks, mida teie teema peab toetama, on „jalus pärast” või „jalus pärast”.

Soovite, et teema oleks kodeeritud nii, et element käivituks pärast jaluse laadimist, kuid enne HTML-i lõppu.

Mõned teemad seda funktsiooni ei toeta.

  • Genesise raamistik teeb seda, mis pole üllatav, kuna neil on raamistikus üle 50 konksu.
  • Astra teemal on ka funktsioon 'astra_footer_after'.
  • Divi teema seda ei toeta.
  • Kadence'i teema teeb seda, kuid ainult Pro versioonis.

Kontrollige esmalt oma teemat, sest see kehtib ainult konksude jaoks juba kodeeritud teemade kohta.

Raske on teada, kuhu erinevate WordPressi teemade konksud registreerida, nii et kui teil pole elementide konkse toetavat teemat, proovige seda, mis toetab.

Ikoonidega kohandatud URL-ide seadistus on sama, mida kasutaksite Fixed Bottom Menu pistikprogrammi puhul.

  • Sisestage 3-veeruline paigutus
  • Lisage iga veeru jaoks ikoon
  • Linkige ikoonid lehtedega, millele soovite neid suunata.

Kui teie teema toetab konkse, on koodilõik, mida saate mobiili kleepuva jaluse lisamiseks kasutada…

add_action( '[insert_theme-name]_after_footer', '[insert_theme-name]_sticky_mobile_bottom_bar', 20 );
function [insert_theme-name]_sticky_mobile_bottom_bar() {
echo do_shortcode( "[reblex id='####']" );
}

Kui ülalolevas koodis on 'sisesta teema nimi', asendage see oma teema jaluse koodilõiguga.

Kadence'i teema puhul oleks see kadence_after-footer, Astra teema puhul on see astra_after-footer ja Genesise raamistiku jaoks on kood genesis_after_footer.

Kuidas luua WP-teemale kleepuvat jalust, kasutades lõpmatut kerimist

Lõpmatut kerimist kasutavate teemade puhul ei laadita jalust kunagi enne, kui laaditavat sisu pole enam.

Lahenduseks on kasutada Twitteri lähenemisviisi, milleks on jaluse vidina teisaldamine külgribale.

Kui soovite jaluses sisu teisaldada, et see oleks teie külgriba viimane vidin, ja muutes selle 'kleepuvaks', tagab selle nähtavuse.

Kasutage WordPressi Q2W3 fikseeritud vidinat

See võimaldab teil kõike külgribale teisaldada ja nähtavana hoida.

Avage pistikprogrammid > Lisa uus > Otsi WordPressi Q2W3 fikseeritud vidinat.

Installi ja aktiveerib Thomas Maier, Max Bond.

Pärast installimist kuvatakse vidinate jaotisesse minnes uus märkeruut, mille saate valida 'parandatud vidina' loomiseks.

Iga vidinat saab parandada. Siiski parandage mis tahes jaotises ainult viimane vidin, et vältida vidinate kattumist.

Valitud arvu lehekülgede kaasamiseks kasutage lehtede vidinat ja seejärel lehe ID-de välistamise funktsiooni, et piirata kuvatavate lehtede arvu ainult oluliste lehtedega.

Pidage meeles, et selleks ajaks, kui külastajad teie jaluseni jõuavad, on viimane võimalus näidata neile midagi, mida nad tõenäoliselt vajavad. Lisage jalusesse asjakohane teave.

… Lingid teie kontaktide lehele, lahtiolekuajad, KKK leht, kontaktteave jne.

Jaluse menüü külgribale paigutamise lahendus tagab, et see on viimane vidin, mida näidatakse, ja see jääb fikseeritud asendis nähtavaks.

Kohaliku ettevõtte veebisaidi puhul on jalus ka jaotis, mis sisaldab teie ettevõtte NAP-i andmeid SEO jaoks. See on teie ettevõtte nimi, aadress ja telefoninumber.

Kui soovite, et teie linke kuvataks pigem kõrvuti, mitte linkide loendina, kasutage vidinat „Kohandatud HTML” ja seejärel looge lingid käsitsi HTML-i abil, et muuta lingid klõpsatavateks. Siin klõpsatav tekst.