Van de auteur: Gegroet, vrienden. Ik besloot dit artikel Plugin te noemen voor het bewerken van WordPress-tekst. Zoals u begrijpt, zal dit een plug-in zijn die ons zal helpen tekst op WordPress te bewerken, dat wil zeggen om met de editor in WordPress te werken.
Tijdens het creëren nieuw artikel of WordPress-pagina's biedt ons al een visuele editor die in de meeste gevallen geschikt is. Zo ziet het er standaard uit in WordPress:
Zoals u kunt zien, is de functionaliteit slecht. Zoals hierboven opgemerkt, zijn deze mogelijkheden echter in de meeste gevallen voldoende. Maar zoals je begrijpt, is een persoon altijd niet genoeg, hij wil altijd iets meer. En dat is oké
Hetzelfde geldt voor de redacteur. Er kan eens een moment komen waarop je iets mist en je jezelf afvraagt: hoe kan ik de tekst bewerken? hoe registreer je het?
In deze situatie zal een plug-in die de mogelijkheden uitbreidt u helpen standaard editor en zodat u de tekst naar wens kunt bewerken. Maak kennis met deze plug-in TinyMCE Geavanceerd. Het bevat tientallen verschillende opties voor het bewerken van tekst, letterlijk voor elke smaak en kleur.
Zoals gewoonlijk beginnen we met het zoeken naar een plug-in.
De eerste plug-in die in mijn geval werd gevonden, was die van ons. Laten we het installeren en activeren. Eigenlijk is dit voldoende om de plug-in te laten werken en om geavanceerde tekstbewerkingsmogelijkheden te kunnen gebruiken. Laten we eens kijken nieuwe redacteur.
We hebben nu veel meer pictogrammen op het editorpaneel. Ook boven het paneel met pictogrammen bevindt zich een editormenu, waarvan de items de mogelijkheden ervan groeperen.
Laten we eens kijken naar de plug-in-instellingen. Deze bevinden zich in het menu Instellingen - TinyMCE Geavanceerd.
Het is niet nodig om hier iets in het bijzonder uit te leggen, aangezien de plug-in Russified is en alles duidelijk zou moeten zijn. We kunnen bijvoorbeeld het editormenu in- of uitschakelen, we kunnen nieuwe knoppen toevoegen aan het editorpaneel, enz. Probeer met de instellingen te spelen om de editor naar wens te configureren.
Hiermee wordt dit artikel afgesloten. Zoals u kunt zien, is de plug-in nuttig en kan deze zeker van pas komen, vooral als u veel artikelen op de site schrijft. Als je anderen wilt ontmoeten handige plug-ins, dan raad ik je aan om de lessen van onze cursus voor beginners te bekijken. Dat is alles voor mij, veel succes!
Igor. Update: 27 december 2016.
Hallo, beste lezers van de blogsite! Het is duidelijk dat de functionaliteit van de WordPress-editor (zowel de visuele als de tekstuele delen), die standaard is ingebouwd, niet voldoende is om maximaal comfort zonder afgeleid te worden door eventuele extra lichaamsbewegingen.
Daarom is de post van vandaag gewijd aan WordPress-plug-ins, die de mogelijkheden van deze tool uitbreiden, hebben de ontwikkelaars hier gelukkig voor gezorgd. We zullen eerst praten over TinyMCE Advanced, dat de native visuele editor (het tabblad “Visueel”) zal vervangen, vooral omdat eerdere versies WP het werkt niet altijd correct en geeft fouten.
Ten tweede zullen we kijken naar de instellingen van AddQuicktag, die de ontbrekende set HTML-knoppen in het gedeelte 'Tekst' kunnen aanvullen. Trouwens, voor mij was het deze plug-in die uiteindelijk de doorslag gaf ten gunste van het gebruik van een teksteditor, omdat je met zijn hulp bijna alle taalsymbolen kunt toevoegen hypertext-opmaak(niet alleen tags).
TinyMCE geavanceerde plug-in voor WordPress - Instellingen en gebruik
Dus als, ondanks al het "dansen met tamboerijnen", de visuele editor niet werkt in WordPress, maar je toch besluit om in de toekomst uitsluitend het tabblad "Visueel" te gebruiken, omdat je noch de wens noch de tijd hebt om aan te sleutelen tags, probeer dan de genoemde TinyMCE Advanced .
Het kan worden gedownload van de officiële website, waar ik trouwens aanbeveel alle benodigde plug-ins te gebruiken. Installeer de extensie volgens een bekend schema (je vindt een beschrijving van alle acties met WP-plug-ins).
Dan in de sectie "Instellingen" - "TinyMCE Geavanceerd" je vindt twee blokken (bovenaan staat de huidige set knoppen, die standaard worden geïnstalleerd, en onderaan staat het “reserve”-arsenaal):
Bij het instellen sleept u de gewenste knoppen van onder naar boven. En omgekeerd, als je sommige opties niet nodig hebt, kun je ze gerust hieronder plaatsen. Hier kunt u het menu, dat standaard is ingeschakeld, uitschakelen door eenvoudigweg het vakje uit te schakelen.
Als u het menu actief laat, hoeft u verder niets te configureren ten minste in eerste instantie, omdat de functionaliteit van de ontbrekende knoppen te vinden is in de vervolgkeuzelijsten met menusecties. Op de visuele editorpagina ziet het er als volgt uit:
Als u bijvoorbeeld een stuk tekst moet onderstrepen en de standaardset niet over de vereiste knop beschikt, dan kan dit tekort worden opgevuld door door “Onderstreept” te selecteren in de vervolgkeuzelijst “Formaat”.. Uiteraard moet u eerst selecteren het juiste woord of zin:
Of misschien wilt u een chemische formule in de tekst invoegen. In dit geval selecteert u in dezelfde sectie "Abonnement" en pas het toe op het symbool dat het voorwerp zal zijn van deze actie:
Ook in de standaardset is er geen optie “ Bron" Wij vinden haar binnen sectie "Extra" door op de overeenkomstige regel te klikken:
Waarom is dit eigenlijk nodig? Het punt is dat als je in een visuele editor werkt en naar het HTML-editorgebied van WordPress gaat, en soms is dit nodig. We formatteren bijvoorbeeld de titel van een subsectie van een artikel:
Als je nu van het tabblad “Visueel” naar “Tekst” gaat, ziet het beeld er als volgt uit:
Na gebruik Bronknoppen hetzelfde fragment krijgt, na het overschakelen naar het tabblad Teksteditor, de ontbrekende tags:
Ik hoop dat dit duidelijk is, laten we verder gaan. In principe is het doel van alle opmaakknoppen intuïtief, vooral omdat de TinyMCE Advanced-plug-in zeer goed in het Russisch is vertaald. Wanneer u de cursor naar een knop verplaatst, zowel in de instellingen als in het venster van de geavanceerde editor zelf, verschijnen er tooltips.
Het volstaat te zeggen dat u met TinyMCE Advanced het volgende kunt doen:
Om deze reden heeft het geen zin om alle functionaliteit in detail te analyseren. Ik zal me alleen concentreren op de standaardknoppen die voor beginnende gebruikers problemen kunnen veroorzaken, maar die erg handig kunnen zijn.
Als u de knop "Plakken als tekst" activeert, wordt alle gekopieerde inhoud in zijn pure vorm geplakt. Dit kan van pas komen als u uw schrijven wilt aanvullen met een fragment waaruit u hebt gekopieerd Word document en plak het zonder opmaak:
Druk indien nodig op de overeenkomstige knop "Aangepast teken":
Selecteer in het dialoogvenster dat verschijnt het gewenste symbool dat in het TinyMCE Advanced Editor-venster wordt ingevoegd:
Nog een optie die je met de geavanceerde WordPress-editor kunt gebruiken, is met het vereiste aantal cellen verticaal en horizontaal:
Als u op het vraagteken klikt, krijgt u een lijst met "sneltoetsen" te zien alternatieve optie, waarmee u de tekens kunt weergeven die u nodig hebt.
Aanvullende instellingen TinyMCE Geavanceerd
Deze extensie heeft wat meer opties in de instellingen, die ik standaard heb gelaten. Ik denk dat de overgrote meerderheid ook niets hoeft te veranderen. Maar ik kan ze niet helemaal negeren, want misschien heeft iemand anders het nodig.
Laten we dit aspect daarom een beetje analyseren. Onder de hoofdopties staan dus drie blokken: waarvan de eerste "Opties" is:
In principe is alles hier correct vertaald in het Russisch en intuïtief begrijpelijk. Standaard alleen ingeschakeld Item “Lijst met stijlinstellingen”., wat variatie brengt in het maken van lijsten met opsommingstekens en genummerde lijsten, wat voor iedereen, zonder uitzondering, heel nuttig is.
Ik heb het net geprobeerd activeer het tweede item van boven, maar inheems contextmenu Ik vond Chrome leuker.
Met de optie "Alternatieve linkdialoog" kunt u daar iets toevoegen nofollow-attribuut, maar dit kan ook worden gedaan door de bijbehorende knop toe te voegen, zoals hierboven vermeld. Dus hier beslist iedereen zelf hoeveel handiger het is.
Het laatste punt van dit blok kunt u de bestaande lettergrootte vervangen door een van de hier opgegeven lettergroottes.
De tweede komt Blok "Extra parameters".:
Ook niet helemaal nutteloze instellingen. Bijvoorbeeld, geactiveerde optie "Een menu met CSS-klassen maken" maakt het mogelijk om , die zijn opgenomen in het editor-style.css-bestand, te laden en dienen om elementen op de editorpagina weer te geven.
"Alineatags opslaan". Wanneer u van een teksteditor naar een visuele editor en terug gaat, worden doorgaans de p-paragraaftags en de koppeltekentag gebruikt worden niet opgeslagen. Met deze optie wordt de volledige hypertext-opmaakcode opgeslagen. Maar wanneer u deze functie inschakelt, moet u voorzichtig zijn en eerst de juistheid van de werking ervan testen.
"Invoeging van afbeeldingsbron inschakelen"- Deze optie heb ik niet eens getest, aangezien deze alleen geschikt is voor de kleinste foto's en bovendien niet werkt in mijn favoriet Google Chrome(lees over installatie en instellingen van deze browser).
Nou, het derde blok - "Controle", waar u instellingen kunt importeren en exporteren, verbeteringen voor de editor kunt afvinken (die echter standaard al zijn ingeschakeld) en ook de standaardinstellingen op elk gewenst moment kunt herstellen:
Aan het einde van dit deel van het artikel staat een video van zeer hoge kwaliteit waarmee u het materiaal over dit onderwerp betrouwbaarder kunt leren:
Ontbrekende opmaakknoppen toevoegen aan de WordPress-teksteditor met behulp van AddQuicktag
Het lijkt erop dat ik al meer dan eens heb gezegd dat ik aan het begin van mijn internetactiviteiten bij het maken van blogs op WordPress teleurgesteld was over het tabblad 'Visueel', omdat het gebruik ervan enige ongemakken veroorzaakte die verband hielden met fouten bij het weergeven van de pagina-inhoud.
Daarom na meerdere mislukte pogingen Om de situatie recht te zetten, begon ik onmiddellijk de tekstversie (tabblad Tekst) van de WP-editor onder de knie te krijgen, wat de verwerving van vaardigheden in de praktische ontwikkeling van hypertext-opmaaktaal versnelde (lees wat HTML is).
Echter standaard tekst versie, evenals de visuele versie, weerstaat geen enkele kritiek op functionaliteit, aangezien de set opmaakknoppen erg mager is en duidelijk niet voldoende is voor comfortabel werk bij het schrijven van artikelen. Overigens heb ik de acties van de knoppen die standaard zijn geïnstalleerd al beschreven.
Om deze reden ging ik op zoek naar een geschikte plug-in die de mogelijkheden van de WordPress-editor kon uitbreiden, en die vond ik in AddQuicktag. Ik vond deze extensie meteen leuk omdat ik hiermee alle gewenste tekens kan invoeren, zolang ze maar geldig zijn in relatie tot de webpaginacode.
Na het installeren van AddQuicktag (, en wanneer WordPress-beschrijving TinyMCE Advanced Ik heb een link naar het materiaal verstrekt, dat alle informatie bevat over de installatieprocedure en zo mogelijke acties met plug-ins) ga verder met het instellen:
We voeren de namen van de knoppen op het opmaakpaneel in op een manier die voor u gemakkelijker te identificeren is. U kunt een titel (tooltip) opgeven die na het opslaan van de instellingen verschijnt wanneer u de cursor naar de opmaakbalk in het editorvenster verplaatst (maar dit is niet vereist):
Er is ook een optie “Toegangssleutel”, die niets meer is dan een mogelijkheid om “sneltoetsen” te definiëren. Maar helaas werkt het om de een of andere reden niet, dus heb ik dit veld bijvoorbeeld leeg gelaten.
Hierna bepalen wij serienummer locatie van de knop op het paneel en vul de selectievakjes in, die elk overeenkomen met een specifiek type record. Dat wil zeggen, u kunt opgeven waar opmaakknoppen worden toegevoegd:
- “Visueel” - in de visuele editor van WordPress;
- post - eigenlijk op het tabblad "Tekst" voor het schrijven van artikelen op berichtpagina's;
- pagina - in teksteditor bij het vullen met inhoud statische pagina's;
- bijlage - voor bijlage-webpagina's;
- commentaar - voor het commentaarformulier om het voor gebruikers gemakkelijker te maken hun berichten in te voeren;
- commentaar bewerken - om opmerkingen in het beheerderspaneel te bewerken;
- widgets - voor het vullen van widgets met inhoud.
Maar hier moet je er rekening mee houden dat de knoppen standaard alleen werken voor berichten, statische pagina's en reactieformulieren.
Voor andere gevallen heb je speciale hacks nodig die in het function.php bestand van je WordPress thema geplaatst moeten worden (alles wat daarmee samenhangt vind je in bestandsapparaat en interactie van de engine met sjablonen). In de meeste gevallen is deze functionaliteit echter ruim voldoende.
In principe kun je alle vakjes aanvinken, erger wordt het zeker niet. Om dit in één keer te doen, vinkt u eenvoudig de kolom “✔” aan:
Hier is een voorbeeld van de voltooide instellingen voor, wat misschien wel het meest populair is bij het schrijven van berichten:
Met de AddQuicktag-plug-in kunt u niet alleen tagknoppen toevoegen, maar ook elke shortcode die u vaak gebruikt op de pagina's van uw bron. Bovendien heb je een reële mogelijkheid om de functionaliteit van de teksteditor aan te vullen door een fragment op het paneel te plaatsen platte tekst of coderen.
Voor bijna elk lang bericht gebruik ik bijvoorbeeld een inhoudsopgave voor subsecties, dus ik dacht dat het passend zou zijn om dit stukje code in het opmaakpaneel te plaatsen, zodat het met één klik kan worden ingevoegd:
Wanneer u nu naar een teksteditor gaat en op de knop "div class="ogl"" klikt, verschijnt de sjabloon met de inhoudsopgave in het bewerkingsvenster:
Het enige dat ik hoef te doen is de koppen van de secties van het artikel in te voeren en de nodige links toe te voegen. Ik gebruik onder andere vaak typografische aanhalingstekens bij het schrijven van berichten, dus heb ik deze opmaak toegevoegd aan het HTML-editorpaneel:
De visuele editor is bijgewerkt TinyMCE voor laatste versie. Echter zelfs bijgewerkte redacteur heeft alleen basisfuncties, wat elke min of meer geavanceerde blogger duidelijk mist. Inpluggen TinyMCE Geavanceerd breidt de mogelijkheden van de standaardeditor uit door er ongeveer 15 verschillende plug-ins aan toe te voegen - van het kiezen van lettertypen tot het invoegen van tabellen. Er zijn veel vergelijkbare plug-ins, maar TinyMCE Geavanceerd de meest populaire van hen, dus ik raad je aan om er aandacht aan te besteden.
1 Pak het archief uit.
2 Kopieer de map tinymce-geavanceerd V /wp-content/plugins/.
3 Ga naar het blogbeheerderspaneel op het "tabblad" Plug-ins" en activeer de plug-in.
Plugin-instellingen bevinden zich in " Instellingen\TinyMCE Geavanceerd". Wees niet bang dat de plug-in niet in het Russisch is vertaald - de plug-ins zelf zijn dat wel TinyMCE Bijna alles is in het Russisch vertaald, je hebt dus geen kennis van het Engels nodig. Ja, en de kat huilde hier over de instellingen - sterker nog, je hoeft ze alleen maar met de muis te slepen en neer te zetten noodzakelijke knoppen naar de werkbalk van de visuele editor. Ja, en dit is niet verplicht - bijna alles wordt gedupliceerd in het editormenu:
Overigens kan het menu worden uitgeschakeld door de eerste plug-in-instelling:
De knoppen zelf de Engelse taal, maar het is gemakkelijk te begrijpen wat ze betekenen:
Zoals je kunt zien, is alles in de plug-in-instellingen in het Engels, maar bij het bewerken van een bericht worden alle Engelse inscripties automatisch vertaald naar het Russisch. Zelfs als je iets niet begrijpt, gooi dan een knop op het paneel, sla de instellingen op, schakel over naar het bewerken van het item en kijk wat deze of gene knop betekent.
Het is geen goed idee om elke mogelijke knop aan de werkbalk toe te voegen, omdat je nooit veel knoppen nodig zult hebben. Bovendien is het beter om enkele knoppen te verwijderen van de knoppen die er al zijn. Hoe eenvoudigere editor– hoe handiger en efficiënter het is om te gebruiken.
Onder de nieuwe functies van de editor zou ik graag de invoeging van tabellen willen opmerken:
Een paar klikken en de tafel is klaar. Een heel primitieve tabel, maar voor de meeste bloggers is dit helemaal genoeg.
De knop "Zoeken en vervangen" opent het volgende dialoogvenster:
Eerlijk gezegd begrijp ik niet waarom deze functionaliteit niet standaard beschikbaar is in de editor. Dit is een veel voorkomende trend bij verschillende editors; zelfs de standaardeditor heeft geen zoek- en vervangfunctie. Hoewel ik deze functie persoonlijk heel vaak gebruik in verschillende teksteditors.
Mogelijkheid om lettertype en grootte te selecteren:
Dit is ook een zeer nuttige functie waarmee u de tekst van uw artikel naar eigen wens kunt opmaken zonder de sjabloonstijlen te bewerken.
Voor mij persoonlijk lijkt het heel erg nuttige functie"blokweergave":
Hiermee kunt u visueel evalueren hoe uw tekst is opgemaakt. Dit is belangrijk omdat het in een visuele editor vaak erg moeilijk is om te begrijpen hoe dit of dat stukje tekst is opgemaakt. Of waar komen de extra inspringingen vandaan in een stukje tekst:
In de redacteur WordPress Alinea- en regeleindtags worden automatisch geplaatst en u ziet ze helemaal niet. Alle tekst waarna u op "Enter" drukt, wordt opgenomen in alineatags, die u niet kunt zien, zelfs niet als u naar het tabblad "Tekst" van de visuele editor overschakelt.
Soms veroorzaakt dit editorgedrag volledige verdoving. In deze schermafbeelding kun je bijvoorbeeld zien dat de tekst in de tags is opgenomen
automatisch bleek ook te zijn verpakt in paragraaftags
. Wanneer u een nieuwe sjabloon maakt of stijlen bewerkt, heeft u dat al gedaan bestaande sjabloon het is erg belangrijk.
Trouwens, plug-in TinyMCE Geavanceerd maakt het mogelijk om de echte broncode van uw tekst te zien, zonder uitgesneden tags. Selecteer hiervoor in het menu "Extra" het menu-item "Broncode":
Met deze functie kunt u de daadwerkelijke broncode van uw artikel zien, in plaats van degene die u ziet wanneer u naar het tabblad Tekst overschakelt. Op het tabblad 'Tekst' zou de code er bijvoorbeeld als volgt uit kunnen zien:
En wanneer u de functie "Broncode" gebruikt, ziet u:
Dat wil zeggen dat u uw tekst zult zien met reeds geplaatste alineatags. En dit is precies de code die wordt weergegeven in uw gepubliceerde bericht op de site. Toen ik voor het eerst begon te werken met WordPress, dit gedrag van de redacteur maakte mij vreselijk woedend. Maar de meeste gebruikers zijn hier blij mee: ze hoeven immers niet na te denken over het opmaken van de tekst, de editor doet alles zelf.
De plug-in breidt ook de mogelijkheid uit om standaardlijsten in te voegen. De standaardeditor heeft slechts één type lijst:
Met de plug-in kunt u lijsten invoegen verschillende types:
Een grappige knop waarmee je kunt evalueren hoe een emoticon eruit zal zien in een gepubliceerd bericht, omdat in de visuele editor emoticons nog steeds worden weergegeven in tekstvorm. Vergeet niet naar " Instellingen\Schrijven"en vink de optie aan" Converteer emoticons zoals :-) en :-P naar afbeeldingen".
Eigenlijk zal ik hier de bespreking van de nieuwe functies van de visuele editor afronden. Probeer zelf de overige knoppen en functies.
Nu is het de moeite waard om de instellingen te vermelden die zich onder het paneel bevinden voor het selecteren van ongebruikte knoppen:
Standaard is alleen de optie " Lijst met stijlopties", inclusief geavanceerde opties voor het invoegen van lijsten, waarover ik hierboven schreef. Optie " Contextmenu" schakelt het contextmenu van de plug-in in dat wordt opgeroepen wanneer erop wordt geklikt rechter knop muis in de editor:
Dit is een volkomen nutteloos menu dat bijna volledig bestaat uit een menu voor het invoegen van tabellen. Ik begrijp nog steeds niet waarom dit nodig is: het eigen contextmenu van de browser is gewoon veel nuttiger. De volgende optie betreft het dialoogvenster Koppelingen invoegen. Standaard ziet dit dialoogvenster er als volgt uit:
De plug-in kan dit door dit vervangen:
Dat wil zeggen dat u zich in het plug-in-dialoogvenster alleen kunt registreren voor links, en al het andere bevindt zich in het standaarddialoogvenster voor het toevoegen van links. Of u deze plug-infunctie nodig heeft of niet, beslis zelf.
het laatste deel Plugin-instellingen zijn “geavanceerde” instellingen:
Wat is er gebeurd editor-stijlen.css en waarom is het nodig? In dit bestand worden sjabloonstijlen opgeslagen die in de visuele editor moeten worden toegepast. Ik zal het uitleggen met een voorbeeld, laten we zeggen dat er een vermelding in de editor staat met een citaat:
Wanneer gepubliceerd, ziet dit bericht in de blogsjabloon er als volgt uit:
Laten we een bestand maken editor-stijlen.css in de sjabloonmap met deze code:
add_editor_style("editor-stijl.css");
We vernieuwen de berichtbewerkingspagina en zien:
In de visuele editor kunt u dus hetzelfde type bericht krijgen als in het gepubliceerde formulier. Plug-in optie om bestand te importeren editor-stijlen.css dient om de inhoud van dit bestand te laden, als het in de sjabloon staat functies.php er is geen directe oproep naar dit bestand. Maar als u dit bestand al hebt gemaakt, schrijf dan één regel erin functies.php het zal niet moeilijk voor je zijn.
Alle nieuwste standaardsjablonen in WordPress bevatten ondersteuning voor stijlen voor de visuele editor. Net als sommige premium-sjablonen. Maar in de overgrote meerderheid van de gevallen zijn er geen bestanden editor-stijlen.css niet in sjablonen, deze modieuze en handige functie is nog steeds niet populair bij sjabloonontwikkelaars, maar tevergeefs.
Het meest laatste instelling De plug-in dwingt de editor om alinea- en regeleinde-tags weer te geven op het tabblad "Tekst". Dat wil zeggen, bij het bewerken van een bericht zal alles hetzelfde zijn, maar op het tabblad “Tekst” zie je de volledige html-opmaak en hoef je hiervoor niet langer de functie “Broncode” te gebruiken. De editor zal echter nog steeds raar zijn met zijn automatische opmaak. Hier is bijvoorbeeld de code:
Na het overschakelen naar "Visueel" en terug naar "Tekst" wordt het:
Dat wil zeggen, de editor heeft één regeleinde verwijderd en de overige twee onderbrekingen in alineatags verwerkt. In wezen is het resultaat hetzelfde: 3 inspringingen. Maar het is nog steeds onaangenaam - ik vind het niet leuk als een programma zichzelf als slimmer beschouwt dan de gebruiker. In mijn sjabloon kan ik immers zowel boven als onder inspringingen laten schrijven voor alineatags, en als resultaat zullen er visueel niet langer 3 inspringregels zijn, maar alle 4. Maar ach, ik ben al aan het muggenziften.
Hoe dan ook, met behulp van de plug-in TinyMCE Geavanceerd het maken en bewerken van blogposts is veel handiger. Let er dus op als je nog steeds de in de engine ingebouwde editor gebruikt.
Welkom op de blogsite. In dit artikel vertel ik je hoe je een standaard kunt vervangen en tegelijkertijd repareren visuele redacteur WordPress-berichten . Laten we dus beginnen met het feit dat een standaardteksteditor in wezen niets meer is dan het gewone Word, dat ieder van ons heeft gebruikt, maar alleen in een zeer vereenvoudigde vorm. Veel mensen vinden het gewoon lastig om artikelen te schrijven als er maar een paar knoppen zijn om hun invoer op te maken, en daarom beginnen velen te studeren om te schrijven wat ze willen in de code, maar zelfs hier wacht hen een addertje onder het gras.
Met de HTML-editor kunt u niet alle bekende tags gebruiken, maar alleen de belangrijkste. Trouwens, hier is een lijst met tags die de WordPress-editor begrijpt: adres, a, abbr, acroniem, gebied, artikel, terzijde, b, groot, blockquote, br, caption, cite, class, code, col, del , gegevens, dd, div, dl, dt, em, figuur, figcaption, voettekst, lettertype, h1, h2, h3, h4, h5, h6, kop, hgroup, hr, ik, img, ins, kbd, li, kaart , ol, p, pre, q, s, sectie, klein, span, staking, sterk, sub, samenvatting, sup, tafel, tbody, td, tfoot, th, thead, tr, tt, u, ul, var.
Als u een andere tag probeert in te voeren die niet in deze lijst staat, verwijdert de WordPress-editor deze eenvoudigweg uit het bericht. ook in html-editor PHP- en JavaScript-code kunnen niet worden gebruikt. Als je nog steeds wilt schuiven JavaScript-code worden, dan zul je wel moeten apart bestand plak deze code, upload deze vervolgens naar de blog en schrijf het pad om dit bestand in de html-editor te openen.
Dit alles maakt het moeilijk om veel meer tijd aan werk te besteden dan velen zich kunnen veroorloven. Daarom zijn velen op zoek naar een manier om de standaard visuele editor van WordPres te vervangen die bij hun behoeften en doelen past. Vandaag zullen we het over een van deze hebben.
De editor heet TinyMCE Advanced, wat een verfijnde weergave maakt CKEditor-plug-in. Ik zei dit niet alleen, omdat er maar liefst 15 plug-ins in zaten: Advanced HR, Advanced Image, Advanced Link, Context Menu, Emotions (Smilies), Date and Time, IESpell, Layer, Nonbreaking, Print, Search en vervangen, Stijl, Tabel, Visuele karakters en XHTML-extra's.
Dit is veruit de meest geavanceerde teksteditor die er bestaat. Over het algemeen blijkt dat de plug-in wordt betaald, maar om de een of andere reden wordt deze helemaal gratis verspreid. De ontwikkelaars schrijven dat ze zeggen dat je het gratis kunt gebruiken om kennis te maken, maar voor commerciële sites moet je een licentie aanschaffen.
Hoewel ik denk dat dit iets anders is. De plug-in zelf weegt veel en niet iedereen heeft bepaalde functies, knoppen nodig, waarvan er eenvoudigweg zeeën zijn, dus de plug-in kan voor jezelf worden samengesteld, waardoor alleen overblijft wat nodig is, waardoor de omvang ervan wordt verkleind zonder het werk van de blog te vertragen.
Deze instructie is compleet, maar bevat koppelingen naar materiaal dat nog niet is gepubliceerd. Wees niet ongerust als een van de links niet opent. Alles zal snel werken! 🙂
Met vriendelijke groet, Alexander.
Visuele redacteur- de handigste en snelle weg publicatie van materiaal op de site. Het wordt gebruikt bij het maken van berichten en pagina’s, sommige plug-ins gebruiken het ook in hun instellingen.
We hebben in de notitie kort gekeken naar de mogelijkheden van de visuele en tekstmodi van de editor, en laten we nu wat dieper ingaan op de hoofdknoppen.
Nadat u WordPress hebt geïnstalleerd, ziet de editor er erg slecht en niet-functioneel uit:
Excuseer mij, maar ik zal bewust enkele afbeeldingen in de hoogte bijsnijden om de toch al lange artikelen niet uit te rekken. Als je onderaan de afbeelding een scherpe breuk ziet, betekent dit dat daar niets nuttigs is. In enkele specifieke gevallen zal ik hier aandacht aan besteden.
Zoals u kunt zien, biedt de editor over het algemeen niet zoveel knoppen als we zouden willen. Maar zelfs zij zijn voldoende om effectief aan materialen te werken.
Alles wat u nodig heeft voor basisopmaak vindt u hier:
- Vetgedrukte, cursieve en doorgehaalde tekstselectie
- Lijsten met opsommingstekens en genummerde lijsten
- Tekst markeren als quote met decoratie
- Horizontale scheidslijn
- Lijn tekst links, gecentreerd en rechts uit
- Een link invoegen en verwijderen
- Knop Pagina-einde
- Knop om extra functies te activeren
- Knop om naar volledig scherm te schakelen
Deze knoppen werken in twee modi, laten we beide bekijken.
voorbeeld 1
Het is heel eenvoudig om te begrijpen hoe deze methode werkt: u klikt op het gewenste ontwerp in de werkbalk en begint te typen. De knop wordt visueel ingedrukt en lijkt ingedrukt.
Elke tekst die in deze modus wordt ingevoerd, krijgt automatisch de ontwerpoptie die actief is in de werkbalk.
Kijk eens:
Ik schreef de eerste twee zinnen zonder op de [B]-knop te drukken, schreef ze en drukte op Enter. Er is een nieuwe aangemaakt in de editor lege paragraaf, voordat ik naar binnen ging, klikte ik op de vetgedrukte knop en begon tekst in te voeren.
Alles wat ik invoerde, werd automatisch vetgedrukt. Om het gebruik van deze stijl uit te schakelen, drukt u gewoon op de knop, waarna de volgende symbolen niet langer versierd zijn.
Alle andere ontwerpopties werken op dezelfde manier.
Voorbeeld 2
Er is een andere manier die (naar mijn persoonlijke mening) handiger en sneller is. Het bestaat uit het volgende: eerst schrijf je een vel tekst zonder ontwerp, en daarna ontwerp je je tekst zoals jij dat wilt.
In eerste instantie kon ik gewoon dezelfde tekst schrijven:
Vervolgens moet ik de paragraaf selecteren die ik vet wil maken en op de overeenkomstige knop op de werkbalk klikken:
Hierna wordt onze paragraaf vetgedrukt. Je hoeft hiervoor niet op de knop [B] te drukken; het ontwerp wordt automatisch op alle geselecteerde tekst toegepast.
Voorbeeld 3
WordPress, zoals Microsoft Word, kunt u verschillende acties uitvoeren, niet met de muis, maar met sneltoetsen. Elke actie heeft zijn eigen set knoppen, die, wanneer ze worden ingedrukt, bepaalde stijlen toepassen.
Als we in het tweede voorbeeld van deze instructie bijvoorbeeld niet op de knop [B] op de werkbalk hadden gedrukt, maar de combinatie van “Ctrl” en “B” hadden gebruikt (geschreven als Ctrl+B, staat de knop “B” in Engels, van het woord “Bold”), dan zou de vetgedrukte selectie onmiddellijk op onze paragraaf worden toegepast.
OVER Toetsenbord sneltoetsen Aan het einde van deze instructie vindt u materiaal.
Extra knoppen activeren
Op een gegeven moment zult u zich realiseren dat de huidige mogelijkheden van de editor niet voldoende voor u zijn en dat u tekst onderstreept wilt markeren of kopjes in de tekst wilt plaatsen. Om dit te doen moet u activeren extra paneel hulpmiddelen.
We vinden deze knop:
Er verschijnt een tweede rij knoppen die nieuwe functies aan uw editor toevoegen:
Hier kunnen we al waarnemen toegevoegde opties Om de tekst op te maken, gaan we ze van links naar rechts doornemen:
- Maak kopjes van een van de zes beschikbare niveaus
- Tekst onderstrepen
- Tekst uitlijnen op de breedte van de pagina
- Tekstkleur instellen
- Activering van de modus voor het plakken van tekst vanaf het klembord zonder opmaak
- Wis de opmaak van een geselecteerd stuk tekst
- Speciale tekens invoegen
- Links inspringen in alinea's verwijderen en toevoegen
- Een eerdere actie ongedaan maken of opnieuw uitvoeren
- Hulp bij de redacteur
Zoals u kunt zien, zijn deze mogelijkheden echt voldoende om aan de tekst en het ontwerp ervan te werken.
