Training and Development for Drupal

Wysiwyg + CKEditor Screencast

FAIL (the browser should render some flash content, not this).

If you like this screencast, you can show it by pitching in to a special fundraising effort. (And here's why.)

Drupal website developers are often called upon to help website users easily format text when they create new pages or nodes. HTML is the preferred way to format text but users don't always have proficiency with the markup language and sometimes prefer to have an interface that formats their HTML language for them - not unlike the formatting buttons in Microsoft Word.

This screencast covers one method of adding easy HTML formatting to your Drupal website with the Wysiwyg module and the open source editor tool called CKEditor. To make the best use of this screencast, you should have basic knowledge of Drupal 7 site configuration including how to create content and edit content and how to install new modules.

Comments

I have recently come across a new racing game for android, it's called Real Race: Asphalt Road Racing and it seems to be almost like a simulator with casual feel.
It has some really state-of-the-art AI and I've played already 6 times in a row or so and it is still enjoyable and engaging. It is kinda fresh to race and defeat other players on six or so tracks. Game feels like race with GT cars like race or dodge viper. Racing through deserts and grasslands, avenues and highways, it is like Need for Speed Carbon or Most Wanted, and actually the latest part, NFS: Rivals Underground. There are no chases with the police, but I suppose it's good though as multiplayer asphalt feature grants great occasion to prove your unsurpassed underground drag racing skills.
On-screen great velocity forces an illusion of actually being there and racing with top drivers as seen on TV. Adrenaline spikes are numerous.

On a scale of 1 to 10 I would give it, without doubt, eight. List of features is almost overwhelming, so is its replayability. Besting the leaderboards trully entangles you and you are instantly pulled in. It really reminds me of Asphalt Overdrive. Overall it is a good, challenging free game.

Yes! Finally someone writes about kik for pc windows.

Funny animal and his funny tale that educates about saving the planet and nature. Interactive tale for kids, goat in the mountain in peril. Simple style to learn reading by having the tale spoken by the narrator. Only your toddlers can save him while practicing reading. It is a storytelling interactive tale about a goat, simulator of listening to a narrator telling the story to thine children. Anyones kids shall love it. Cute graphics to have fun with and teach. Learning apps which is child proof because of the lack of privacy forms. Interactive storytelling experience with animals for children and babies. Educational tale adventure for your 6 year old children who certainly love animals. 4 year old children shall like it, storybook, and also will every other kids which knows how to drag his hand on the screen. Easy to play and fun to get in contact with nature.

My mind was blown when I've first seen this sweet piece of action. Become a frontline commando with your pistol blazing, or snipe the undead monsters from huge distances. Witnessing uncountable zombie bugs dead, trigger constantly twitching as I was shooting my shadowgun and tossing explosives around. All using only your mobile screen. Freshest mobile game from a top of the line game studio, presenting such magnificent and wondrous baddies that I'm still stunned and consternated.
Our bulletproof vest gets to be personalized which is the only thing that lets us continue even further into this sci-fi nightmare.
Only the best exploits of modern warfare mixed with an itchy trigger finger will allow you to succeed over the dead bugs. Awesome graphics encourage you to follow your call of duty. Combat in modern style your fear when traversing future human locations and shooting your shadowgun, become the ultimate mobile frontline commando, killing millions like an android.
Quiet and strong main character reminded me of the old Doom PC game, though Combat Trigger: Modern Dead 3D has many additional gameplay features.
Best game ever! Modern warfare gets blended with dark and depressed sci-fi, where shadowgun exploration gave us only ineffable horror of having Earth infested by dead zombie bugs. Billions of them, actually. All hungry for our lives and our goods! Cool ego shooter, hard waffen, wow.

Great, thanks very much

Thank you for the video - very helpful!
However:
ckeditor 4.0.3 did not work...in the configuration, it did not recognize the library, said it was not installed
ckeditor 3.6.6.1 worked like a charm :)

Hi,
Thank you for the video.
On drupal's module page the developers said the module Wysiwyg is under active maintenance and it works without other/additional modules.
I've downloaded the Wysisyg and when I went to configure it ... mamma mia!
I need to download other 10 modules but "Do NOT download the "CKEditor for Drupal" edition."
I'm with drupal only 3 days, I know I don't understand a lot, but that is a bit confusing, isn't it?
Some ideas, please? :)
Thank you!
Polly

Thank you so much

Ckeditor 4 having some problem its not work but when i use old version its work charms

same problem here, the installation goes right but the button doesn't appears no matter what setting I've choosen

Great video, I tried a few times to set this up with installation issues.
You have simplified it.

