Hogyan írhatunk egyedi kódot a WordPress hozzászólásaiba

Számos oka van annak, hogy miért szeretne további kódot írni vagy belefoglalni a WordPress hozzászólásaiba. Lehet, hogy meg kell jelenítenie a hirdetést, alkalmaznia kell egyedi stílusokat a webhely bizonyos részeire, vagy egyszerűen meg kell jelölnie egy szöveget vagy tartalmat, hogy felhívja a figyelmet. Ennek ellenére hozzáadhat kódot a különféle vizuális effektusok eléréséhez, hogy jobb felhasználói élményt biztosítson.


Mindez és mások megalapozott okokból áll, de nem számít, mit akarsz elérni az egyedi kóddal, a kódírás folyamata idegcsomós lehet vagy egyenesen kihívást jelenthet! Ebben az oktatóanyagban a következő területeket tárgyaljuk:

  • Olyan kód hozzáadása, amely úgy néz ki, mint a kód, de nem viselkedik úgy, mint a kód (pl. Arra törekszik, hogy bemutassa a kódsorokat, vagy javítsa webhelye megjelenését)
  • Olyan kód hozzáadása, amely a kódhoz hasonlóan viselkedik, pl. Szkriptzett hirdetések, például a Google Adsense hirdetések

E két kategória alatt kicsit belemerülünk a programozási kódokba, mint például a HTML, CSS, Javascript, és megérintjük a hirdetéseket és a

tartály. Most, további rajongás nélkül, kezdjük el az üzletet és írjunk néhány kódot.

Kód hozzáadása, amely úgy néz ki, mint a kód, de nem viselkedik úgy, mint a kód

Ha szeretné bemutatni a kódot (talán Ön webdesigner vagy fejlesztő), amelyet a felhasználók másolhatnak és beilleszthetnek, akkor fontos, hogy helyesen csinálja, mert még egyetlen sortörés is elronthatja a kódot, azaz az összes munkát. A kódnak a WordPress általi értelmezése attól függ, hogy a HTML vagy a Visual Post szerkesztőt használja-e. Ha közvetlenül beírja a kódot a vizuális szerkesztőbe, akkor nem lesz a kívánt hatása, mivel a vizuális szerkesztő úgy látja, hogy a kód normál szöveg, azaz a webböngészők nem a kódot fogják értelmezni, hanem mint szokásos szöveget..

Másrészről, a HTML Post szerkesztő felismeri az Ön által használt HTML vagy CSS jelöléseket, azaz azokat a webböngésző fogja értelmezni. Ez a helyzet rendetlen elrendezéseket és funky megjelenésű tartalmat eredményezhet. Például, 

a vizuális szerkesztőben szokásos szövegként értelmezik, és az eredmény igazságos
. azonban,
 a HTML-szerkesztőben HTML-jelölésként értelmezik, és az eredmény egy tároló létrehozása.

HTML gyakorlat

Ez valóban a hiábavalóság gyakorlata, de kipróbálhatja, hogy tisztább képet kapjon arról, amire gondolok. Csak nyisd ki HTML szerkesztő, típus

és mentse vázlatként. Miután a vázlatot mentette, kattintson a „Bejegyzés előnézete” elemre, hogy megtekintse mangled webhely. Ne aggódjon, nem állandó, és csak eldobhatja a vázlatot. Most vissza az üzlethez.

Általában kétféle módon használhatja a kódot. Először is felhasználhatja a kódot egy soron (vagy egy bekezdésen belül) egy pont pontosításához a kóddal kapcsolatban. Másodszor, a következőképpen írhatja, kiemelheti és beillesztheti kódját:



Kódírás a WordPress hozzászólások bemutatójában


...

A fenti hatás eléréséhez a következőképpen írt kódot használjuk … A kódunk ide kerül . Helyettesítő nyilak (<  >) Szögletes zárójelben ([]), a WordPress webhelyétől és a használt üzenetszerkesztőtől függően (vizuális vagy HTML). A megjeleníteni kívánt kódnak a nyitó címke között kell lennie,   és a záró tag, . Például kód használatához egy bekezdésben:

Kód egy bekezdésben

A kódcímke a HTML-n kívüli szöveget kódhoz hasonlítja, de nem utasítja a böngészőt, hogy értelmezze a HTML-jelölést, vagy leválasztja azt a bejegyzésből. Ez azt jelenti, hogy a böngésző továbbra is kódolhatja a HTML-jelölést, megnehezítve a bemutatást HTML-címkék a kódodban. Ezt a problémát azonban kibővített karakterek vagy karakter entitások használatával oldhatja meg < > karaktereket, amelyek becsapják az összes böngészőt. Például…

A HTML-címkék HTML jelölésként értelmezhetők

… új tárolót hoz létre (köszönhetően

) és egy címsor (

), amely összezavarja a weboldalt. De ha karakter entitásokat használ a < > nyilakkal, elkerüli ezt a viselkedést, és a kívánt módon adja ki a kódját. A fenti kód tehát így néz ki:

