WordPress-plugin for redigering av sider. Installere TinyMCE Advanced-plugin for WordPress

I denne artikkelen vil vi snakke om en interessant visuell sideredigerer for WordPress. Plugg inn Sidebygger Sandwich er designet for forenklet sideredigering. Pluginen ble testet på et stort antall WordPress-maler fra forskjellige kilder og viste gode resultater.

Page Builder Sandwich lar deg gjøre endringer i utformingen av nettsider i farten. Tillegget kan lastes ned fra det offisielle WordPress-depotet. I skrivende stund er plugin-modulen lastet ned av mer enn 3000 brukere. Dette tillegget er rangert med 4,4 av 5.

La oss se nærmere på pluginens muligheter.

Visuell sideredigerer Page Builder Sandwich

Fordelene med plugin inkluderer forenklet tilføyelse av tekst. Velge ønsket område, og bare begynn å skrive. Det er også en bevegelig teknologi (drag og slippe) er en uvurderlig funksjon som lar deg flytte utvalgte objekter i forhold til arbeidsplass ved å bruke musen. Du trenger ikke å plassere skjemaer gjennom kode, velge koordinatene deres tilfeldig. Dette reduserer driftstiden betydelig.

Programtillegget har muligheten til å avbryte handlinger. Hvis du gjorde noe galt, bruk bare ctrl+z-tastekombinasjonen og du vil bli tatt ett steg tilbake.

Programtillegget lar deg raskt og enkelt plassere innhold på siden. Hvis du trenger å legge ut en video fra , trenger du bare å kopiere videolenken og lime den inn i ønsket område på siden. I tillegg har den visuelle editoren et enkelt og intuitivt grensesnitt, så det er ikke jevnt erfarne brukere vil kunne finne ut av alt.

Arbeide med Page Builder Sandwich-plugin

Etter at du har installert og aktivert plugin-en, går du til elementet "Brukere", i underelementet "Din profil" i WordPress-konsollen, og merker av for "Vis verktøylinje når du ser på nettstedet". Etter dette, når du besøker en side på nettstedet ditt via front-end, vil du legge merke til en visuell redigeringsknapp øverst til høyre. Den er stor og blå, så du kan ikke gå glipp av den. Når du trykker på knappen, åpnes en editor, som lar deg redigere hva du måtte ønske.

En annen fordel med dette tillegget er muligheten til å umiddelbart observere resultatet.

Til venstre er verktøylinjen. I gratis versjon antall verktøy er begrenset. I den betalte versjonen er det også begrenset, men det er mye flere av dem. På den offisielle WordPress-nettsiden kan du finne opplæringsmateriell om å jobbe med plugin.

Programtillegget ble utgitt relativt nylig og det jobbes for tiden med aktivt arbeid. Kanskje i fremtiden vil utviklere tilby mye interessante funksjoner for å gjøre det enklere å jobbe med den visuelle editoren.

Du kan finne ut om en annen editor for WordPress på .

(Siste oppdatering: 20.01.2019)

God dag! Fra og med denne uken skal jeg konsentrere meg så mye som mulig om temaet - de mest nyttige og nødvendige pluginene for WordPress. Nødvendige som må installeres umiddelbart etter opprettelse av nettside/blogg, noen av dem kan du lese om i denne bloggen. I dag vil jeg fokusere oppmerksomheten din på en WordPress-plugin TinyMCE Advanced. Denne modulen tilhører kategorien - installasjon hvis mulig, det vil si etter ditt ønske eller på annen måte anbefalt. Selv om det kan klassifiseres som - må installeres for god design artikler. Noe sånt.

Klassisk WordPress Editor

Først, mine damer og herrer, før vi går videre til hovedemnet i artikkelen - installering og konfigurering av TinyMCE Advanced editor for wordpress, må du fullføre ekstra tiltak. For hva? I WordPress 5, i stedet for den klassiske editoren, har den nye Gutenberg-blokkredigereren blitt introdusert. Den nye Gutenberg-redaktøren er absolutt kul, men det tar tid å mestre og venne seg til det. Derfor er det første vi må gjøre å returnere den klassiske editoren, det vil si den gamle WordPress-editoren som vi alle er så vant til. Selv om dette ikke er nødvendig.

