Простая загрузка файла CKEditor

Question

Я пытаюсь загрузить файл CKEditor на мою страницу, но я не совсем уверен, как это сделать.Я скачал плагин CKEditor и добавил его на свою страницу.Теперь у меня есть экран загрузки со всеми видами вещей, которые вам нужно заполнить. Он нужен мне только для того, чтобы просматривать ваши фотографии и использовать их.

Мой код CKEditor на моей странице:

<div class="box box-info">
  <div class="box-header">
    <h3 class="box-title">CK Editor <small>Advanced and full of features</small></h3>
    <!-- tools box -->
    <div class="pull-right box-tools">
       <button class="btn btn-info btn-sm" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
       <button class="btn btn-info btn-sm" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
    </div><!-- /. tools -->
  </div><!-- /.box-header -->
  <div class="box-body pad">
    <form>
      <textarea id="editor1" name="editor1" rows="1" cols="80">
                        This is my textarea to be replaced with CKEditor.
      </textarea>
    </form>
  </div>
</div><!-- /.box --> 

<!-- CK Editor -->
<script type="text/javascript" src="/assets/plugins/ckeditor/ckeditor.js"></script>
<script>CKEDITOR.dtd.$removeEmpty['span'] = false; CKEDITOR.dtd.$removeEmpty['i'] = false;</script>
<script>CKEDITOR.env.isCompatible = true;</script>

<script type="text/javascript">
  CKEDITOR.replace( 'editor1',
  {
     customConfig: '/assets/plugins/ckeditor/config.js',
     filebrowserBrowseUrl : '/assets/plugins/ckeditor/plugins/browser/browse.php',
     enterMode : CKEDITOR.ENTER_BR
  });
</script>

как выглядит мой конфигурационный файл:

CKEDITOR.editorConfig = function( config ) {
 config.filebrowserUploadUrl = '/uploader/upload.php';
    config.toolbar = [
        { name: 'insert', items: ['Smiley'] },
        { name: 'basicstyles', items: [ 'Bold', 'Italic', 'Underline' ] },
        { name: 'links', items: [ 'Image' ]  }          
    ];

    config.autoParagraph = false;
    config.allowedContent = true;
    config.fullPage = false;    
    config.extraAllowedContent = 'p(*)[*]{*};span(*)[*]{*};div(*)[*]{*};li(*)[*]{*};ul(*)[*]{*}';

    config.extraPlugins = 'youtube,ckawesome';
    config.fontawesomePath = 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css';

    config.contentsCss = ['https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css','https://app.gratiswebshopbeginnen.nl/assets/bootstrap/css/bootstrap.min.css'];

    // Se the most common block elements.
    config.format_tags = 'p;h1;h2;h3;pre';

    // Make dialogs simpler.
    //config.removeDialogTabs = 'image:advanced;link:advanced';
};

Answer 1

Загрузка пользователей Изображение с CKEditor

<textarea id="editor1" name="editor1" rows="1" cols="80">
            This is my textarea to be replaced with CKEditor.
</textarea>

<script src="../ckeditor.js"></script>

<script type="text/javascript">
CKEDITOR.replace( 'editor1' );
</script>

Итак, из приведенного выше кода мы понимаем,

1. Мы используем файл ckeditor.js
2. и Initiatingckeditor

Эти настройки покажут ckeditor.Кроме того, для загрузки изображения нам нужны еще один параметр

Откройте файл config.js (/ckeditor/config.js) и поместите следующий код

config.filebrowserUploadUrl = '/ uploader/upload.php';

Итак, файл config.js должен выглядеть следующим образом

CKEDITOR.editorConfig = function( config ) {
     config.filebrowserUploadUrl = '/uploader/upload.php';
};

Итак, при загрузке файла upload.php загруженный файл будет в состоянии перехватить, здесь выможет иметь свой собственный php-код для хранения загруженного файла на ваш сервер

Итак, когда эти настройки сработают, экран загрузки будет выглядеть следующим образом