Ehelyett használja a Karakter entitásokat

Hozzon létre egy kiemelt kódblokkot

Ha szeretnék kiemelni a kódblokkot (vagy akár szöveget), hogy valami ilyesmit kapjak;

Kódblokk

Először a kódot (vagy szöveget) tesszük egy ilyen tartályba:

Ezt meg kell tennie a HTML-szerkesztőben

Ezután hozzáadom a stílust a CSS segítségével akár közvetlenül (mint a fenti képen), akár a style.css fájl található a téma fő mappájában.

Stílusosítsa a kódcímkéit

A kódcímke betűméretét használja a és a szöveget alapértelmezés szerint egyszeresen elhelyezett betűkészletbe tegye. Mindezt azonban megváltoztathatja, hogy a kódja csak a kívánt módon néz ki. Csak annyit kell tennie, hogy hozzáadja…

 kódot {font-size: 1.2em; color: # 000; font-weight: normál;} 

… vagy valami hasonlót az önhöz style.css. Korlátlan stílusok vannak, és minden a személyes preferenciáitól függ, tehát ne tartsa vissza a stílusunkat.

Kód hozzáadása, amely úgy viselkedik, mint a kód

Ez a szakasz különösen akkor hasznos, ha hirdetéseket vagy más szkripteket szeretne megjeleníteni, pl. Javascript-kódrészletek a bejegyzésedben. Amíg vannak beépülő modulok, például Gyors Adsense, amelyek segítenek a bejegyzésében szereplő hirdetések kezelésében, érdemes lehet önálló szkriptek telepítése, amelyek felett Ön teljes ellenőrzést gyakorol.

Ha hirdetése egy egyszerű kép és egy link, akkor a feltöltési segédprogram segítségével felveheti a hirdetést az üzenetébe. Csak töltse fel a képet, és írja be a linkjét (és talán egy feliratot), és a munka elkészült. Ez a módszer korlátozott, mivel hirdetését csak balra, jobbra vagy közepére igazíthatja – akárcsak egy tipikus képet. Alternatív megoldásként létrehozhat egy tárolót a bejegyzésében a HTML szerkesztő segítségével.

Példa:


Készítse el ezt a tárolót pontosan azon a helyen, ahol a hirdetését meg akarja tenni, vagyis a hirdetés hozzáadása előtt készen kell állnia a bejegyzésre. Miután a konténer készen áll, stílusosíthatja azt a kívánt módon. A style.css segítségével a pozíció ingatlan. Ha futtatni akarja a Google Adsense hirdetés bejegyzésében továbbra is használhatod Gyors Adsense – a plugin – vagy hozzon létre egy tárolót, és tegye a következő hirdetési kódot:


1. megjegyzés: A Google hirdetései Javascript alapúak, és minden nagyobb böngészőben értelmezhetők, feltéve, hogy a felhasználó engedélyezte a Javascriptet a gépeken.

Jegyzet 2: Ki kell választania a megfelelő hirdetésméreteket a webhelye számára, hogy elkerülje a feladások és a webhely félrevezetését.

Ha hozzá szeretne adni egy állandó hirdetést, amely minden munka (jelenlegi és jövőbeli hozzászólás) között minden további munka nélkül megjelenik, akkor szerkesztenie kell a Egyetlen postai sablon (Single.php). Az összes hozzászólásom tetejére 468xx60x-os hirdetést tettem a következő kód hozzáadásával a single.php azonnal után < – – END post-entry-meta – ->.


Természetesen saját Google hirdetéseit kell használnia. �� A Google Adsense hirdetés így jelenik meg a blogomban:

Kód írása a WordPress-ben

Megtalálni single.php, menj magadra Adminisztrációs panel – >> Megjelenés – >> Szerkesztő – >> single.php. Miután az single.php megnyílt, használja a keresősávot (Ctrl + F) behatárolni < – – END post-entry-meta – ->.

A tartályt úgy hagyhatja el, ahogy van, vagy stílusként használhatja a style.css segítségével, ahogyan azt megfelelőnek tartja. És ne felejtsd el menteni az összes változást. Az

A tároló valóban hasznos, és ha CSS-sel és egy kicsi kreativitással összekapcsolja, annyit érhet el a WordPress webhelyén. Segíthet bármilyen kód (vagy bármi valódi) elhelyezésében bárhol a webhelyén.

Az Eszköztár

Ha többet szeretne megtudni az egyedi kód írásáról a WordPress hozzászólásaiban, kérjük, nézd meg a következő forrásokat:

Nos, erről van szó. Sikerült lefedni azokat a területeket, amelyeket az elején vázoltunk. Ha azonban nem ért semmilyen fogalmat ebben a bejegyzésben, vagy szeretné hozzáadni javaslatait vagy nézeteit, kérjük, ossza meg gondolatait az alábbi megjegyzés szakaszban!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map