Hei, kjære lesere av bloggsiden. Jeg bestemte meg for å vie dagens publikasjon til spørsmålet om å skrive artikler i WordPress HTML-editor ().

Faktum er at noen ganger er det ikke mulig å bruke den visuelle editoren i administrasjonspanelet (oftest skyldes dette hostingproblemer), og uten det vil det være ganske vanskelig for nybegynnere bloggere å skrive riktige og vakkert utformede artikler, fordi en enkel editor som fungerer for alle uten unntak krever minst .

Da jeg først begynte å skrive denne bloggen og bli kjent med motoren, kunne jeg bare ikke bruke den visuelle editoren. Verken ekstra plugins med deres forskjellige versjoner, eller andre "danser med en tamburin" hjalp. Derfor måtte jeg med vilje mestre den eksisterende grunnleggende editoren, heldigvis, da var jeg allerede ganske kjent med hypertekst-markeringsspråket.

Bruker kun HTML-editoren i WordPress

Men poenget var ikke engang i HTML, men i bekvemmeligheten av å utføre daglige og ofte forekommende handlinger. Ja, standard WordPress-redigeringsprogrammet lar deg bruke én knapp til å legge til fet (STRONG tag) og kursiv (EM) tagger, sette inn lenker, sitater, bilder, nummererte og punktlister, markere forskjellige koder og .

Men dette var ikke nok for meg, fordi... I teksten til artiklene brukte jeg aktivt interne overskrifter på ulike nivåer (fra H2 til H5), fremhevet koden (PHP, CSS, etc.) med spesielle tagger og gjorde mye mer.

Så alt som ikke var inkludert i standardsettet med verktøy til den grunnleggende WordPress-editoren måtte legges inn manuelt fra tastaturet, og dette gjorde slett ikke arbeidet med å lage innlegg enklere og var veldig irriterende.

Men dette problemet ble vellykket løst takket være den fantastiske WP-plugin Post Editor Buttons, som du kan legge til så mange ekstra knapper du vil på HTML-redigeringsverktøylinjen, og programmere dem for spesifikke handlinger.

I dag skal vi se på å skrive innlegg i WP i detalj fra start til slutt, uten å utelate nyansene og teknikkene som, etter min mening, hjalp bloggsiden (du leser den nå, med mindre, selvfølgelig, denne artikkelen ble stjålet og ikke lagt ut på et annet nettsted) nå nivået til flere tusen unike besøkende.

Det vil si at denne publikasjonen vil være et detaljert vedlegg til artikkelen (dette er ikke originaltittelen, men tatt fra en retweet fra en av leserne, men etter min mening er det enda mer vellykket enn det opprinnelige navnet mitt).

I den artikkelen skisserte jeg nyansene som etter min mening påvirket tilstrømningen av trafikk (besøkende) fra søkemotorer, og i dette innlegget vil jeg prøve å fordype meg i detaljene, som ofte er svært viktige og ikke åpenbare ved første øyekast .

I tillegg tror jeg at en nybegynner blogger eller de som bare tenker på å lage og drive sitt eget prosjekt ikke vil være uinteressant å lære om hvor enkelt alt er i WordPress hvis du vet hva og hvor du skal gjøre for å få ønsket resultat. Vel, ok, introduksjonen har blitt forsinket, det er på tide å gå direkte til presentasjonen av materialet.

For de som ennå ikke har sin egen WP-blogg, men har et ønske om å bli blogger, eller for de som ønsker å flytte fra en annen bloggmotor eller gratis plattform til WordPress, vil jeg gi lenker til materialer om installasjonen og den første konfigurasjonen. :

La oss begynne å skrive en artikkel i WordPress HTML-editor