Thank you!

Great tutorial.

Mine wasn't working correctly as I'd installed ckeditor as a module, instead of within the /all/libraries directory. Yes, I know, read the directions. But sometimes there's a ton of directional text and the key stuff is just one line. If you miss it... you're done.

By following your stuff carefully, it became really obvious what the problem was. And meanwhile, showed me a little more about how the file system is structured.

Thanks,
Scott

thanks for guide it's so usefull

I do consider all the concepts you have introduced in your post.
They are very convincing and can certainly work.
Still, the posts are too short for beginners. May just you
please prolong them a little from subsequent time?
Thank you for the post.

My web blog ... Chante

Fantastic tutorial. I'm just picking up Drupal.Learning with you couldn't be easier, thanks!

there are some bug with drupal 7.12+wysiwyg+tinymce3.5

1. when i change text format from tinymce to other, the textarea in body not change. still be tinymce.

2. when i click on disable rich-text, nothing happen. and when i click on enable rich-text there are more same buttons appears on tinymce toolbar.

It truly is the bomb. Does not work. Now I have NO ABILITY to edit at all. It destroys the edit block altogether.

This video needs to be updated. This editor does NOT work as described in the video.

Configure editor does show up in the the WYSIWYG config.
Everything seems to go according to plan. BUT is does not work and destroys the ability to edit anything on a page or an article.

There is no date on the video so it must be way out of date.

Please note that the display of CKEditor can be sensitive to other settings.
At least to the setting 'Add scripts to bottom of the page'. (An extra setting of the Zentropy-theme.)
If enabled, CKEDitor will not be available in an edit-mode of a node, even though all WYSIWYG settings are configured correctly.
If disabled, CKEditor works as it should.

Well, great screencast. I used it to check I had done all the steps to enable the editor. I did...but no editor shows up.

I do consider all of the concepts you have offered to your post.

They're really convincing and will definitely work. Still, the posts are very quick for newbies.

Could you please lengthen them a bit from next time? Thank you for the post.

Thank's Sean... a big help! Cheers, John W.

"FAIL (the browser should render some flash content, not this). "

That is what is displayed instead of the screencast :(

Firefox 8, Win 7. Happens on every video on your site.

Hi, Thanks for the vid.
When I choose the font style, or size it makes the change in the wisiwig view but after I hit save the change is NOT visible. What am I missing?

Thanks

Thank you! Your videos are concise and easy to follow.

Thanks for that. I was expecting to see the editor options here in this comment box. That would have really topped it off!

I think that it is really great video tutorial. Thank you :)

Thanx for the clear explanation. No i can get started integrating an WYSIWYG editor into my Drupal project.
And great music!!!

Great tutorial. Please add more, I like to see one about drush

i don't see the body table,maybe me pc is to slow.help

Thanks a lot for the video, it makes us beginners to learn much faster and easier. Thanks again! :)

Small typo in the title "Text Formatting is the Bomb" should be "Text Formatting is Da Bomb".

Thanks for the tutorial :)

Small typo in the title "Text Formatting is the Bomb" should be "Text Formatting is Da Bomb".

Thanks for the tutorial :)

This is prefect. Exactly what I am looking for :) Thanks Man!

this is great work here,, thanks for lots of usefull screensort...

Thank you for this great video

I have a question to ask
I have enabled CKEditor in my Drupal7, but it is not enabled by default for custom fields like textarea.
I would be very thankful if you can suggest any thing that would help in displaying CKEditor for custom fields in Drupal7.

Thanks in advance

Great job Sean! I followed along in a separate browser window, and it worked flawlessly. I would like to see a good solution for including inline images into the text area. That seems to be the missing link to making Drupal editing more user friendly like the Wordpress editor.

Best regards,
Richard Gandy

very cool. i tried it with drupal 7 and ckeditor 3.6 and there was a little problem, but it was easily fixed.

So glad I found your screencasts! They have been such a huge help. Thanks!

Can you tell me what advantages there are with using the CKEditor library in conjunction with the WYSIWIG module as apposed to using the CKEditor module specifically in performance (server and browser load), quality of markup, and compatability with other modules and scripts?

Great question! I would love to know the answer.

As always your presentation was great. Thank you.

Thanks for the great videos! Very useful introduction to Drupal 7. I was wondering about your choice of CKEditor among all the options you have with the WYSIWIG module. Do you have a strong preference for this over the others? (In particular I'm wondering how it compares to TinyMCE.)

Thanks again!

Many thanks Sean

Very helpful, thanks dude!

Post new comment

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

More information about formatting options

Most Recent Screencast

See video

Support the Association