BUEditor. Доводка напильником

Главные вкладки

Аватар пользователя Anton L. Safin Anton L. Safin 27 февраля 2010 в 12:42

BUEditor - хороший редактор, но даже он требует определенной настройки. Итак, по пунктам:

  1. Устанавливаем модуль [module=BUEditor]. Ну, тут никаких проблем.
  2. Устанавливаем [module=IMCE] (по желанию).
  3. Устанавливаем красивые кнопочки. Все по инструкции, но не забываем сначала удалить старые кнопки.
  4. Прописываем в настройках формата ввода Filtered HTML следующий список разрешенных тэгов:
    <p> <br> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <div> <h1> <h2> <h3> <h4> <strike> <blockquote>
  5. Меняем код кнопки Insert Image на такой (для выбора вариантов выравнивания изображения):
    js:
    var B = eDefBrowseButton('/?q=imce/browse', 'attr_src', 'Browse', 'image');
    var form = [
     {name: 'src', title: 'Адрес изображения', suffix: B},
     {name: 'width', title: 'Ширина x Высота', suffix: ' x ', getnext: true, attributes: {size: 3}},
     {name: 'height', attributes: {size: 3}},
     {name: 'class', title: 'Выравнивание', type: 'select', options: {'align-c' : 'По центру', 'align-l' : 'По левому краю', 'align-r' : 'По правому краю', 'float-l' : 'В тексте - слева', 'float-r' : 'В тексте - справа'}},
     {name: 'title', title: 'Описание'},
     {name: 'alt', title: 'Альтернативный текст'}
    ];
    eDefTagDialog('img', form, 'Вставить/Редактировать изображение', 'Вставить');
  6. Вставляем в style.css используемой темы вот такой фрагмент (для выравнивания текста и измененной нами кнопки вставки изображений):
    /* BuEditor
    -----------------------------------*/

    div.editor-right-button {
      text-align:right;
    }

    div.editor-left-button {
      text-align:left;
    }

    div.editor-center-button {
      text-align:center;
    }

    div.editor-justify-button {
      text-align:justify;
    }

    .align-c {
      display: block;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }
     
    .align-r {
    display: block;
    text-align: right;
    margin-left: auto;
    }
     
    .align-l {
      display: block;
      text-align: left;
    }
     
    .align-j {
      display: block;
      text-align: justify;
    }
     
    .float-l {
      display: inline;
      float: left;
    }
     
    .float-r, .imagecache-200px-right {
      display: inline;
      float: right;
    }
     
    img.float-l, img.float-r, img.imagecache-150px-right {
      margin: 10px;
    }

  7. Последний штрих - прописываем редактор в качестве дефолтного для нужных групп пользователей на странице/admin/settings/bueditor.

Комментарии

Аватар пользователя VasyOK VasyOK 27 февраля 2010 в 13:28

А точто вы ссылку приводите для Drupal 5 ниче? В 6-й версии тоже самое?

При желаниии BUEditor нужно допиливать и допиливать.

Не мешало бы еще смайлы добавить. И загрузкуи изображений в один клик. Заставлять пользователей пользоватся IMCE не очень эргономично.

Аватар пользователя Anton L. Safin Anton L. Safin 27 февраля 2010 в 21:13

"VasyOK" wrote:
А точто вы ссылку приводите для Drupal 5 ниче? В 6-й версии тоже самое?

Да, эти кнопочки подходят и для шестого Друпала - проверено.

"VasyOK" wrote:
И загрузкуи изображений в один клик. Заставлять пользователей пользоватся IMCE не очень эргономично.

Согласен. Я испробовал несколько вариантов, пока остановился на связке [module=imagefield] (CCK) + [module=Insert] + (по желанию) [module=ImageCache]. Вставка, конечно, не в один клик, а в два, но все же лучше, чем IMCE - плюс можно сразу вставлять изображение, обработанное ImageCache. Пожалуй, единственный минус - нельзя при вставке сразу задавать выравнивание для изображения (float). Insert, что ли, подкрутить...

Аватар пользователя wolfXXXL wolfXXXL 1 марта 2010 в 10:59

Вам нужно зайти на страницу ваш_сайт/admin/settings/bueditor, выбрать изменить в профиле который вы используете, и на открывшейся странице добавить необходимые кнопки по аналогии с имеющимися.
В Вашем случаи:
Название кн1: Длинное тире кн2: Кавычки
Содержимое кн1: – (просто длинное тире как оно есть) кн2: "%TEXT%"
Значок выберите или добавьте свою иконку
Клавиша на Ваше усмотрение
Вес на Ваше усмотрение
Из-за разности перевода названия могут чуть отличаться, порядок думаю нет

Аватар пользователя samosyn samosyn 28 сентября 2012 в 15:04

Все прекрасно, спасибо! Только при выравнивании картинки "по краям" она "слепляется" с текстом, нет никакого расстояния между ней и текстом. Как это можно доработать? Пробовал править кусок того CSS что приведен выше (вставлять padding и подобное)- видимо не так или не в том месте )) Я практически нулёвый в вебе, подскажите плз, как допилить этот момент?
Drupal 6, если это имеет значение.

Спасибо.

Аватар пользователя samosyn samosyn 28 сентября 2012 в 20:42

"xSPiRiTx" wrote:
у изображений margin задай

я думал нижеследующие строки как раз задают margin у изображений (при выравнивании):

img.float-l, img.float-r, img.imagecache-150px-right {
margin: 10px;
}

Если нет, то как их задать для изображений?