Hvis du vil fortsette å bruke den forrige (klassiske) editoren i WordPress 5.0 og nyere, har TinyMCE Advanced muligheten til å erstatte ny redaktør til den forrige. Hvis du foretrekker å ha tilgang til begge redaktørene side ved side eller la brukere bytte redaktør, ville det være bedre å installere Classic Editor-plugin. TinyMCE Advanced er fullt kompatibel med Classic Editor.

Vær oppmerksom på at TinyMCE Advanced-pluginen fungerer med både klassiske og nye Gutenberg-blokker.

Foretrekker du å bo hos den gode gamle klassiske redaktøren? Ikke noe problem! Det er ikke overraskende at mer enn 1 million brukere allerede har installert den gamle editoren. Classic Editor-plugin-modulen vil forbli støttet i WordPress til 2021.

Classic Editor-plugin

Klassisk redaktør - offisiell plugin fra laget WordPress utvikling, som gjenoppretter den gamle klassiske versjonen av redigerings- og innleggsredigeringsskjermen. For å installere den, gå til Plugins - Legg til ny - Skriv inn navnet på plugin. På modulsiden klikker du på "Installer"-knappen ved siden av Classic Editor.

Installere den klassiske editoren

Etter installasjonen klikker du på "Aktiver". Deretter går du til Innstillinger - Skriving. Her setter du standardredigeringsprogrammet til klassisk redaktør og tillat brukere å bytte redaktører til Ja (du kan bytte til blokkredigeringsprogrammet og omvendt):

Sette opp publisering i WordPress

Alle! Nå, for å legge til nye funksjoner for redaktører, trenger vi følgende plugin.

TinyMCE Advanced plugin

TinyMCE Advanced introduserer Classic Paragraph-blokken og Hybrid modus for den nye blokkredaktøren (Gutenberg)

TinyMCE advanced - editor for WordPress. Versjon 5.0 er en stor oppdatering av TinyMCE Advanced. Det presenterer ekstra knapper og innstillinger for Rich Text-verktøylinjer i blokkredigeringsprogrammet. I likhet med Classic Editor-verktøylinjene kan de fleste knappene legges til, fjernes eller omorganiseres.

Pluginbeskrivelse

Programtillegget introduserer Classic Paragraph-blokken og Hybrid Mode for den nye Gutenberg-blokkredigereren. Hvis du ikke er helt klar til å bytte til Block Editor, er det bedre å bruke Classic Paragraph-blokken og Hybrid Mode. Den lar deg fortsette å bruke det kjente TinyMCE-redaktør for de fleste oppgaver og gir deg samtidig full tilgang til alle blokker og nye funksjoner i blokkeditoren.

Programtillegget lar deg legge til, fjerne og plassere knapper som vises på den visuelle redigeringsverktøylinjen i klassisk avsnitt og klassiske blokker i det nye blokkredigeringsprogrammet, så vel som i det klassiske redigeringsprogrammet (hvis aktivert av programtillegget). Der kan du tilpasse opptil fire rader med knapper, inkludert skriftstørrelse, skriftfamilie, tekst- og bakgrunnsfarger, tabeller og mange flere.

Noen funksjoner

Hybridmodus som lar deg bruke det beste fra begge redaktørene.
Inkluderer en klassisk avsnittsblokk som kan brukes i stedet for eller sammen med standard avsnittsblokk.
Støtter konvertering av de fleste standardblokker til "klassiske" avsnitt og fra klassiske avsnitt tilbake til standardblokker.
Støtte for å lage og redigere tabeller i Classic Blocks og Classic Editor.
Ekstra alternativer når du setter inn lister i klassiske blokker og den klassiske editoren.
Finn og erstatt i klassiske blokker og den klassiske editoren.
Evne til å angi skriftfamilie og skriftstørrelser i klassiske blokker og i den klassiske editoren.
Og mange andre.

Og så legger vi til funksjonaliteten til WordPress-editoren.

Installere og konfigurere TinyMCE Advanced-plugin

Installasjon av plugin er standard, gjennom WordPress admin panel. Plugins - Legg til nye og skriv inn navnet TinyMCE Advanced i søkefeltet:

Installasjon og aktivering av plugin