Så for å skrive en ny artikkel, må du gå til adminpanelet (http://sait.ru/wp-admin/) og velge fra venstremenyen (hvis du bruker standard WP adminpaneldesign) " Legg til nytt" element i "Innlegg"-området "

Som et resultat vil en standardside for å legge til en artikkel (innlegg) åpnes, som vil ha et felt for å skrive inn tittelen og et stort felt for å legge inn teksten til innlegget.

Det er ingen triks når du skriver inn titteltekst i feltet beregnet for dette, men det som er veldig viktig er ikke hvordan du skriver den inn, men det faktum at du må bruke nøkkelord i den. Hvor godt du velger en tittel for innlegget ditt (), jo høyere vil innlegget ditt stige i søkeresultater for visse søk.

Men samtidig må tittelen på en artikkel i WordPress samsvare godt med teksten (være relevant for teksten i innlegget). I tillegg vil den vises i søkeresultater, og den fremtidige skjebnen til publikasjonen din vil avhenge av hvor attraktiv den er (hvis de ikke klikker på den, vil atferdsfaktorer forverres og den vil forlate toppen).

Vanligvis formulerer jeg den endelige versjonen av tittelen etter å ha skrevet selve artikkelen. Noen ganger kopierer jeg alle de mellomliggende underoverskriftene til en egen tekstfil, og holder dem alle foran øynene mine, danner jeg en generell, og prøver å ta hensyn til alt som ble nevnt i den.

Det er nok derfor titlene mine er veldig lange, men som praksis viser er det ikke noe galt med det. Søkemotorer gjør en utmerket jobb med titlene mine, og søkeresultatene viser den delen av TITTELEN der ordene fra søket vises.

Hvorfor er tittelen så viktig for å promotere en side i søkemotorer? Ja, for for dem er det hovedkriteriet for å bestemme relevansen (graden av samsvar – og andre komplekse ord) til artikkelen din for et bestemt søk.

Selv om nei, ikke helt sånn. Ikke tittelen på innlegget, men sidetittelen TITLE er det viktigste kriteriet for søkemotorer når de skal bestemme plasseringen for et bestemt søk (se i detalj).

Hva har tittelen på et innlegg i WP å gjøre med det da? Og til tross for at riktig TITTEL skal dannes ut fra tittelen på artikkelen pluss tittelen på hele bloggen, og i den rekkefølgen. Forresten, du kan konfigurere riktig formasjon av TITLE i WordPress. Pluginen er rett og slett fantastisk, og lar deg samtidig løse mange problemer angående intern optimalisering.

Jeg vil gjerne gjøre deg oppmerksom på forskjellen mellom den logiske HTML-taggen «STRONG» og en annen fet uthevings-tag «B», samt mellom «EM» og «I». Den første av disse taggene (STRONG og EM) bør brukes ikke bare for å tiltrekke lesernes oppmerksomhet til viktige punkter i teksten.

Søkemotorer vil ta hensyn til ord og uttrykk som er fremhevet med disse uthevingstaggene (STRONG og EM) med større vekt, sammenlignet med vanlige, ikke-uthevede ord i teksten. Men nå må du være veldig forsiktig med dette for ikke å gå for langt og ikke.

Velge den optimale strukturen av overskrifter på nivåene H1-H6

Nå som for H1-H6 overskriftstaggene, som også kan brukes i bloggartikler for å legge vekt på de nødvendige ordene og setningene.

Disse interne underoverskriftene, akkurat som TITLE, bør inneholde søkeordene og frasene som du ønsker å rangere i søkemotorene. Søket vil ta hensyn til dem med større vekt enn vanlige. Men igjen, under ingen omstendigheter bør du spam nøkler, fordi du kan lide for dette under moderne kampanjeforhold.

I tillegg gir interne underoverskrifter (vanligvis fra nivå H2, H3 og utover) en ekstra mulighet for å strukturere teksten, noe som forbedrer deres oppfatning av leserne.
Men det er et annet problem med optimalisering på siden som har å gjøre med overskriftsnivåene (H1 til H6) som brukes på WordPress-bloggsider.

Den viktigste måten å distribuere overskriftsnivåer på en nettside på er at tittelen på hele artikkelen skal være innesluttet i en H1-tag (det høyeste nivået) og den skal være en på siden, og alle interne underoverskrifter i teksten skal begynne med H2.

Forresten, jeg vil anbefale deg en veldig praktisk måte som lar deg tydelig se i WordPress hvor og på hvilket nivå overskrifter brukes på et bestemt nettsted. Dette er en plugin for FireFox() kalt .

Så hvis du velger fra menyen til denne plugin-en (menyen er lagt til øverst i nettleseren) elementene "Outlines" - "Header Outlines", vil alle de som finnes på nettsiden som for øyeblikket er åpne i nettleseren, bli omringet med flerfargede rektangler, ved siden av som det vil være en bildetekst er nivået deres H1 -H6.

Som det fremgår av figuren ovenfor setter jeg nivået for tittelen på artikkelen ikke til H1, men til H2, mens H1 brukes til å vedlegge en beskrivelse av hele prosjektet, dvs. ikke til noen spesifikk artikkel, men til hele bloggen.

Denne Maul, i en av artiklene sine, nevnte at H1-nivåoverskriften på nettstedet skulle være den samme for alle nettsider, men han rettferdiggjorde virkelig ikke ideen sin på noen måte. Men jeg bruker akkurat hans opplegg. For interne underoverskrifter bruker jeg H3 og H4 (noen ganger H5) tagger.

En nyanse til. På hovedsiden er titlene på innleggene mine lenker som fører til nettsider med fullversjoner, men på selve disse sidene med fulltekstene til innleggene slutter titlene på artiklene å være lenker. Jeg leste et sted at det ville vært bedre på denne måten.

Nå må vi fortsatt snakke litt om hvordan du kan endre nivået på HTML-titteltagger i WordPress, for eksempel for artikler, eller legge til, som jeg gjorde, ett felles H1-nivå for alle.

For å gjøre dette må du koble til vertsserveren som bloggen din ligger på, for eksempel via FTP. Alle filene vi måtte trenge ligger i mappen med WordPress-temaet (malen) du bruker, som du finner i denne banen:

/wp-content/themes/Temanavn/

For å få en klarere forståelse av strukturen og formålet med WordPress-temafiler (maler), anbefaler jeg deg å lese artikkelen gitt helt i begynnelsen av denne publikasjonen (i listen).

La oss se hvor du kan endre nivået på hovedtitlene til artikler som ligger på hovedsiden (INDEX-filen er ansvarlig for utseendet) og på sider med fullversjoner av artikler (ENKEL fil).

La oss først åpne INDEX for redigering. I den er titlene på WordPress-artikler omsluttet av HTML-taggen H2 (andre nivå), og i tillegg er de lenker, fordi de er omsluttet av lenketaggen A:

tråder)

