Is it possible to use third party HTML editor instead of the default editor and how to enable it with moodle?
Thankyou
1. Do you mean third party online editor (embedded into page such as X-lite (xstandard.com), WysiwygPro (wysiwygpro.com), xinha, fckeditor etc,etc,etc,etc) or
2. third party editor like Dreamweaver, frontpage, nvu etc...
1. Yes, but you'll need to modify moodle's core code.
2. Disable editor from your profile and just copy paste HTML code that your editor have produced...
- Janne -
2. third party editor like Dreamweaver, frontpage, nvu etc...
1. Yes, but you'll need to modify moodle's core code.
2. Disable editor from your profile and just copy paste HTML code that your editor have produced...
- Janne -
small addition to 2:
Use the Firefox "ViewSourceWith" extension in any textarea of the web page to open the whole content in the editor of your choice, edit your text and save it in the editor. Your text changes are written back into the textarea of the web page. Very comfortable. It gives you not only the possibility to use your full featured html editor but also to use alternatively your text editor with spell checking and everything.
Urs
Dear Urs,
Thank you very much for this excellent advice. Using en external editor makes perfect sense to keep useful functions such as spell check.
I have now installed the ViewSourceWith extension, have downloaded and installed NVU (Dreamweaver has always been a little overkill for my limited web editing knowlede, NVU seems pretty intuitive to me).
Here is how I planned to use your recommendation:
1. I take my course content from word and copy it into NVU, embedd pictures etc...
2. I toggle NVU to html source, copy the source code to the MOODLE editing window (toggled as well) and have a look if everything is fine.
One question : Is my way the most efficient way of editing? and: What do you mean with 'Your text changes are written back into the textarea of the web page'?
> Do you mean there is a way of bridging NVU editing directly with the MOODLE editing page, so that changes in NVU can be directly saved/transferred to MOODLE for editing of the course? That woule be amazing, but I think I misinterpreted your comment.
Viele Grüsse aus Kanada...
Stephan
Thank you very much for this excellent advice. Using en external editor makes perfect sense to keep useful functions such as spell check.
I have now installed the ViewSourceWith extension, have downloaded and installed NVU (Dreamweaver has always been a little overkill for my limited web editing knowlede, NVU seems pretty intuitive to me).
Here is how I planned to use your recommendation:
1. I take my course content from word and copy it into NVU, embedd pictures etc...
2. I toggle NVU to html source, copy the source code to the MOODLE editing window (toggled as well) and have a look if everything is fine.
One question : Is my way the most efficient way of editing? and: What do you mean with 'Your text changes are written back into the textarea of the web page'?
> Do you mean there is a way of bridging NVU editing directly with the MOODLE editing page, so that changes in NVU can be directly saved/transferred to MOODLE for editing of the course? That woule be amazing, but I think I misinterpreted your comment.
Viele Grüsse aus Kanada...
Stephan
Stephan, you write
"One question : Is my way the most efficient way of editing? and: What do you mean with 'Your text changes are written back into the textarea of the web page'?
Your way sounds good. You describe the way of creating pages. My description comes in when you want to edit your pages after you saved them in Moodle. When you want to change the text of your HTML page in Moodle you open the editing page and get the textarea with your code. Now you can use the extension to open this HTML text in your editor, change it and save it. This way the HTML gets written back into the Moodle textarea. Then you save your changed text in the Moodle page and are done.
Urs
PS. Stephan's idea sounds great. A question to the developers: would the process he describes be possible?
Hi Urs.
Thanks for discovering yet another (potentially) wonderful Firefox extension for us.
I say potentially only because it doesn't seem to be working for me. I'd like to know whether I'm doing something wrong or it is supposed to work like that.
If I understood you correctly, in order for this to work you must have turned the "Toggle HTML" button in the Moodle HTML editor on, right? When I do that, then I click on the right button of the mouse and I see the option 'view source with'. I've set it up so that I can choose between Dreamweaver and NVU. When I choose Dreamweaver it seems to work but I only get the source view in Dreamweaver. I'm unable to go to the 'design mode'.
If that's all you can do, then for me this would not be all that useful since there is not that big of a difference (at least for a user like me) between editing HTML code in the Moodle editor or in Dreamweaver. The nice thing would be that you could edit the Dreamweaver WYSIWYG mode.
With NVU I'm even less lucky. I get a message that says "This is not an HTML document" and then the code is not passed on to NVU which opens a blank page instead.
I would assume this is not the way it works for you but I have no idea about what I'm doing wrong. Any help would be welcome since if this worked in the way I imagined (opening the document in Dreamweaver or NVU and be able to toggle between 'source' and 'design mode'), it would be really great.
Josep M.
Thanks for discovering yet another (potentially) wonderful Firefox extension for us.
I say potentially only because it doesn't seem to be working for me. I'd like to know whether I'm doing something wrong or it is supposed to work like that.
If I understood you correctly, in order for this to work you must have turned the "Toggle HTML" button in the Moodle HTML editor on, right? When I do that, then I click on the right button of the mouse and I see the option 'view source with'. I've set it up so that I can choose between Dreamweaver and NVU. When I choose Dreamweaver it seems to work but I only get the source view in Dreamweaver. I'm unable to go to the 'design mode'.
If that's all you can do, then for me this would not be all that useful since there is not that big of a difference (at least for a user like me) between editing HTML code in the Moodle editor or in Dreamweaver. The nice thing would be that you could edit the Dreamweaver WYSIWYG mode.
With NVU I'm even less lucky. I get a message that says "This is not an HTML document" and then the code is not passed on to NVU which opens a blank page instead.
I would assume this is not the way it works for you but I have no idea about what I'm doing wrong. Any help would be welcome since if this worked in the way I imagined (opening the document in Dreamweaver or NVU and be able to toggle between 'source' and 'design mode'), it would be really great.
Josep M.
Josep,
I guess I spoke to soon. I tried it with vim and that worked out of the box, but I can not get this to work with NVU either
I do not have Dreamweaver installed, so I can't really help you with that.
You can skip some steps:
You don't need to toggle to HTML format in the HTML editor everytime. Just disable the HTML editor in your profile. And set the formatting to native HTML. This also slightly reduces the time it takes to load the page because it skips the HTML editor.
If the textarea is displayed, just right-click on it and choose view source with NVU. When you close the document in NVU the texetarea is automatically updated. You don't need to copy/paste the HTML from NVU to the textarea.
I guess a more direct way of bridging NVU and Moodle would run into security restrictions, eg normally browser don't have direct access to the content of the clipboard. Maybe some clever greasemonkey script???
Thank you Jan - your advice was appreciated and I have streamlined my editing process.
Stephan
Stephan
Stephan,
Did you get it to work with nvu as editor?
Jan,
I guess I was a little quick with my last response - I still have a question:
to your first point:
> I changed: When editing text: Use standard web formsUse HTML editor (some browsers only)
Now, my text window for editing shows directly HTML format - but when I right click:
to your second point:
> If I am in the MOODLE text area for the HTML code and select view source with NVU, NVU pops-up with an ALERT: This is not an HTML document..???
I guess I was a little quick with my last response - I still have a question:
to your first point:
> I changed: When editing text: Use standard web formsUse HTML editor (some browsers only)
Now, my text window for editing shows directly HTML format - but when I right click:
to your second point:
> If I am in the MOODLE text area for the HTML code and select view source with NVU, NVU pops-up with an ALERT: This is not an HTML document..???
Yes, same here! That's why I asked: did you get it to work with NVU?
Up to now I have been using vim. I wrongly assumed using nvu as the external editor would just be a matter of changing the path to the application.
I have tried al sorts of things: starting nvu with the -edit commandline option, trying to make nvu start without checking for a valid html file. Up to now with no luck.
Back to using vim with markdown.
Well, I guess we need Urs to tell us whether it is working for him. As I said, Dreamweaver seems to work but in a way that doesn't make it worth it. It is funny that NVU doesn't work since in the page for this Firefox extension they mention NVU expressly as a possible editor to use with it.
Josep M.
Josep M.
Josep, I'm sorry but I can't help with NVU. I use TopStyle Pro as Editor and the Firefox TopStyle combination works perfectly. I don't have NVU installed so I can't look at it.
I hope you will find the solution
Urs
Thanks Urs,
If I'm not mistaken, TopStyle is a CSS editor (not surprising, you being the CSS man
).
I'm curious to know, though, how you use the ViewSource extension working in Moodle, since most CSS in Moodle is not embedded in the web pages it generates. Do you use TopStyle as your HTML editor?
Josep M.
If I'm not mistaken, TopStyle is a CSS editor (not surprising, you being the CSS man
). I'm curious to know, though, how you use the ViewSource extension working in Moodle, since most CSS in Moodle is not embedded in the web pages it generates. Do you use TopStyle as your HTML editor?
Josep M.
"Do you use TopStyle as your HTML editor?"
Yes Josep. TopStyle Pro is a very good CSS editor. And it is an equally good XHTML editor with side by side Firefox and MSIE preview. Cross browser web site and web application work becomes quite intuitive. It has sufficient PHP and JavaScript support. So it is one Program for nearly everything I need concerning coding
Urs
Urs: > TopStyle Pro is a very good CSS editor. And it is an equally good XHTML
>editor with side by side Firefox and MSIE preview.
OK, thanks. I'll make sure I ckeck it out.
Jan: > Janne's HTML editor does a great job a providing the user with an intuititive user interface.
Oh, I have no doubts about that. I will continue to use Janne's editor most of the time. The problem is that, since it is on-line, sometimes you need to edit some big and/or complex files and then it becomes a bit of a pain if the network/server is slow. I was looking for a fast/convenient way to edit HTML files on my local computer for those jobs that might require it. The viewsourcewith plugin looked like a promising possibility but now I see it has some shortcomings. Using it with Dreamweaver is really not really convenient since the "design view" is not available and the source view doesn't seem to work all that well (some functions do not seem to be available). I'll try your hack with NVU and see what it is like. Is the "design view" available when you use NVU? Or only the "source view"?
Josep M.
>editor with side by side Firefox and MSIE preview.
OK, thanks. I'll make sure I ckeck it out.
Jan: > Janne's HTML editor does a great job a providing the user with an intuititive user interface.
Oh, I have no doubts about that. I will continue to use Janne's editor most of the time. The problem is that, since it is on-line, sometimes you need to edit some big and/or complex files and then it becomes a bit of a pain if the network/server is slow. I was looking for a fast/convenient way to edit HTML files on my local computer for those jobs that might require it. The viewsourcewith plugin looked like a promising possibility but now I see it has some shortcomings. Using it with Dreamweaver is really not really convenient since the "design view" is not available and the source view doesn't seem to work all that well (some functions do not seem to be available). I'll try your hack with NVU and see what it is like. Is the "design view" available when you use NVU? Or only the "source view"?
Josep M.
Design view and source view are working.
It seems we are looking for the same thing. I also like the html editor, but picking colors or inserting links can be time consuming.
Looking at other editors I found out about mozile, a Firefox extension (so it is installed locally which make sit respond very quickly) which enables you to post HTML to a webpage (so it could be used for inline editing of labels / forum posts / student assignements / etc .... )
First problem I ran into integrating it into moodle is the hidden fields that normally are sent along with the text from the html editor (discussionid, sesskey, course id, etc...)
Hi Jan,
> Design view and source view are working.
Cool! Then definitely I'm going to do what you suggest. NVU is still far from Dreamweaver, but it is getting better and better all the time.
OK, right after writing the lines above, I tried to edit viewsourcewith.jar but the problem is that it looks like it is a binary file. I opened it with an editor and all I can see are columns of numbers and letters. I cannot find the string you mention.
Josep M
Well, no need to download your jar file. I downloaded vim and, you are totally right, this is a great little editor. I opened the .jar file and I could see all the code. I managed to find the line you mentioned and I replaced it with the line with .htm instead of .txt.
However, I still don't seem to get it to work. NVU still tells me "this is not an html document". I've shut down Firefox and start it again and it still doesn't work. Perhaps I need to restart my computer (perhaps the .jar file remains in memory somehow).
Josep M.
However, I still don't seem to get it to work. NVU still tells me "this is not an html document". I've shut down Firefox and start it again and it still doesn't work. Perhaps I need to restart my computer (perhaps the .jar file remains in memory somehow).
Josep M.
Can't help you with that. It works on my computer after I did the change to viewsourcewith.jar
I can use the following views to edit my post: normal view, html tags, source view and preview. (the tabs at the bottom of the nvu screen)
I tried different things to get it to work. Maybe one of the other changes is still active and is also needed. I'll try finding out which one...
Well, Jan, I'm glad to say your hack is finally working!
Josep M.
| It looks like my inexperience with vim was the problem. I did
change the line as you suggested but apparently the .jar file was not
saved properly. I would have sworn that the other day I opened it not
once but twice to make sure that the new line had been substituted for the old
one. But today, after reading your message, I checked it again and I
noticed that .txt was there instead of .htm. I replaced the
string again and now it is working. In fact, this message has been
written using my locally installed NVU. I'm certainly going to continue to use Janne's great html editor for most jobs but, as I said, when the job requires that I edit the document locally, this is a great find. THANK YOU very much for your help. |
Josep M.
I thought this thread was over but I've come up with another problem and I thought maybe somebody can help me here. The problem is the following. When I use 'viewsourcewith' and the HTML document opens up in NVU, I get special characters appearing as garble.
Thus, something that should read like this:
La separació entre sincronia i diacronia i les seves conseqüències
appears like this:
La separació entre sincronia i diacronia i les seves conseqüències
Anybody has any idea as to why this is happening?
Josep M.
Thus, something that should read like this:
La separació entre sincronia i diacronia i les seves conseqüències
appears like this:
La separació entre sincronia i diacronia i les seves conseqüències
Anybody has any idea as to why this is happening?
Josep M.
Actually, Jan, I wanted to tell you that your hack solved the problem I was having with Dreamweaver as well. Just by substituting .html for .txt you get to see the document both in source code and in design view.
Josep M.
Josep M.
After some trials it seems I may have found a solution to get NVU to work as an external editor. use at your own risk
If you are not familiar with Firefox user profiles and where they are on your computer, you can read about it here.
Look in your Mozilla userprofile for a file called
viewsourcewith.jarmake a backup copy of this file so you can always revert to an earlier copy
or even better: install a separate userprofile in Firefox to experiment with this.
look up the line
[fileName.replace(re, controlName + ".txt")]);
and replace it with
[fileName.replace(re, controlName + ".htm")]);
because NVU expects HMTL files to have that extension.
- restart Mozilla Firefox.
Now I have been able to use NVU to edit Moodle textareas. Not that convinced of it's usefulness though.
Janne's HTML editor does a great job a providing the user with an intuititive user interface.
Urs,
This is a great extension. So far I had been using a similar extension which also allowed to invoke an external editor, but that one locked firefox until you were done writing your textarea. This meant you couldn't lookup things one the internet while writing.
The extension you mention doesn't lock Firefox. Thanks!
Another possibility is to use Xinha Here! a Firefox extension. From the website:
Xinha Here! enables WYSIWYG editing in any HTML textarea and text input elements. Xinha Here! opens Xinha editor on the client side. This allows you to edit the field data in a WYSIWYG editor on any website without copying and pasting to a secondary editor.
To use Xinha Here! simply select Xinha Here! from the context menu of the desired textarea or text input element. Up will pop a Xinha WYSIWYG HTML editor. Press OK and the raw HTML is pushed back to the original text box.
Inside Moodle you can then select HTML Format in the dropdownbox and you have an easy way of editing HTML without having to reload the HTML editor everytime.
Download the Firefox extension here.
Just installed the FF extension, and the editor opens and works fine; however, my moodle site doesn't like it:
Warning: fopen(/home/site_files/general/web_site_user.htm) [function.fopen]: failed to open stream: Permission denied in /home/public_html/files/index.php on line 387
Warning: fputs(): supplied argument is not a valid stream resource in /home/public_html/files/index.php on line 388
Warning: fclose(): supplied argument is not a valid stream resource in /home/public_html/files/index.php on line 389
Any ideas??
Jeff
PS - I can't even edit it from in moodle using the edit feature beside the file name.
PPS - seems to only be a problem for that specific file
Warning: fopen(/home/site_files/general/web_site_user.htm) [function.fopen]: failed to open stream: Permission denied in /home/public_html/files/index.php on line 387
Warning: fputs(): supplied argument is not a valid stream resource in /home/public_html/files/index.php on line 388
Warning: fclose(): supplied argument is not a valid stream resource in /home/public_html/files/index.php on line 389
Any ideas??
Jeff
PS - I can't even edit it from in moodle using the edit feature beside the file name.
PPS - seems to only be a problem for that specific file
I don't understand your question. What exactly ar eyou trying to do with xinha?
Hi Jan,
I am trying to use Xinha to edit HTML documents I have already uploaded to my site. I'm trying to avoid having to copy and paste the HTNL code from moodle to an editor and copy it back into moodle.
Moodle used to have an option to edit HTML documents using its HTML editor, but that feature has been removed.
I have managed to get Xinha to open and I am able to edit the file. Xinha then replaces it find, but my character encoding is Unicode and edited text does not always display properly:
e.g.
school�s
should be
school's
Looks fine in Xanha but when the edited file is viewed in moodle, it displays funny.
Not all changes in Xanha are then made in moodle file
Jeff
PS - seems when I cleared the cache all is fine
I am trying to use Xinha to edit HTML documents I have already uploaded to my site. I'm trying to avoid having to copy and paste the HTNL code from moodle to an editor and copy it back into moodle.
Moodle used to have an option to edit HTML documents using its HTML editor, but that feature has been removed.
I have managed to get Xinha to open and I am able to edit the file. Xinha then replaces it find, but my character encoding is Unicode and edited text does not always display properly:
e.g.
school�s
should be
school's
Looks fine in Xanha but when the edited file is viewed in moodle, it displays funny.
Not all changes in Xanha are then made in moodle file
Jeff
PS - seems when I cleared the cache all is fine
Jeff, I didn't even know you could edit uploaded html documents through Moodle. I only use xinha inside Moodle's normal textarea's
I was away for four days and now I'm completely lost. My interest is to find a good replacement for moodle HTML editor which has both design and code editing facility (like DEVEDIT, EDITWORKS, WYSISYGpro etc). I'm aware that I can replace the moodle html codes with my html codes, which I normally do with dreamweaver. In case If I have to replace the moodle html editor with other html editor (examples given earlier) what should be my methodology. Even though I do progamming in C++ etc, I'm not very comfortable with PHP progamming.
hi,
Does anybody have a trick to deal with pictures ?
in nvu, you can copy/paste, picture, but then if you copy into htmlarea, you w'ont have the picture in moodle !
=> is the a way to avoid pasting the image manualy in moodle files before using it in htmlarea ?
I hope it is clear enought !
I'm in an answering posts mood today, this one is ooold!
Two ways to do that:
1) hard-code an img reference to a picture sitting on a server outside of moodle. like this:
<img src="http://www.mozilla.org/press/image-library/firefox-logo.png">
2) Moodle.org doesn't seem to allow this (not sure how they do that). But what they do allow is for participants to attach pictures which show up in the post. The only draw-back to that is that you can not adjust the positioning, size, etc. from within the post, it just shows up automatically at the bottom of the post.
Hope that helps,
~MC~
Two ways to do that:
1) hard-code an img reference to a picture sitting on a server outside of moodle. like this:
<img src="http://www.mozilla.org/press/image-library/firefox-logo.png">
2) Moodle.org doesn't seem to allow this (not sure how they do that). But what they do allow is for participants to attach pictures which show up in the post. The only draw-back to that is that you can not adjust the positioning, size, etc. from within the post, it just shows up automatically at the bottom of the post.
Hope that helps,
~MC~
Using NVU with Moodle
As a newbie administrator of a moodle site, I was able to upload MSWord documents for all site users through the Site Administration Front Page Site Files.
However, using the Word format is very crude. I came upon NVU and with its Edit Site feature I was able to use the NVU HTML editor by pointing the NVU to the location "your_site\public_html\uploaddata\1". Located there were the public files listed under the Site Administration Front Page Site Files.
I hope this info is helpful to other Moodle site administrators.
As a newbie administrator of a moodle site, I was able to upload MSWord documents for all site users through the Site Administration Front Page Site Files.
However, using the Word format is very crude. I came upon NVU and with its Edit Site feature I was able to use the NVU HTML editor by pointing the NVU to the location "your_site\public_html\uploaddata\1". Located there were the public files listed under the Site Administration Front Page Site Files.
I hope this info is helpful to other Moodle site administrators.
Hi there. I'm not entirely sure how you mean to use NVU with Moodle - is it in terms of editing the Word documents or creating html files to use instead? I'd be interested in more explanation thanks as I like to learn Do be aware though, if you aren't already, that anything in directory 1 is publicly viewable and should therefore not contain anything secret to your institution. And - that it isn't advised to have the uploaddata folder within the public_html directory for similar security reasons. I don't know if you are with Siteground but I know they do - or used to - set their Moodles up that way. Might be worth moving it before your Moodle gets very much off the ground.
Do be aware though, if you aren't already, that anything in directory 1 is publicly viewable and should therefore not contain anything secret to your institution. And - that it isn't advised to have the uploaddata folder within the public_html directory for similar security reasons. I don't know if you are with Siteground but I know they do - or used to - set their Moodles up that way. Might be worth moving it before your Moodle gets very much off the ground.
Learned lots from your reply.
1. Our site is with Siteground and uploaddata folder is within the public_html directory. Thus files placed there are fully public. I have yet to learn how to organize my site contents as to its sensitivity and as public. Any advice on how to do this or is there a forum somewhere in moodle.org about this topic?
2. NVU is used to edit pages made with Word into HTML. My publishing skill is only Word level as of now and just learned doing HTML pages. These pages are fully public to all site users, thus anyone with a login account can do what they please to the files in folder 1. Although most site users have HTML literacy lower than me
Any advice or suggestion is very much welcome.
1. Our site is with Siteground and uploaddata folder is within the public_html directory. Thus files placed there are fully public. I have yet to learn how to organize my site contents as to its sensitivity and as public. Any advice on how to do this or is there a forum somewhere in moodle.org about this topic?
2. NVU is used to edit pages made with Word into HTML. My publishing skill is only Word level as of now and just learned doing HTML pages. These pages are fully public to all site users, thus anyone with a login account can do what they please to the files in folder 1. Although most site users have HTML literacy lower than me
Any advice or suggestion is very much welcome.
Hi there
Not sure where to start really - if you look on Using Moodle you will find lots of forum types for different questions , although the General Forum is a bit of a catch-all if you are not sure. The point of Moodle is that it is for teachers/educators with not much knowledge if any of html and therefore there should be no need for them to know or use any html editor like NVU. Once you have set up courses and have the editing turned on in that course there is an option " add a resource" "compose a webpage" where you can type WYSIWYG information with no html or web design program needed whatsoever. It is then saved as part of that course and, if the course is behind a login, should be safe from public view. (although in theory with your Siteground set up any documents uploaded could potentially be seen if someone knew or could guess the folder number) (I would ask Siteground to move your uploaddata directory and then alter the config.php to reflect that.)
Not sure where to start really - if you look on Using Moodle you will find lots of forum types for different questions , although the General Forum is a bit of a catch-all if you are not sure. The point of Moodle is that it is for teachers/educators with not much knowledge if any of html and therefore there should be no need for them to know or use any html editor like NVU. Once you have set up courses and have the editing turned on in that course there is an option " add a resource" "compose a webpage" where you can type WYSIWYG information with no html or web design program needed whatsoever. It is then saved as part of that course and, if the course is behind a login, should be safe from public view. (although in theory with your Siteground set up any documents uploaded could potentially be seen if someone knew or could guess the folder number) (I would ask Siteground to move your uploaddata directory and then alter the config.php to reflect that.)