Etter vellykket installasjon og aktivering av den avanserte TinyMCE, i "Innstillinger"-delen vil du se en underseksjon med samme modulnavn - TinyMCE Advanced, klikk. Og vi blir tatt til innstillingssiden for å legge til knapper i redigeringspanelet og ulike funksjoner til den klassiske og blokkredigereren din (Gutenberg). TinyMCE Classic Editor-fane:

WordPress Editor-innstillinger

Prosessen med å sette opp den visuelle klassiske editoren er ikke i det hele tatt komplisert. Alt er fullstendig på russisk. Som du kan se har du fire felt og Ubrukte knapper. Med et enkelt museklikk, plasser/dra knapper på panelet eller dra dem for å endre rekkefølgen.

Litt lavere på siden, konfigurer Innstillinger, Avanserte innstillinger og administrasjon.

Setter opp den nye Gutenberg-redaktøren

Selvfølgelig vil jeg ikke vise deg hvordan du jobber med knapper, men du vet bedre enn meg selv. Jeg vil bare merke at nå kan du enkelt sette inn en tabell i artikkelen. Sett den opp og sett den nødvendige parametere:

Og Anker-knappen (navigasjon i artikkelen) er nyttig - mange bloggere bruker den til det fulle. Artikkelknappen er også en nyttig ting. Det var nok alt for i dag. Nå blir det kult å jobbe med den nye og gamle redaktøren. Med de nye funksjonene vil du få vakkert designede artikler.

Og jeg sier farvel til deg. Til neste gang. Hei alle sammen og lykke til.

WordPress-utviklere jobber kontinuerlig med nye funksjoner for å forbedre dette innholdsstyringssystemet. Men først blir disse funksjonene utgitt som utvidelser for å utvikle seg uavhengig, utenfor WordPress kjerne, og først da bli en del av systemet. En av disse fremtidige funksjonene er Front-end Editor visuell artikkelredigeringsplugin, som du kan installere på nettstedet ditt akkurat nå.

Problemer med standard WordPress visuelle editor

På dette øyeblikket, for å lage innlegg i WordPress, må du definitivt gå til standarden visuell redaktør ved å klikke på "Legg til"-knappen øverst på skjermen eller velge riktig element i administrasjonspanelet. Det er noen problemer med denne metoden. Først må du forlate hovedsiden og laste inn en ny. For det andre vil det redigerte innholdet være litt forskjellig fra det faktiske resultatet av artiklene.

Selv om WordPresss visuelle editor heter WYSIWYG (det du ser er det du får), ser innholdet annerledes ut enn det du ser på nettstedet ditt – innenfor temaet ditt.

Du kan selvfølgelig alltid sjekke hvordan det redigerte innleggsinnholdet faktisk vil se ut ved å klikke på "Vis" og gå til hjemmeside din nettside. Men problemet er at du må gjøre eventuelle justeringer blindt, gjennom adminpanelet, og deretter gå tilbake til hovedpanelet. Alt dette er ganske enkelt, men det tar mye tid, spesielt hvis du må jobbe med stort beløp innlegg

Bruke Front-end Editor visuelle editor

Installerer gratis plugin Front-end Editor, får du muligheten til å opprette og redigere innlegg direkte på hovedsiden til nettstedet ditt. Du trenger ikke lenger å gå til for å opprette og redigere oppføringer, og deretter tilbake til nettstedet for å sjekke utdataene deres på siden.

Lag en side eller artikkel

Vanligvis, når du klikker på "Legg til"-knappen, blir du omdirigert til wysiwyg-editoren i panelet WordPress administrasjon. Front-end Editor-pluginet lar deg holde deg på hovedsiden og lar deg lage en side direkte på den. Du går bare inn ønsket tittel der det står "HEADING", og innholdet i stedet for påskriften "Bare skriv...". Hvis du klikker på denne inskripsjonen én gang, vises en permanent lenke til siden, som kan endres i et popup-vindu.

Å lage innlegg med Front-end Editor er lignende, men med muligheten til å legge til en kategori. For å gjøre dette, klikk på stedet der navnene på kategoriene vises i malen din. Deretter vil et vindu dukke opp foran deg der du kan merke de nødvendige kategoriene for innlegg, samt opprette nye og velge overordnede kategorier for dem.

Legger til innhold

Når du klikker hvor som helst i feltet for å legge inn innholdet i postene, vises "Legg til blokk"-knappen foran deg. Den lar deg plassere blokker der utdata utføres forskjellig innhold artikler. Disse blokkene inkluderer:

