4 parimat viisi teksti ahendamiseks WordPressis

Kui näete, kui lihtne on WordPressis teksti ahendada, saate vähem muretseda oma saidi loetavust mõjutavate sisutükkidega segamise pärast.

Kokkupandavat sisu saab lisada lülitiga või luues akordionimenüüd. Mõned WP teemad on varustatud kohandatud lühikoodidega, et sisestada akordionimenüüd kõikjal teie saidil.

Kui teie teema ei toeta kokkupandavat sisu, saate selle lisada käsitsi pistikprogrammide abil või teemafaile redigeerides.



See töötab isegi tasuta WordPress.com-i plaanidega, ilma igasuguse stiilita.

Kuidas WordPressis teksti ahendada

Kasutage WordPressis teksti ahendamiseks pistikprogramme „Accordion” või lühikoodide pistikprogramme koos funktsiooniga „akordion” või „lülitus”. WordPress.com-i tasuta paketid võivad muuta sisu kokkupandavaks, lisades tekstiredaktorisse

HTML-i. Isehostitud saitidel saab teemasid kodeerida, et kasutada jQuery kasutajaliidese akordioni laadimiseks WordPressi konkse.

Erinevus lüliti ja akordioni vahel WordPressis

Akordioni ja lülitusfunktsioonid on kaks meetodit, mis aitavad WordPressis teksti ahendada.

Vahe lüliti ja akordioni teksti vahel on see…

  • Akordionielemendiga laaditakse ühe jaotise klõpsamisel ainult see osa sisust. Kui klõpsate järgmisel akordionielemendil, sulgub eelmine tekstiosa automaatselt.
  • Lülitusfunktsiooniga saab laadida kõiki kokkupandavaid sisualasid ja need jäävad avatuks. Lülituselementidega kuvatavad sisukastid ei sulgu automaatselt.

Pikkadel lehtedel eelistatakse akordionielementi, kuna see ei lase ekraanidel täituda küsimustega, mille kohta kasutajal pole huvi lugeda.

Nad saavad kerida KKK-lehel olevaid pealkirju ja kui nad leiavad küsimuse, millele nad tahavad vastust saada, saavad nad klõpsata, et vaadata ainult seda konkreetset sisujaotist.

Mõelge sellele nii…

Kui soovite teada saada 'kui palju tarne maksab?', mida eelistaksite...

a) Üksikud tiitliribad konkreetsete küsimustega pealkirjasiltides?

Või

b) Kerida läbi 80 küsimust ja vastust, kuni leidsid soovitud küsimuse?

Akordionielemendid muudavad teie sisu hõlpsamaks.

4 viisi WordPressis teksti ahendamiseks

1. Kasutage Gutenbergi redaktoris akordioniplokki

Neile, kes kasutavad uut 'ploki' või Gutenbergi redaktorit isehostitud WordPressi veebisaidil, saab lisada akordioni pluginaid oma plokiredaktori külgribalt.

See on sama protsess nagu vana meetod pistikprogrammide lisamiseks teie saidi funktsionaalsuse laiendamiseks. Lihtsalt mugavam, kuna te ei pea enam uue pistikprogrammi lisamiseks minema pistikprogrammide menüüsse.

Laadige oma plokiredaktor, klõpsake uue ploki lisamiseks ikooni +, seejärel otsige sõna „akordion”.

Akordioniplokke pole eelinstallitud. Peate lisama akordioniploki pistikprogrammi.

Meie testimiseks lisati pistikprogrammina ' Akordion ' autor 'WPDeveloper'.

WordPressi versioonis 5.6 lisati võimalus lisada pluginaid WP-ploki redigeerija armatuurlaualt.

Kui kasutate WordPressi vanemat versiooni, peate lisama pistikprogrammi tavapärasel viisil.

Teise võimalusena värskendage oma WordPressi versioon uusimale saadaolevale versioonile.

Uute plokkide kasutamise eeliseks akordioni stiilis sisu jaoks on see, et selle lubamiseks vajalikud JavaScripti päringud käitatakse ainult siis, kui plokk on laaditud.

Varem võis piltide peitmine akordionimenüüsse aidata saidi kiirust suurendada. Nüüd on WordPressil vaikimisi lubatud 'laisk laadimine'. Siiski muudab see esitluse paremaks.

Piltide lisamiseks laiendatud sisujaotistesse klõpsake kolmel vertikaalsel punktil, valige 'Muuda HTML-ina' ja lisage pildi lähtekood, kasutades järgmist HTML-stringi

<img src="http://yoursite.com/wp-content/uploads/2021/09/your-image-title.jpg" alt="give it an alternative title" width="###" height="###">

Pildi URL kuvatakse teie meediumiteegis.

2. Lisage akordioni sektsioon ainult HTML-iga (nõutav tasuta WordPress.com-i pakettide puhul)

Tasuta WordPress.com-i plaanidel on puue.

JavaScripti päringuid ei saa käivitada ja teie ei saa installida WordPressi pistikprogramme kas. Saate ikkagi teksti redigeerijas ahendada.

Avage oma leht või postitus redigeerimisrežiimis ja kasutage tekstiredaktorit. Mitte visuaalne redaktor.

Lisatav kood on

<details>
<summary>Question 1</summary>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</details>

(korrake nii mitu korda kui vaja)

Selle pluss on see, et saate selle lisada ilma täiendavate pistikprogrammideta ja see töötab ka tasuta WordPress.com-i kontodel.

Kuna tegemist on lihtsa HTML-iga, on tulemuseks lihttekst.

