Szinte az összes blogger, alkotója tartalom vagy a technológiafejlesztőknek néha kiemelt kódrészleteket kell megjeleníteniük a blogjukon. Ez már önmagában is fejfájást okozhat. Szükséges lehet azonban egy vagy több sor kiemelése ebben a részletben, és ez a funkció sajnos nem része a legtöbb kódintegrációnak. Szerencsére létezik a SyntaxHighlighter Evolved bővítmény. Megmutatjuk, hogyan kell használni, hogy a kód a lehető legtisztább és olvashatóbb legyen.
A SyntaxHighlighter kifejlesztett
A beépülő modul telepítése és aktiválása egyszerű. Megtalálható a WP.org plugins lerakaton de ügyelj arra, hogy jól csinálja Alex Mills (Viper007Bond), mert valóban sok eredmény van. Tudjuk azonban, hogy ez megbízható és naprakész. Sőt, ez egy speciális blokk a Gutenberg szerkesztő számára. Nem is beszélve számos olyan paraméterről, amelyek lehetővé teszik a tapasztalatok személyre szabását, ami választásunkra teszi ezt a típusú feladatot.
A menüben Paraméterek a WordPress irányítópultján talál egy új elemet, az úgynevezett SyntaxHighlighter . Menj előre, és kattints rá. Itt beállíthat minden apróságot, amire szüksége lesz a kódrészletek beágyazásához a WordPress webhelyére.
A SyntaxHighlighter beállításai
A beépülő modul beállítási oldala viszonylag egyszerű. Az egyik különleges elem, amit szeretünk ebben a beépülő modulban, hogy számos testreszabási lehetőséget kap a kód webhelyén való megjelenítésére vonatkozóan. Hozzáadhat CSS osztályokat a beágyazáshoz, módosíthatja a sorszám kitöltését, választhat témák színeket, használjon intelligens tabulátorokat és sortöréseket, és döntse el, hogy az egyes webhelyszintű kódolási nyelvek kiemelése hogyan töltődik be.
Három olyan paramétert akarunk meghatározni, amelyeket a legtöbb embernek tudnia kell.
Beépülő verzió, sorszámok és fülméretek
Az első a beépülő modul melyik verzióját tölti be. Bár a beépülő modul naprakész marad az adattárban, választhat a beépülő modul 2.x és 3.x verziói közül , attól függően, hogy hogyan szeretné megjeleníteni a kódot. Mindkettő biztonságos, azonban mindegyik olyan sajátosságokat kínál, amelyeket a másik nem (az írás idején).
Ha a felhasználók a kódodat másolják a legfontosabb, akkor a 3.x verzió is megfelel. Ha azonban a tiéd hasznosabb a megjelenítéshez, mint a tényleges segédprogram, akkor a 2.x változat új vonala jobb lehet az Ön számára, mivel így nincs szükség görgetősávok használatára. nagy kódrészletekhez.
Ezután meg kell mutatnia a sorszámokat, vagy sem. Nagy kóddarabok és oktatóanyagok esetén a sorszámok felbecsülhetetlenek. Ha azonban rövid kivonatok vannak, nem szükséges őket véglegesen az 1. és a 2. sornak címkézni. Eltávolításuk jelentősen javíthatja a kód megjelenését.
És akkor ott van a fül mérete még mindig ellentmondásos. Az alapértelmezett opció 4, de tetszőleges számra módosíthatja. Beleértve a helyes 2 értéket. (Igen, rájövünk, hogy nincs helyes érték. Csak 2 szóközt szeretünk a fülekhez.)
Az Ön kódja és rövid kódjai
Ha az oldal aljára görget Paraméterek , nagy kódelőnézetet, valamint számos rövidkódparamétert fog látni. Idője jól telne azzal, hogy végigmegy rajtuk, csak azért, hogy lássa, mit tehet az összes beépülő modul a kivonatok bemutatásához. Ezenkívül a fenti beállításokban a fenti kódkijelzőn végrehajtott bármilyen változtatás itt is megjelenik. Tehát mindenképpen nyomja meg a Mentés gombot, miután megváltoztatta bármelyik lehetőséget.
Bár egyesek nem biztos, hogy a rövid kódok legnagyobb rajongói, mert bizonyos pluginekhez kapcsolhatnak, úgy gondoljuk, hogy ezeket érdemes használni, mert okosak és könnyen megjegyezhetők. Ha mást nem, akkor két dologra kell emlékeznie, és akkor a plugin a legjobbat nyújtja az Ön számára.
ou ou ou et...bien, vous obtenez</li><li>[highlight 5-9]</li></ul>
Vagy néhány változatot. Ha emlékszik, magabiztos abban, hogy különféle dologgal tehet ezt a bővítményt. Noha hosszú azonosítót használhat, a SyntaxHighlighter plugin elég jól felépített, hogy egyszerűsítse a munkáját.
Használjon rövid kódokat
Bárhol, ahol le tud készíteni egy rövid kódot, használhatja őket. Ban ben Divi vagy a klasszikus szerkesztőt, használhatja a Szöveg modult vagy a TinyMCE szerkesztőt, és egyszerűen illessze be a kódot a rövid kódok közé. A Vizuális lap működése miatt javasoljuk a lap használatát szövegek hogy megőrizze ezeket a formázási speciális karaktereket.
Ha Gutenberg / Block Editor felhasználó vagy, a dolgok ilyen egyszerűek. Ehhez ismét használhatja a szövegblokkot. Még egyszerűbb, az egyedi HTML blokk. A fenti módon illessze be a kódot a rövid kód címkékbe.
Még jobb, ha maga a SyntaxHighlighter Evolved blokk. A beépülő modul saját Gutenberg-blokkját tartalmazza; szóval, ha nem vagy rövid kód, és nem akarsz elrontani a beállításokkal, akkor nem kell. Csak keresse meg a blokkot formázás és illessze be az üzenetbe vagy az oldalba.
Nem számít, hogyan illeszti be a kódot, ugyanazt a megjelenítést fogja látni a WordPress-webhely előlapján.
Összefoglalva
Számos okból lehet, hogy részleteket kell bemutatnia a közönség számára. Esetleg oktatóanyagokat ír vagy megoldásokat tesz közzé olyan gyakori problémákra, amelyeket a közönség tetszése szerint vehet és használhat? De néha a GitHub integráció egyszerűen nem nyújt olyan élményt, amilyet a felhasználók számára szeretne. Ekkor van szükség egy olyan pluginra, mint a SyntaxHighlighter Evolved.
Néhány kattintással, kis testreszabással és Gutenberg blokkkal vagy rövid kóddal, a közönség probléma nélkül feltárja a kódját.