text editor what you see is what you mean/ get
Ik ben bezig een systeem te ontwikkelen. Waarbij gebruikers zelf tekst kunnen toevoegen etc. Nou ben ik eens begonnen met een "ubb-balkje" boven een tekstveld zoals hier.
Vervolgens ben ik verder gegaan en kwam ik bij Wym-editor, NicEdit, FCK-editor (mooi maar geloof ik betaald indien in commerciele websites verwerkt) etc. Deze zijn mij allemaal te uitgebreid, ze geven de gebruiker te veel opties. En ze werken tevens niet fijn.
Belangrijkste elementen welke ik in de werkbalk wil hebben zijn;
h1, h2, h3, h4, p, ul, ol, (en li) strong, link/ unlink, insert image.
Ik wil het graag simpel, eenvoudig en niet te uitgebreid dus.
Wat ik wil is dat de gebruiker de tags etc. niet ziet, maar dat deze wel in het textarea vermeld worden. En voornamelijk ook dat het goed wordt opgeslagen, NicEdit geeft bijvoorbeeld allemaal rare span-classes aan etc. Waardoor het altijd maar een gechoochel is.
Hebben jullie misschien een alternatief?
Of, weten jullie misschien waar ik beginnen kan om het zelf in elkaar te schroeven. Ik heb inmiddels enige kennis van Javascript en ken jquery een beetje.
Bij voorbaat dank,
Met vriendelijke groet,
Wouter
Een voorbeeldje kun je hier vinden: http://wouterj.github.com/wjEDITOR/ Code hier: https://github.com/WouterJ/wjEDITOR en de docs hier: https://github.com/WouterJ/wjEDITOR/wiki
Als er problemen zijn wil ik die natuurlijk graag horen, zodat ik het kan oplossen.
Een andere goede editor die ik vaak gebruik is TinyMCE, je kunt daar zelf bepalen wat je te zien krijgt, dus welke tags je kunt gebruiken en de output is gewoon normale HTML met hier en daar inline CSS.
Nice Dankjewel voor de snelle reactie, Ik zal er zsm naar kijken. Vandaag ga ik buiten aan het werk. Ik zal laten weten hoe het implementeren gaat!
http://nubtu.be/ulfbo
Jammer vind ik hieraan dat de zover ik weet meeste WYSIWYG editors geen valid code opleveren. Ik probeer mijn websites meestal xhtml valid te krijgen (wordt tijd voor html 5), alleen zon editor verpest dit meestal. Ligt dat aan mij, of gebruik ik gewoon de verkeerde? Voorbeeld: Gewijzigd op 29/03/2012 10:28:27 door gerhard l
Maar Wouter H wil een editor voor op zijn website. Bijv. hier op het forum, daar gebruiken we een bb code editor en in Wordpress en andere CMS systemen zitten standaard WYSIWYG editors.
Daarnaast kun je best wel goede code creëren als het alleen om tekst opmaak gaat, en daar is dit ook alleen voor bedoelt. Als je websites maakt met die editor loopt het alleen mis. Zo'n editor weet niet wat voor betekenis jij met die tekst hebt en met dat element en dus kan hij geen semantiek toepassen, iets wat eigenlijk het enige nut van HTML is.
HTML valid is echt niet nodig, het gaat om goede semantiek.
Wanneer ik met ul, ol, en li ga spelen, lijkt het wat te haperen. Als ik een enter plaats tussen de begin en eind tag van de ol om li tussen te voegen laat hij in het resultaat zien:
/////////
[ol]
<li>met wel de li items netjes</li>
[/ol]
///////
Ook zal ik nog even naar de andere optie kijken. Heb jij bij TCME nooit problemen gehad dat er vanalles aan span dit en span zus om de paragraafjes tekst etc. komt te staan?
En... ja klopt ik zoek iets wat gebruikers van mijn cms kunnen gebruiken om eenvoudig de tekst te kunnen toevoegen/bewerken.
Gewijzigd op 30/03/2012 10:05:41 door wouter H
Zoals Wouter J aangaf heb je ook TinyMCE. Ik gebruik deze al een tijdje met volle tevredenheid. Binnen kort ga ik onze gastenboek er ook mee belasten, op dit moment draait TinyMCE alleen nog in ons admin panell. Je kan hier zelf aangeven welke tag optie's je wilt laten weer geven of gebruiken.
Je hebt tegenwoordig ook een handige ajaxfilemanager plugin, die je erg makkelijk kan intregeren in je TinyMCE. Zodat je ook foto's kunt toevoegen aan je berichten of uploaden.
Je krijgt wel html codering in je database, alleen dit zijn de tags die je zelf aangeeft en wilt gebruiken in je berichten. Bij het weergeven van de berichten onder vind ik daar geen hinder van kwa laad tijd enz.......
Ik als TinyMCE gebruiker kan je deze dan ook aanraden.
Frank WD op 30/03/2012 11:15:05:
Wouter,
Zoals Wouter J aangaf heb je ook TinyMCE. Ik gebruik deze al een tijdje met volle tevredenheid. Binnen kort ga ik onze gastenboek er ook mee belasten, op dit moment draait TinyMCE alleen nog in ons admin panell. Je kan hier zelf aangeven welke tag optie's je wilt laten weer geven of gebruiken.
Je hebt tegenwoordig ook een handige ajaxfilemanager plugin, die je erg makkelijk kan intregeren in je TinyMCE. Zodat je ook foto's kunt toevoegen aan je berichten of uploaden.
Je krijgt wel html codering in je database, alleen dit zijn de tags die je zelf aangeeft en wilt gebruiken in je berichten. Bij het weergeven van de berichten onder vind ik daar geen hinder van kwa laad tijd enz.......
Ik als TinyMCE gebruiker kan je deze dan ook aanraden.
Zoals Wouter J aangaf heb je ook TinyMCE. Ik gebruik deze al een tijdje met volle tevredenheid. Binnen kort ga ik onze gastenboek er ook mee belasten, op dit moment draait TinyMCE alleen nog in ons admin panell. Je kan hier zelf aangeven welke tag optie's je wilt laten weer geven of gebruiken.
Je hebt tegenwoordig ook een handige ajaxfilemanager plugin, die je erg makkelijk kan intregeren in je TinyMCE. Zodat je ook foto's kunt toevoegen aan je berichten of uploaden.
Je krijgt wel html codering in je database, alleen dit zijn de tags die je zelf aangeeft en wilt gebruiken in je berichten. Bij het weergeven van de berichten onder vind ik daar geen hinder van kwa laad tijd enz.......
Ik als TinyMCE gebruiker kan je deze dan ook aanraden.
Ik mag hopen dat je weet dat je (waarschijnlijk) nu alleen client-side instelt welke tags toegestaan zijn en deze nog te manipuleren zijn?
Zou je jou vorige berichten misschien verder willen toelichten?
Want persoonlijk heb ik verder niks ingesteld kwa client-side of iets dergelijks.
Mocht je het willen toelichten of vertellen waarbij je dan na moet kijken. Zodat ik het hier kan nakijken en goed kan instellen mocht het niet zo zijn.
Wouter,
Ik heb lijsten nog nooit geprobeerd, ik zal eens kijken of ik dit goed geïmplementeerd krijg.
Deze manier heb ik ook aan de uiteindelijke gebruiker laten zien. Ook zij prefereerde deze manier.
Ik hoop dat het lukt Wouter J.
Als het goed is moet het nu werken.