Hvis du ikke vil plassere disse blokkene, kan du bare begynne å skrive tekst. For å få frem "Legg til blokk"-knappen igjen, trenger du bare å lage et linjeskift. Du kan også slette hvilken som helst av blokkene, eller klippe og lime den inn et annet sted hvis den har noe innhold. Vær oppmerksom på at blokker uten innhold vil ende opp som tomme områder på hovedsiden.

Tekstformatering

Når du lager artikler, kan du formatere tekstinnhold når som helst. For å gjøre dette, velg bare ønsket tilbud, eller gjør Dobbeltklikk på det rette ordet. Etter dette vil et lite vindu vises der du kan velge følgende typer formatering:

Fet skrift;
Kursiv;
Gjennomstreking;
Link;
Sitat;
Overskriftene H2 og H3.

Dessverre har ikke plugin-en andre typer formatering, men dette er nok til raskt å korrigere oppføringer. I tillegg er det ingenting som hindrer deg i å gå til standard WordPress visuelle editor, som har en mer utvidet liste over tagger.

Feste media

Når du legger til en blokk med mediefiler i teksten til artikler, åpnes et bibliotek for deg, hvor du kan velge eksisterende filer eller last opp nye. Dette standard skjerm legge til WordPress mediefiler slik at den har alt nødvendige funksjoner, for eksempel: opprette et galleri, angi et forhåndsvisningsbilde, sette inn fra en URL, laste opp filer, endre bildeinnstillinger.

Etter at du har satt inn bildet, kan du klikke på det for å angi justeringen. Du kan også velge blyanten for å gå til bildeparametrene, som vises i et popup-vindu. Tilsvarende lar pluginet deg gjøre justeringer i bildegalleriet.

Bytt til standard visuell editor

Takket være mulighetene som Front-end Editor-pluginen gir, kan de fleste endringer i teksten til innlegg gjøres direkte på hovedsiden, med unntak av SEO-innstillinger, samt noen HTML-tagger. Men uansett hvor du er på nettstedet, kan du alltid gå til den avanserte visuelle editoren ved å klikke på "Rediger i admin"-knappen i postredigeringsmenyen.

I tilfelle du ønsker å gå tilbake til å endre innholdet i innlegg direkte på hovedsiden, kan du ganske enkelt klikke på "Vis". Dette tar deg til den aktuelle siden, men du vil ikke kunne endre innholdet med en gang. For å fortsette å justere teksten, må du klikke på "Endre" eller "Rediger"

Lagring og publisering

I postredigeringsmenyen øverst på skjermen kan du lagre eller publisere dem. Samtidig, uansett hvilket element du velger, vil du forbli i det samme vinduet og motta et tilsvarende varsel. På denne måten kan du fortsette å gjøre endringer i teksten til innlegg og samtidig se på resultatet av resultatet.

Hva er fremtiden til Front-end Editor

Sannsynligvis en dag vil denne pluginen bygges inn i WordPress som en kjernefunksjon. Inntil da kan du bruke den til å kunne ha en ekte wysiwyg-modus uavhengig av etablert mal. Du vil kunne se resultatet av artiklene slik de faktisk vil se ut, fordi du vil lage dem direkte på hovedsiden til nettstedet. Dette vil vise deg hvordan bilder og tekstinnhold vil bli sett av brukere, uten å måtte gjøre unødvendige overganger, noe som utvilsomt vil fremskynde prosessen med å skrive innlegg.

Konklusjon

I tillegg stor kvantitet fordeler, Front-end Editor-plugin har også flere ulemper. I utgangspunktet er de forbundet med noen feil, som imidlertid ikke hindrer det i å fungere. For eksempel er det problemer med å lagre og publisere innlegg når du aktiverer en av standard maler WordPress, samt mindre feil ved endring av innhold. Uansett er dette en flott plugin som kan spare deg for penger stor mengde tid når du lager innhold, samt gi erfaring med å bruke ekte wysiwyg.

