CKEditor 4
Tue, 05/15/2012 - 16:02
#1
sebstefanov
sebstefanov's picture
Joined: 03/02/2012
Posts: 1329

oEmbed Plugin

Hmmm, doesn't work. When I press "Ok" with code in the dialog nothing happens. When there's no code the dialog simply closes. It happens in all the newest browsers. I tested with Youtube, blip.tv and vimeo. Opera is kind enough to give me an error message when I click on the oEmbed icon and another when I press Ok (the other browsers simply don't do anything). Also, in FireFox the dimension text is misaligned and the code should be config.extraPlugins = 'oEmbed'; without brackets. Here's a screenshot of the Opera messages and FF dialog:

Attachments: 

Image icon FF Dialog
Image icon Opera when pressing Ok
Image icon Opera when pressing the oEmbed icon

Customer and Community Manager, CKSource
Follow us on: Facebook, Twitter, LinkedIn

If you think you found a bug in CKEditor, read this!

Top
Wed, 05/16/2012 - 15:27
sebstefanov
sebstefanov's picture
Joined: 03/02/2012
Posts: 1329

Re: oEmbed Plugin

Oh I tried every url on blip: page url, embed url, link url. In the error message the url doesn't appear. I even tried it on a live site, figuring maybe it doesn't work on a local host.

Customer and Community Manager, CKSource
Follow us on: Facebook, Twitter, LinkedIn

If you think you found a bug in CKEditor, read this!

Top
Thu, 05/17/2012 - 15:36
sebstefanov
sebstefanov's picture
Joined: 03/02/2012
Posts: 1329

Re: oEmbed Plugin

Awesome, it works! I'll reserve you a +1 for when we get the new site. ;)

Customer and Community Manager, CKSource
Follow us on: Facebook, Twitter, LinkedIn

If you think you found a bug in CKEditor, read this!

Top
Sat, 07/28/2012 - 13:06
uniterre
uniterre's picture
Joined: 16/07/2012
Posts: 12

Re: oEmbed Plugin

doesn't work on Internet explorer.

We have to remove comas after labels :
               }, {
                    type: 'hbox',
                    widths: ['50%', '50%'],
                    children: [{
                        type: 'text',
                        id: 'width',
                        'default': '560',
                        label: editor.lang.oEmbed.width[b],[/b]
                    }, {
                        type: 'text',
                        id: 'height',
                        'default': '315',
                        label: editor.lang.oEmbed.height[b],[/b]
                    }]



There is a bug with minWidth too.
I changed :
minWidth: CKEDITOR.env.ie && CKEDITOR.env.quirks ? 368 : 350,

by
minWidth: CKEDITOR.env.ie && CKEDITOR.env.quirks ? 568 : 550,
Top
Sun, 07/29/2012 - 11:05
zoey
zoey's picture
Joined: 29/08/2011
Posts: 10

Re: oEmbed Plugin

tha_watcha wrote:

Installation

1. Extract the contents of the file into the "plugins" folder of CKEditor.
2. In the CKEditor configuration file (config.js) add the following code:

config.extraPlugins = '[ oEmbed ]';
Please add step #3 to the Installation notes.

3. In the same CKEditor configuration file (config.js) add the 'oEmbed' in the toolbar, similar to the following example:
    { name: 'insert',      items : [ 'Image','oEmbed','Youtube','Video','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak' ] },

After following the directions and loading jquery on the editor page, this plugin menu loads and when entering a YouTube url and clicking OK, the box closes but there is no code updated in the editor. I'm using Chrome version 20x. I hope these notes are helpful in resolving this problem and making this plugin work with the major browsers.
Top
Tue, 07/31/2012 - 13:02
zoey
zoey's picture
Joined: 29/08/2011
Posts: 10

Re: oEmbed Plugin

tha_watcha wrote:Works perfectly for me in chrome and in other browser. It depends on which url you provide like http://www.youtube.com/watch?v=123456 or http://youtu.be/123456 are supported. If it still not working please take a look at the chrome javascript error log if there are any errors

Thank you for your reply, I appreciate it very much. I hope these notes help others in similar circumstances. Downloaded oEmbed1.03.zip, followed the directions, and also added the following in the <head>...</head> section of the CKEditor form page.

<script src="/jquery/jquery.min.js" type="text/javascript"></script>
<script src="/jquery/jquery.oembed.min.js" type="text/javascript"></script>
Result:

The oEmbed Plugin menu accepts the YouTube URL (including other sources) and closes. However, there is nothing on the editor box of the URL information, it's blank. Chrome version 20x, there are no errors in javascript. If there is any step I've missed, please clarify if this plugin works with the current CKEditor version: 3.6.3.

Top
Tue, 07/31/2012 - 15:00
project1
project1's picture
Joined: 31/07/2012
Posts: 1

Re: oEmbed Plugin

Does not work in IE 8 :(
After pressing OK button log error write: console is not defined at oEmbedDialog.js at line 32. How fix it?

Top
Thu, 08/02/2012 - 12:36
uniterre
uniterre's picture
Joined: 16/07/2012
Posts: 12

Re: oEmbed Plugin

same prb on IE : console is undefined
Top
Sat, 09/15/2012 - 11:33
brad000123
brad000123's picture
Joined: 15/09/2012
Posts: 1

Re: oEmbed Plugin

good work thanks , useful thread to start,
Top
Sun, 09/16/2012 - 08:07
ingo
ingo's picture
Joined: 16/09/2012
Posts: 6

Re: oEmbed Plugin

Updated Version now available

Description
This Plugin allows to insert embedded content (such as photos, videos, audio, and other rich media) via the OEmbed API. You only have to provide the url to the site (It works also when the url is shortened) you want to embed and the plugin does the rest.

Currently Supported Sites...

Video


  • Youtube - oembed - YQL

  • Blip - oEmbed

  • Hulu - oEmbed

  • Vimeo - oEmbed

  • National film board of Canada - oEmbed

  • Qik - oEmbed

  • Dotsub - oEmbed

  • Clikthrough - oEmbed

  • Kino Map - oEmbed

  • Funny Or Die - Embedded

  • College Humour - Embedded

  • Metacafe - Embedded

  • embedr - Embedded

  • 5min - oEmbed is XML only - using YQL to translate it

  • ustream.tv - oEmbed is not JSONP enabled - using YQL to translate it

  • viddler - OGP

  • twitvid - Embedded

  • bambuser - Embedded

  • xtranormal - Embedded

  • Gametrailers - Embedded

  • Vzarr - Embedded

  • VHX - oembed

  • bambuser - oembed

  • dailymotion.com - oembed

  • animoto - oembed

  • justin.tv - YQL JSON

  • livestream - OGP

  • scivee - embedded

  • veoh - embedded

  • minoto-video - oembed using YQL

  • TrailerAddict - OGP

  • vodpod - oembed YQL - broken as the oembed has absolute positioning which breaks the display

  • fora.tv -OGP YQL

  • TED - OGP YQL

  • Aniboom - embedded

  • Comedy Central - OGP

  • snotr - embedded

  • zapiks - OGP

  • youku - embedded

  • wistia - Oembed

Attachments: 

AttachmentSize
Package icon oEmbed Plugin for CKEditor 3.x21 KB
Package icon oEmbed Plugin for CKEditor 4.x20.99 KB
Top
Mon, 09/17/2012 - 10:49
sebstefanov
sebstefanov's picture
Joined: 03/02/2012
Posts: 1329

Re: oEmbed Plugin

If I did, I apologize. It's a fight to the death here: me vs. the spam bots. I guess you were caught in the crossfire. For some reason the system keeps flagging you.

Customer and Community Manager, CKSource
Follow us on: Facebook, Twitter, LinkedIn

If you think you found a bug in CKEditor, read this!

Top
Tue, 10/02/2012 - 07:21
uniterre
uniterre's picture
Joined: 16/07/2012
Posts: 12

Re: oEmbed Plugin

Hi,

Have you tested your plugin in Internet Explorer ? It doesn't work for me.
I saw little differences between the file you provided and this one : https://github.com/starfishmod/jquery-o ... .oembed.js

Regards,
Alexandre

Détails de l’erreur de la page Web

Agent utilisateur : Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET CLR 1.1.4322; .NET4.0C)
Horodateur : Tue, 2 Oct 2012 05:20:25 UTC

Message : Identificateur, chaîne ou nombre attendu
Ligne : 230
Caractère : 9
Code : 0
URI : /oEmbed/dialogs/jquery.oembed.js?t=C6HH5UF

Message : Cet objet ne gère pas cette propriété ou cette méthode
Ligne : 30
Caractère : 6
Code : 0
URI : oEmbed/dialogs/oEmbedDialog.js?t=C6HH5UF

Attachments: 

AttachmentSize
Image icon bug_1.png36.16 KB
Top
Tue, 10/02/2012 - 08:39
uniterre
uniterre's picture
Joined: 16/07/2012
Posts: 12

Re: oEmbed Plugin

well, I remove the comments for 2 lines :
error: settings.onError.call(container, externalUrl, embedProvider)

and it works on IE

Why ?
Top
Wed, 10/03/2012 - 05:14
ingo
ingo's picture
Joined: 16/09/2012
Posts: 6

Re: oEmbed Plugin

uniterre wrote:well, I remove the comments for 2 lines :
error: settings.onError.call(container, externalUrl, embedProvider)

and it works on IE

Why ?


Well if it works with that code i re-add that code.
Top
Wed, 10/10/2012 - 18:13
cosmonaut
cosmonaut's picture
Joined: 12/09/2012
Posts: 7

Re: oEmbed Plugin

When I paste in a youtube URL like:
http://www.youtube.com/watch?feature=pl ... tXtSGRV0xc

(note v= param is at the END of URL)

nothing happens in FF or chrome.

In IE, I get this error:
Unable to get the value of the property 'json': object is null or undefined
jquery.oembed.js
line: 444
char: 6

- - - - - - - - - - - - - -

Unfortunately, this URL format is quite common.

Top
Sun, 10/14/2012 - 08:09
ingo
ingo's picture
Joined: 16/09/2012
Posts: 6

Re: oEmbed Plugin

cosmonaut wrote:When I paste in a youtube URL like:
http://www.youtube.com/watch?feature=pl ... tXtSGRV0xc

(note v= param is at the END of URL)

nothing happens in FF or chrome.

In IE, I get this error:
Unable to get the value of the property 'json': object is null or undefined
jquery.oembed.js
line: 444
char: 6

- - - - - - - - - - - - - -

Unfortunately, this URL format is quite common.

Top
Sat, 10/27/2012 - 13:27
inmarelibero
inmarelibero's picture
Joined: 27/10/2012
Posts: 1

Re: oEmbed Plugin

Hi, I'm experiencing the following problem:

I loaded correctly oEmbed plugin for CKEditor 3.x, but when I try to embed

http://www.youtube.com/watch?v=IlHRSpFGtQk

Top
Tue, 03/12/2013 - 09:32
buzoganylaszlo
buzoganylaszlo's picture
Joined: 11/03/2013
Posts: 3

CKEditor 4.1 OEmbed fix

The current version (4.0) of the OEmbed plugin is not compatible with CKEditor 4.1, thwors an error of Uncaught TypeError: Cannot read property 'isBlock' of undefined. The fix is really easy. In the ombed plugin directory find the plugin.js and change the following rows

editorInstance.insertHtml(editor.config.oembed_WrapperClass != null ? '<div class="' + editor.config.oembed_WrapperClass + '" />' : '<div />');
editorInstance.insertHtml(e.code);

to

editorInstance.insertHtml(editor.config.oembed_Wrapper != null ? $('<div>').append($(editor.config.oembed_Wrapper).append(e.code)).html() : e.code);

From now on instead of specifying a wrapper class like

config.oembed_WrapperClass = 'embededContent';

specify any wrapping tag with additional attributes and/or styles, like

config.oembed_Wrapper = '<p style="text-align:center">';

And that's all.

Top
Twitter Facebook Facebook Instagram Medium Linkedin GitHub Arrow down Phone Menu Close icon Check