We Keep Coding

Youtube plugin can't be added to my ckeditor

I have ckeditor library
$(function () {
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace('editor1');
//bootstrap WYSIHTML5 - text editor
})
And I wanted to add YouTube plugin to it.
I downloaded the file from the official site and extract it inot plugins folder in ckeditor and the config.js file is:
/**
* #license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.md or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.config
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'links' },
{ name: 'insert' },
{ name: 'forms' },
{ name: 'tools' },
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'about' },
{ name: 'youtube' }
];
config.allowedContent = true;
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Underline,Subscript,Superscript';
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3;pre';
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
config.extraPlugins = 'youtube';
};
But it doesn't work.
And I tried other plugins and didn't work neither.

config.extraPlugins = 'Audio'; not working in ckedtior

I want add plugins audio html 5 and video html 5
but
code (config.extraPlugins) not working in ckedtior
code (config.extraPlugins) when writing in file config Disappear toolbar all and not working
enter image description here
but delelet code (config.extraPlugins) showing up toolbar and working
enter image description here
CKEDITOR.editorConfig = function( config ) {
config.extraPlugins = 'Audio';
config.extraPlugins = 'html5video';
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.configuration
config.language = 'en';
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'links' },
{ name: 'insert' },
{ name: 'forms' },
{ name: 'tools' },
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'about' }
];
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Underline,Subscript,Superscript';
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3;pre';
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
config.filebrowserBrowseUrl = 'ckeditor/kcfinder/browse.php?opener=ckeditor&type=files';
config.filebrowserImageBrowseUrl = 'ckeditor/kcfinder/browse.php?opener=ckeditor&type=images';
config.filebrowserFlashBrowseUrl = 'ckeditor/kcfinder/browse.php?opener=ckeditor&type=flash';
config.filebrowserUploadUrl = 'ckeditor/kcfinder/upload.php?opener=ckeditor&type=files';
config.filebrowserImageUploadUrl = 'ckeditor/kcfinder/upload.php?opener=ckeditor&type=images';
config.filebrowserFlashUploadUrl = 'ckeditor/kcfinder/upload.php?opener=ckeditor&type=flash';
};

You should use config.extraPlugins only once, otherwise you're overwriting the declaration. If you are going to add more than one extra plugin, the extraPlugins option expects a list of comma separated plugins. In your case it should be:
config.extraPlugins = 'Audio,html5video';
CKEditor's documentation: https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_config.html#cfg-extraPlugins

The ckeditor toolbar missing

I made a custom ckeditor but I had all the basic things plus a few more. I've been trying to use ckeditor and tried both by both replacing textarea element by class name and by javascript code, but in both situations, all I get in my textarea is
My code for it is here:
{{ Form::textarea('LONG_DESCRIPTION', $article->LONG_DESCRIPTION, ['class' => 'edito', 'id'=>'editor1']) }}
<script src="/*****/vendor/ckeditor/ckeditor.js"></script>
<script>
CKEDITOR.replace('editor1',
{
toolbar: 'MyToolbar'
});
</script>
And this is the config file just in case:
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.toolbar = 'MyToolbar';
config.toolbar_MyToolbar =
[
{ name: 'document', items : [ 'NewPage','Preview' ] },
{ name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
{ name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','Scayt' ] },
{ name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'
,'Iframe' ] },
'/',
{ name: 'styles', items : [ 'Styles','Format' ] },
{ name: 'basicstyles', items : [ 'Bold','Italic','Strike','-','RemoveFormat' ] },
{ name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote' ] },
{ name: 'links', items : [ 'Link','Unlink','Anchor' ] },
{ name: 'tools', items : [ 'Maximize','-','About' ] }
];
};
What am I doing wrong or have wrong for it not to work and just appear as that in the image?

CKeditor adding class to img tag

I am trying to add a class to any inserted img tag in CKeditor. I have tried various ways but can't seem to figure out how the setting of this plugin works. Whilst there are tonnes of documents, it only mentions that a code needs to be added, but not where it should be added, there are loads of files.
I tried adding it to the bottom on config.js
/**
* #license Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.md or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.config
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'links' },
{ name: 'insert' },
{ name: 'forms' },
{ name: 'tools' },
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'about' }
];
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Underline,Subscript,Superscript';
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3;pre';
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
config.extraPlugins = 'confighelper';
config.stylesSet = 'my_styles';
};
CKEDITOR.stylesSet.add( 'my_styles', [
{ name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }}
]);
That didn't work
So I tried adding it to the actual html page
<script>
CKEDITOR.stylesSet.add( 'my_styles', [
{ name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }}
]);
</script>
That didn't work either
Reading their docs I can't make any sense of it http://docs.ckeditor.com/#!/guide/dev_howtos_styles
How does one add a class to any img tags added through the editor?

I'm not using CKEDITOR, but the problem could be, that the stylesSet is not declared on CKEDITOR call, since its defined later.
Try moving CKEDITOR.stylesSet.add prior to editorConfig.
Alternatively put your styles into the first code block:
CKEDITOR.editorConfig = function( config ) {
...
...
config.stylesSet = [
{ name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }}
];
};
</script>
There are also some more Docs about the usage http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-stylesSet

Why is the list showing no elements in sencha touch 2?

I am very much beginner to Sencha Touch. I want to display a static list to the screen. The code I tried is from sencha docs guides 'using list'. However, blank screen appears when compiled and run. Do I have to add the list to the Viewport? What am I missing? Please help.
My code is:
Ext.application({
launch: function () {
Ext.create('Ext.List', {
store: {
fields: ['name'],
data: [
{ name: 'A' },
{ name: 'B' },
{ name: 'C' },
{ name: 'D' }
]
},
itemTpl: '{name}'
});
}
});

May be this one help you
Ext.create('Ext.List', {
fullscreen: true,
itemTpl: '{title}',
data: [
{ title: 'Item 1' },
{ title: 'Item 2' },
{ title: 'Item 3' },
{ title: 'Item 4' }
]
});

Sorry! My bad. I made it with a little bit of work.
I just did this:
launch: function() {
var list = Ext.Create('Ext.List',{..
.....
.....
itemTpl = '{name}'
});
Ext.Viewport.add(list);
}