Jeg har et lite sett som trygt kan kalles " må ha"for hver blogger, det vil si obligatorisk for bruk. Hvis det er mulig, installerer jeg nesten den samme samlingen på alle bloggene mine, noe som gjør arbeidet med systemet mer produktivt, funksjonelt og praktisk for besøkende. Jeg tror at du i fremtiden vil finne anmeldelser av dem alle på sidene i denne bloggen. Jeg har allerede snakket om noen moduler, men de fleste av dem er ennå ikke kommet. I dag vi vil snakke om avansert tekstredigerer TinyMCE Advanced– tingen er veldig kul og praktisk.

Generelt, i et tekstredigeringsprogram, bruker du faktisk mest tid i Wordpress - publisere og formatere tekst, legge til tagger, sette inn bilder, noen ganger må du plassere tabeller osv. Generelt er det svært viktig å ha et funksjonelt verktøy av høy kvalitet for hånden. Standard i wordpress system Den har sin egen editor, men jeg vil likevel anbefale å installere TinyMCE Advanced. Slik ser det ut i aksjon nå i administrasjonspanelet wordpress blogg innsiden:

Som du kan se, er det mer enn nok ikoner her for alle slags handlinger. Jeg vil ikke sammenligne den med standarden, siden jeg til og med har glemt hvordan den ser ut, vil jeg bare fortelle deg om noen detaljer i TinyMCE Advanced. På den første linjen har vi knapper:

formatering (fet, kursiv, understreket osv.)
lage vanlige og nummererte lister, samt innrykk for tekst
justering av tekst til kantene, midten og hele kolonnebredden
opprette og slette lenker
sette inn et bilde
css redigering
lage sitater
sette inn skilletegn på og neste side
aktivere stavekontroll, finne en linje i teksten
inkludering fullskjerm-modus, og også vise tilleggslinje funksjonstaster Til tekstredigerer TinyMCE Advanced
den siste knappen er satt inn.

Den andre linjen er ikke mindre viktig og inneholder også en rekke interessante funksjoner:

velge en tekstfont og avsnittsformatering
lim inn tekst, lim inn fra Word, fjern all formatering
legge til et vilkårlig tegn til teksten og skrive ut
og bakgrunn, sette inn uttrykksikoner (for å vise dem, må du merke av i boksen ved siden av konverteringselementet i administratorinnstillingene i "Skriv"-menyen teksttegn for uttrykksikoner i bilder)
utheving av tekst som hevet og senket skrift
sette inn en mediefil
avbryte en handling og gjenoppta den, redigere attributter og hjelpe.

Dette tror jeg vil være nok til å forstå at TinyMCE Advanced-editoren rett og slett er superfunksjonell. Forresten, dette er bare en del av dens evner; Jeg skal fortelle deg om andre litt lenger.

Installere og konfigurere TinyMCE Advanced

Du kan laste ned TinyMCE Advanced tekstredigering fra . Det skal bemerkes at for forskjellige versjoner wordpress (2.6, 2.7, 2.8+) må du bruke din egen distribusjon. I skrivende stund siste versjon Programtillegget er 3.2.7.

Standard installasjon– etter nedlasting, pakk den ut og last den opp til bloggens FTP i mappen wp-content/plugins. Deretter aktiverer vi TinyMCE Advanced fra administrasjonspanelet, hvoretter vi går til "Alternativer" -menyen - "TinyMCE Advanced", hvor du må konfigurere den. Det siste trinnet er å tømme nettleserbufferen.

Før du snakker om oppsettet, noen flere ord om funksjonaliteten til modulen. I følge beskrivelsen på den offisielle nettsiden inkluderer den så mange som 15 andre plugins: Advanced HR, Advanced Image, Advanced Link, Context Menu, Emotions (Smilies), Date og tid, IESpell, Layer, Nonbreaking, Print, Search and Replace, Style, Tabell, Visual Characters og XHTML Extras. Alt dette kan oppnås ved å installere bare én TinyMCE Advanced! Unntatt på engelsk Programtillegget støtter også noen andre lokaliseringer (tysk, fransk, italiensk, spansk, russisk, etc.). Generelt tvil brede muligheter det er ingen modul.

Sette opp TinyMCE Advanced gjøres i bloggadminpanelet i menyelementet med samme navn. Prosessen er ikke komplisert, snarere interessant. På siden vil du se 4 linjer i et tekstredigeringsprogram hvor du kan plassere ulike funksjonstaster:

Ser du hvor mye ting som fortsatt er lagret der? Du må fordype deg i detaljene selv, siden alle elementene er merket og ganske klare. Jeg ville nok fremhevet en egen blokk med funksjoner for å jobbe med tabeller - den lar deg raskt og enkelt lage og endre dem i teksten. Du kan også importere en tilpasset editor til TinyMCE Advanced css-fil stiler - kan også være nyttig. Generelt, som jeg sa helt fra begynnelsen av innlegget, er modulen et must!

Tillegg for TinyMCE Advanced

Det er et par artikler på bloggen som snakker om å utvide funksjonene til plugin:

ved å bruke TinyMCE Color Grid-modulen og mer. Denne avgjørelsen skaper en heftig fargepalett i editoren + legger til en til nyttig funksjon. Også i artikkelen finner du et hack for functions.php, som lar deg bytte ut basisfargene i TinyMCE Advanced med dine egne.
— Jeg vurderer oppgaven med å installere nytt tilpassede fonter i TinyMCE Advanced, i tillegg til å legge til Google Fonts gjennom vanlig CSS stiler.

Jeg tror disse notatene vil være nyttige for deg i arbeidet ditt. Hvis du har spørsmål, spør dem i kommentarene.

Grensesnittspråk: engelsk russisk Type: Plugin

WordPress tekstredigerer er et enkelt å bruke og viktig verktøy for alle, enten det er en redaktør eller en webutvikler. Men hvordan forbedres versjonen av tekstredigereren med Brukererfaring for hver bruker?

WP Smart Editor tilbyr deg og dine kunder egen erfaring arbeid med muligheten til å filtrere verktøyene som er tilgjengelige for hver brukerrolle, eller til og med for hver bruker. I tillegg er plugin-modulen utstyrt med tidsbesparende verktøy som: table manager, filbehandler, tilpasset stil og knapperedigerer, punktlister og et summeringsverktøy.

Rollen til brukere og WordPress-profiler. WP Smart Editor tilbyr unike muligheter for hver innholdsskaper. Du har muligheten:

Opprett flere brukerprofiler;
Velg et sett med redigeringsverktøy som skal brukes på hver profil;
Bruk profiler til en eller flere brukere eller brukerroller;
Eksporter/importer brukerprofiler fra en nettside til en annen.

Utvalg av verktøy. WP Smart Editor kommer med et kraftig sett med redigeringsverktøy som er nyttige og tidsbesparende for redigering av innhold, inkludert:

Kolonnebehandling: Lag og tilpass kolonneoppsett uten å bruke HTML-kode;
Button manager: design, lagre og gjenbruk knappene dine fra editoren;
Listebehandling: Lag lister med ikoner, lagre og gjenbruk dem på nettstedet ditt;
Sammendrag: Lag automatisk innhold med lenker basert på innholdstittelstrukturen;
Verktøytipsbehandling: Legg til et AJAX-verktøytips i innholdet ditt.

Filbehandler. Administrer filer som f.eks PDF-filer eller ZIP-filer ved å bruke standard WordPress mediebehandling. WP Smart Editor inneholder lett versjon kraftig plugin WP-filopplastinger slik at du kan laste opp, administrere og oppdatere filer.

Bordsjef. Å lage en tabell i WordPress-editoren krever kunnskap om HTML/CSS, og det er nesten umulig å administrere tabellen i innholdseditorer. WP Smart Editor inkluderer en lett versjon av den kraftige WP Table Manager-pluginen, som lar deg lage, administrere og tilpasse tabeller fra redaktøren din akkurat som om du brukte Excel.

Spesiell HTML-stil for brukere. WP Smart Editor har et spesielt verktøy for å lage din egen CSS-stiler og gi dem til brukere. Som webdesigner, lag din egen stil iht WordPress-tema, navngi den og la innholdsredigereren bruke den når det er nødvendig.

Mal editor. Med malbehandlingsverktøyet kan du lagre layoutene dine, alt innholdet og HTML-strukturen du skrev inn i redigeringsprogrammet, og bruke dem senere på en annen side.

Forbedret koderedigering. WordPress inkluderer tekst/HTML-visninger som standard i redigeringsprogrammet. Vi har forbedret oss HTML-versjon med kodeutheving ved å bruke søke-/erstatt-funksjonen, søk etter et ord eller uttrykk og legg det til alt innholdet ditt.

WP Smart Editor-pluginen integreres perfekt med: