Live Text Editor maakt elk tekstelement op een webpagina bewerkbaar met één klik. Wijzig koppen, alinea's, knoplabels, navigatie-items of tekstinhoud rechtstreeks op de live pagina — de bewerkte tekst wordt in realtime weergegeven met behoud van de lettertypen, kleuren en indeling van de pagina. Perfect voor het testen van kopie variaties, het maken van mockups en het maken van schermafbeeldingen met aangepaste inhoud.
Hoeveel keer hebt u gedacht "Ik vraag me af hoe deze kop er met ander woorden zou uitzien" of "Ik heb een schermafbeelding van deze pagina met de naam van onze cliënt in plaats van plaatsaanduidingstekst nodig"? Normaal gesproken betekent dit dat u code bewerkt, opnieuw opbouwt of een afbeeldingseditor gebruikt om tekst over te leggen. Live Text Editor elimineert alles — klik gewoon op tekstinhoud op de pagina en begin met typen. De tekst wordt op locatie bewerkbaar met contentEditable, wat betekent dat alle originele CSS-styling van het element wordt behouden: lettertypefamilie, tekengrootte, tekendikte, kleur, letterspatiëring, reghoogte, teksttransformatie en alle andere teksteigenschappen. De indeling wordt in realtime bijgewerkt terwijl u typt — als de nieuwe tekst langer is, breidt het element zich natuurlijk uit. Bewerk zoveel tekstelementen als u wilt in één sessie. Een bewerkingstellercontroller houdt bij hoeveel elementen u hebt gewijzigd, en "Ongedaan maken Alles" herstelt alles onmiddellijk. Alle wijzigingen zijn alleen visueel en worden opnieuw ingesteld na pagina-vernieuwen.
Klik op een tekstelement op de pagina — kopjes, alinea's, omvang, knoplabels, linktekst, lijstitems, tabelcellen — en het wordt onmiddellijk bewerkbaar. Een knipperende cursor verschijnt en u kunt beginnen met typen. Er is geen selectiemodus of extra klikken nodig.
Bewerkte tekst behoud elke originele CSS-eigenschap: font-family, font-size, font-weight, color, line-height, letter-spacing, text-transform en indelingseigenschappen. De tekst ziet er precies uit alsof deze op de pagina thuishoort — niet zoals een ruw overlay.
Terwijl u langere of kortere tekst typt, wijzigt het element zich natuurlijk van grootte en herindeling de omringende indeling net zoals bij echte inhoud. Zie precies hoe verschillende tekstlengten van invloed zijn op de indeling.
Bewerk zoveel tekstelementen als u wilt in één sessie. Wijzig de kop, vervolgens de onderkop, vervolgens het knoplabel, vervolgens de voetteksttekst — elke bewerking blijft bestaan totdat u de pagina vernieuwt.
Een kleine teller geeft aan hoeveel elementen u hebt bewerkt. "Ongedaan maken Alles" herstelt elk bewerkt element op één klik naar de originele tekstinhoud. Afzonderlijke wijzigingen worden bijgehouden met "was: originele tekst" hints.
Alle bewerkingen bestaan alleen in de DOM van de browser en worden nooit op de server opgeslagen. Vernieuw de pagina en elk tekstelement keert terug naar de originele inhoud. Veilig te gebruiken op elke website — inclusief productiesites.
Probeer verschillende titelwijzigingen op de live pagina uit om te zien welke formulering het sterkst aanvoelt. "Aan de slag gratis" versus "Start uw gratis proefperiode" versus "Maak uw account aan" — zie elke versie weergegeven met het werkelijke paginaontwerp.
Vervang plaatsaanduidingstekst ("Lorem ipsum") door de werkelijke inhoud van de cliënt tijdens een presentatie. Toon hen de bedrijfsnaam, productbeschrijving en CTA-kopie die in het werkelijke ontwerp worden weergegeven — veel meer overtuiging dan een statische mockup.
Hebt u een schermafbeelding nodig met specifieke tekst voor documentatie, een blogpost of een presentatiedia? Bewerk de tekst rechtstreeks en gebruik vervolgens het Screenshot-gereedschap om een schoon afbeelding met uw aangepaste inhoud vast te leggen.
Wat gebeurt er als een productnaam 40 tekens is in plaats van 15? Of als een beschrijving 3 regels is in plaats van 1? Typ langere tekst om te zien hoe de indeling dit aanpakt — zoek overloop-bugs op voordat echte inhoud deze activeert.
Plak vertaalde tekst in elementen om te zien hoe het ontwerp met verschillende talen omgaat. Duitse tekst is vaak 30% langer dan Engels — werkt de indeling nog steeds? Past de knoptekst nog in?
Open het floating dock van DevSuite Pro en klik op het Live Text Editor-pictogram. Het gereedschap wordt geactiveerd en elk tekstelement op de pagina wordt klikbaar voor bewerking.
Klik op een kop, alinea, knoplabel of andere tekstinhoud. Een cursor verschijnt in de tekst en een "bewerk" badge wordt boven het element weergegeven.
Begin met typen om de tekst te vervangen of aan te passen. De nieuwe inhoud wordt in realtime weergegeven met behoud van de originele opmaak. De indeling past zich natuurlijk aan de nieuwe tekstlengte aan.
Klik buiten het huidige element om de bewerking ervan te voltooien en klik vervolgens op een ander tekstelement om dat ook te bewerken. De bewerkingstellercontroller houdt alle wijzigingen bij.
Klik op "Alles ongedaan maken" om elk bewerkt element te herstellen of vernieuw de pagina om alles volledig opnieuw in te stellen.
Installeer DevSuite Pro gratis en ontgrendel 64+ ontwikkelaarstools voor uw browser.