Stiilielementide kaasamiseks akordioni või lülituselementidesse kasutage oma teemamalli pistikprogrammi või kõvakoodi.

Pluginad on lihtsamad, nii et kui olete koodi redigeerimisega nõrk, kasutage pistikprogrammi. Pluginal Ultimate Shortcodes on mitu ikooni.

Hirmutava huvi korral jätkake lugemist, et saada juhised oma teema kõvakodeerimiseks, et laadida kohandatud jQuery kasutajaliidese akordion.

3. Kasutage WordPressi klassikalises redaktoris teksti ahendamiseks pistikprogramme

Miljonid WP kasutajad töötavad endiselt klassikalise redaktoriga. Kui teete, vajate ühilduvat pistikprogrammi.

Üks lihtsamaid pistikprogramme, mida kasutada, on…

PickPluginsi akordion

See pistikprogramm haakub teeki Font Awesome. Lisage ikooni HTML-kood iga üksuse jaoks jaotises Font Awesome, et vaikenooled alistada.

Pärast installimist lisatakse teie administraatori külgribale uus menüü. Klõpsake nuppu 'Lisa uus', et luua nii palju akordionimenüüd, kui vajate.

Ahendatud teksti saab kuvada kõikjal teie saidil, mis aktsepteerib HTML-i.

See võib olla postituste, lehtede ja vidinate aladel, kasutades HTML-vidinat. Lisage vidin, pange sellele pealkiri, sisestage lühikood ja kuvatakse akordionimenüü.

Sisu laius reguleeritakse automaatselt, nii et erinevate ekraanide kuvasuuruste fikseerimiseks pole vaja CSS-iga segada.

Akordionimenüüs saate kasutada HTML-i ja lisada pilte.

Pigem kui ainult eemaldage WordPressis hiljutised postitused , saate minna kaugemale, kasutades seda akordioni pistikprogrammi, et luua täisstiilis vidin, mis kuvab teie kõige populaarsema sisu, põhjalikud juhendid, parimad arvustused ja ostujuhised otse ühes akordionividinas.

Teisisõnu, see võimaldab teil paremini kasutada vidina kinnisvara WordPressi veebisaitidel.

… Vältides samal ajal külgriba vidinate ala segamist.

4. Lisage WordPressi teemadele jQuery UI Accordion

See protsess on mõnevõrra keeruline, kuna WordPress ei luba JavaScripti päisefailis käivitada.

Selle asemel on JS-skriptid WordPressi installimisel vaikimisi juba registreeritud. Kõik, mida pead tegema, on neisse 'haakida'.

Kui te ei tööta välja oma kohandatud teemat või pistikprogrammi, ei pea te õppima, kuidas WordPressis WordPressi konksude abil teksti ahendada.

Siiski ei tee paha teada, kuidas seda tehakse, sest siis saate teha parandusi, kui miski lakkab töötamast. Nagu pärast a WordPressi värskendus .

WP teemade arendajad kasutavad WordPress Codexi konkse, et haakuda paljude eelkomplekteeritud teekide külge.

Funktsioon „jQuery UI Accordion” on see, mida käivitatakse WP-s kokkupandava teksti tegemiseks.

Skriptid ja failid WordPressi teksti ahendamiseks

Esiteks looge JavaScripti fail.

Kasutage lihttekstiredaktorit (nt Notepad) ja kleepige järgmine

//jQuery-ui-accordion
jQuery(document).ready(function($) {
$( "#accordion" ).accordion({
collapsible: true, active: false, heightStyle: "content"
});
});

Salvestage fail nimega 'accordion.js'.

Mida see kood teeb…

Koodi viimane rida on muuta kõik elemendid kokkupandavaks.

'Aktiivse' oleku määramine valeks tähendab, et kasutaja peab sisujaotise laadimiseks klõpsama. Kui määrate selle väärtuseks 'tõene', laaditakse teie akordioni sektsiooni esimene üksus eellaadimiseks.

'HeightStyle'i viimane osa: 'sisu' tähendab, et maksimaalset kõrgust pole määratud. Seadistamisel „sisu” laaditakse kogu div elemendi sisu, ilma et oleks vaja alla- või üle kerida.

Ülaltoodud koodis tähistab #akordion 'div ID' ja .akordion 'div klassi'. Nende lisamisega, kui asetate

<div ID="accordion"> and <div class="accordion">

… teie tekstiredaktoris käivitatakse jQuery.

  • [ # ] on identifikaator
  • [ . ] on klass

Kuidas lisada WP teemadele kohandatud JavaScripti faile

Avage oma cPanel, avage teema, millel soovite skripti käitada, ja otsige üles kaust nimega 'JS'. Siia saab panna kõik JavaScripti failid.

Mõnel teemal on kaust teemafailide juurtes Failitee: WP sisu > Teemad > Teie teema > JS.

Teised võivad kasutada teemakaustas alamkausta, näiteks kausta 'varad'. See järgiks faili teed: WP sisu > Teemad > Teie teema > Varad > JS.

Kõikide JavaScripti failide kaust on JS. Kui teie teemal seda pole, looge see.

Avage oma teema JS-kaust, klõpsake „faili üleslaadimine” ja sisestage fail „accordion.js”.

JavaScripti laadimiseks muutke faili functions.php

Selle osa eesmärk on käskida WordPressil JavaScripti faili laadida. Enamikul teistel platvormidel tehakse seda päisefailis. Kuna WordPress töötab PHP-s, ei saa JavaScripti laadida, kasutades faili header.php märgendit