Denne teknikken lar deg unngå unødvendige parenteser. Dessuten passer slik kode godt inn i HTML-konteksten.

14. Prosedyremessige og objektorienterte tilnærminger

Objektorientert programmering vil hjelpe deg med å holde deg til en mer eller mindre klar struktur, men det betyr ikke at du bør avvike fra prosedyreprinsippene for å skrive søknader.

Objekter er flotte for å representere data. Eksempel:

Klassebruker ( public $username; public $first_name; public $last_name; public $email; public function __construct() ( // ... ) public function create() ( // ... ) public function save() ( / / ... ) offentlig funksjon delete() ( // ... ) )

Prosedyremetoder har sine egne spesifikke fordeler.

Funksjon capitalize($string) ( $ret = strtoupper($string); $ret .= strtolower(substr($string,1)); return $ret; )

15. Les åpen kildekode

Vanligvis er Open Source-prosjekter skrevet av et stort antall utviklere. Fra dette synspunktet kan det å studere den skrevne koden i lignende prosjekter hjelpe deg med å få erfaring. Så ikke kast bort tiden din på dette.

16. Refaktorering

Refaktorering er å endre kode uten å miste funksjonalitet. Den kan også brukes til å forbedre lesbarheten. Det er ikke rom for å fikse feil eller legge til funksjonalitet. Du endrer bare strukturen på koden din litt.

Jeg håper du fant denne artikkelen nyttig! Har jeg gått glipp av noe? Del opplevelsen din!

WordPress.com tillater ikke at du bruker potensielt farlig kode på bloggen din, men du kan publisere kildekoden for visning. Vi opprettet en tag som bevarer kildekodeformatering og til og med gir syntaksutheving for enkelte språk. Eksempel:

#button ( font-weight: bold; border: 2px solid #fff; )

For å få et resultat som ligner på kodebiten ovenfor, pakk koden inn i disse taggene:

Din kode

"Language"-parameteren definerer språk- og syntaksuthevingsreglene. Følgende verdier støttes:

• actionscript3
• Kald fusjon
• csharp
• delphi
• erlang
• fskarp
• groovy
• javascript
• javafx
• matlab
• kraftskall
• python
• scala

Hvis verdien av "språk"-parameteren ikke er spesifisert, brukes verdien av "tekst" (uten syntaksutheving).
Koden mellom "code"-taggene blir automatisk kodet for visning, så du trenger ikke å bekymre deg for HTML-elementer eller noe sånt.

Konfigurasjonsalternativer

Tagger støtter også mange konfigurasjonsalternativer som du kan bruke til å tilpasse utseendet. Bruken av dem er helt valgfri.

• autolinks (true/false) - Hver URL i koden vises som en hyperkobling. Standardverdi: sann.
• skjul (true/false) - Hvis satt til true, vil kodeområdet skjules når siden lastes inn. For å utvide den, må du klikke på den. Dette er nyttig for store stykker kode. Standardinnstillingen er falsk.
• førstelinje (nummer) — Bestemmer ved hvilket nummer linjenummerering begynner. Standardverdi: 1.
• gutter (true/false) - Hvis satt til usant, vil linjenummer skjules. Standardverdi: sann.
• highlight (kommaseparerte tall) - Linjenummer som skal utheves, for eksempel "4,7,19".
• hmtlscript (true/false) - Hvis satt til true, uthever HTML/XML-kode. Dette er nyttig når du publiserer blandet kode, for eksempel PHP i HTML. Fungerer bare med noen språk. Standardverdi: usann.
• lys (true/false) - Hvis satt til true, vil linjenumrene og verktøylinjen være skjult. Dette er nyttig når du legger ut en kodebit på én eller to linjer. Standardverdi: usann.
• padlinenumbers (true/false/heltall) - Lar deg kontrollere utfyllingen av linjenumre med nuller. Verdien true setter autofullføring, verdien false deaktiverer fullføring, tall angir et fast antall tegn for linjenumre.
• verktøylinje (true/false) - Hvis satt til usant, vil ikke en verktøylinje med knapper vises når du holder musepekeren over koden. Standardverdi: sann.
• wraplines (true/false) - Hvis satt til usant, vil linjebryting bli deaktivert. Hvis det er lange linjer, vil en horisontal rullelinje vises.
• tittel (streng) – tittel for koden. Kan være nyttig i kombinasjon med kollaps-alternativet.

Eksempler på bruk av parameterne ovenfor:

Denne linjen er ikke uthevet. Denne linjen er uthevet. Denne linjen er uthevet. Denne linjen er ikke uthevet. Dette er et kort kodestykke med nullpolstrede linjenumre på opptil 4 tegn. //I dette eksemplet er linjebryting deaktivert. For å lese hele teksten, må du bruke rullefeltet. I dette eksemplet er i tillegg linjenummerering deaktivert og verktøylinjen er skjult.

Og dette er et større kodefragment. Her velges PHP-språket og linjenummer 12 er uthevet.

WordPress.com-kodeeksempel WordPress.com-kodeeksempel Denne linjen er uthevet. Veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig, veldig lang kø. Dette er et eksempel på smarte faner. WordPress.com

Anerkjennelser
For å implementere denne funksjonen brukes SyntaxHighlighter-prosjektet (forfatter Alex Gorbatchev). Brukere kan stille inn passende