Как установить HTML Редактор NicEdit

Установка NicEdit
image_pdfimage_print

Доброго времени суток, уважаемые читатели блога SoftMaker.kz. Сегодня я хочу рассказать о том, как установить HTML редактор NicEdit. После установки HTML редактора NicEdit вы с лёгкостью сможете редактировать страницы Вашего сайта напрямую из Вашего браузера (например, firefox). Если вы хотите скачать NicEdit перейдите на страницу со статьёй NicEdit — редактор расширенного текста. А в конце статьи вы можете познакомиться с бесплатным материалом по ускорению загрузки вашего сайта. Итак, поехали!

Чтобы установить NicEdit необходимо в любом месте Вашей веб-страницы прописать две строчки на JavaScript:

<script src="http://site.softmaker.kz/files/b>" type="text/javascript"></script>

<script type="text/javascript">
	bkLib.onDomLoaded(
		Вызов функций
	);
</script>

ПутьДоФайлаJS — Прописываем где лежит наш файл nicEdit.js.

Вызов функций — В этом месте происходит вызов функций, которые изменяют вид HTML редактора NicEdit.

 

Пример 1:

Если Вы хотите, чтобы все тэги textarea на странице Вашего сайта были преобразованы в редактор NicEdit, тогда нужно написать следующее:

<script type="text/javascript" src="http://site.softmaker.kz/files/b>"></script>

<script type="text/javascript"> 
	bkLib.onDomLoaded( 
		function() {
			nicEditors.allTextAreas() 
		} 	
	);
</script>

Выражение “src=»http://site.softmaker.kz/files/b>»” указывает на то, что файл nicEdit.js лежит в корневой директории на вашем сервере. Выражение “function() { nicEditors.allTextAreas() }” преобразует все тэги textarea на Вашей веб-странице в текстовый редактор NicEdit.

Пример 2:

Если нужно изменить только один тэг textarea, то можем написать:

<script src="http://site.softmaker.kz/files/NicEdit/nicEdit.js" type="text/javascript"></script>

<script type="text/javascript"> 
bkLib.onDomLoaded(
	function() {
		new nicEditor({
			fullPanel : true
		}
		).panelInstance("area1");
	}
); 

 <div>
	<textarea cols="50" id="area1"> 
	</textarea>
 </div>

Как видим для того, чтобы указать конкретный тэг textarea нужно указать в выражении:

function() {
	new nicEditor(
	{fullPanel : true}
	).panelInstance("area1");
}

название id тэга, в нашем случае это id=»area1«.

Пример 3:

Чтобы на одной странице разместить сразу несколько тэгов textarea с разными наборами кнопок нужно написать так:

Первый, одна кнопка:

<script src="http://site.softmaker.kz/files/NicEdit/nicEdit.js" type="text/javascript"></script> 

<script type="text/javascript">

bkLib.onDomLoaded( 
function() { 
	new nicEditor({
		buttonList : ['fontSize']
		}
	).panelInstance("area1");
}
);

<div>
	<textarea cols="50" id="area1"> 
	</textarea>
</div>

Второй, девять кнопок:

bkLib.onDomLoaded( 
function() {
new nicEditor({
	buttonList : 
	['fontSize','bold','italic','underline','strikeThrough',
	'subscript','superscript','html','image']
	}
	).panelInstance('area2'); 
}
);

<div>
	<textarea cols="50" id="area2"> 
	</textarea>
</div>

buttonList — это список указываемых Вами кнопок.

Как и обещал в начале статьи, хочу посоветовать один бесплатный авторский видеокурс, который поможет быстро оптимизировать ваш сайт и сделать его загрузку еще быстрее! Это курс от опытного вебмастера Бернацкого Андрея. Из этого практикума вы узнаете:
  • Как всего за пару часов залатать сайт и сделать его загрузку быстрее?
  • Как на реальных примерах применить его технологию оптимизации страниц?
  • Как моментально отслеживать, когда-какой-то плагин, движок или тема «замедляет» ваш сайт?
  • Какие существуют универсальные навыки, благодаря которым можно оптимизировать загрузку сайтов на любом движке?
  • Как оптимизировать тяжёлые и наименее поддающиеся оптимизации png-файлы без потери качества?
  • Как научиться снижать число http-запросов?
  • И еще многое другое...

В этом видеокурсе собрана самая важная информация о том, как благодаря трем простым настройкам получить скоростной сайт уже сегодня. Все что вам нужно уже собрано в одном бесплатном видеокурсе!

Бесплатный видеокурс по ускорению работы сайта


Этот блог читают уже много людей
- читай и ТЫ!

38 ответы
  1. Максим
    Максим says:

    Как то странно редактор работает…непутево…т.е. набранный текст в блоке администратора после его сохранения не совпадает уже на самой страничке сайте.

    Ответить
  2. Виктор
    Виктор says:

    У ворда другое фарматирование, из ворда в блокнот, потом из блокнота в редактор и форматируй

    Ответить
  3. Виктор
    Виктор says:

    Ворд создает свои таблицы стилей, которые не копируются, когда ты переносишь текст. Ссылки таблиц стилей остаются, а сами-то таблицы в ворде! А наш редактор чувствует, переносит вордовские стили, как и другие расширенные редакторы. Но нам не стоит брать стили ворда они тяжёлые и не практичные много мусора.

    Ответить
  4. Виктор
    Виктор says:

    В блокнот вставляешь, чтобы убралось вордовское форматирование, потом в блокноте выделяешь текст, копируешь и форматируешь в редакторе.

    Ответить
  5. Александр
    Александр says:

    Почему не отображаются не все иконки? Только форматирование текста.

    Ответить
  6. Александр
    Александр says:

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

    Ответить
  7. Softmaker
    Softmaker says:

    У меня была такая проблема, т.к. я неправильно указал пути, посмотри в файле .js параметр iconsPath : ‘../../files/HTML/NicEdit/nicEditorIcons.gif’.
    Также не мешало бы другие пути проверить.

    Ответить
  8. дима
    дима says:

    у меня такое тоже было. действительно проблема в неправильно указанном пути

    Ответить
  9. kompolina
    kompolina says:

    Мда… зря регистрировалась… Вы бы лучше сказали, как сделать так, чтобы эдитор отображался в одной файле (админке как бы), а выкладывал текст в другой файл. Т.е. заполнил в админке текст, а результат получил на главной сайта в определенном месте…

    Ответить
  10. Мария
    Мария says:

    Можно ли дописать скрипт, чтобы был выбор стиля написания (добавлялся бы тэг style="text1") в выпадающем меню типа "Font Size".
    Заранее спасибо за ответ.

    Ответить
  11. Алексей
    Алексей says:

    Єсть проблема!!! Програмирую на php. В базу MySql не заносит текст так как двойные кавычки призводят к ошыбке запроса Insert. Что делать? Подскажыте пожалуйста!!!!!!!!!!

    Ответить
  12. Softmaker
    Softmaker says:

    mysql_real_escape_string — мнемонизирует специальные символы в строке для использования в операторе SQL с учётом текущего набора символов/charset соединения.

    ?php
    $link = mysql_connect(‘localhost’, ‘mysql_user’, ‘mysql_password’);
    $item = "Zak’s and Derick’s Laptop";
    $escaped_item = mysql_real_escape_string($item);
    printf ("Escaped string: %s\n", $escaped_item);
    ?>

    На выводе:Escaped string: Zak\’s and Derick\’s Laptop

    Ответить
  13. Softmaker
    Softmaker says:

    Чтобы не было ошибки нужно мнемонизировать кавычки, т.е. перед этим специальным символом поставить "\" — обратный слэш.

    Ответить
  14. Softmaker
    Softmaker says:

    htmlspecialchars — подставляет мнемонические символы вместо знаков тегов и исполняемых выражений.

    Ответить
  15. Softmaker
    Softmaker says:

    Выполняются трансляции:

    ‘&’ (амперсанд) становится ‘&amp;’

    ‘"’ (double quote) становится ‘&quot;’ когда ENT_NOQUOTES не установлен

    »’ (single quote) становится ‘&#039;’, только когда установлен ENT_QUOTES.

    ‘<‘ (less than) становится ‘&lt;’

    ‘>’ (greater than) становится ‘&gt;’

    Пример 1. htmlspecialchars()
    $new = htmlspecialchars("<a href=’test’>Test</a>", ENT_QUOTES);

    Ответить
  16. Владимир
    Владимир says:

    Девочка-то вопрос по существу задала. Зря отшутились!
    Вставляю редактор в HTML страницу.
    Можно его использовать как редактор для комментариев? И как вывести/сохранить это потом на этой же или (как в ее случае) любой другой странице. Без .php просто чисто на HTML странице?
    Ну и размер окна… Кошмар, или админ в нормальном отписывается?

    Ответить
  17. Владимир
    Владимир says:

    Первый раз вижу, обновил страницу и опять Логин вводить надо!? Это уже у вас на сайте.

    Ответить
  18. bullDog
    bullDog says:

    Теряете читателей со своими "*Просмотр только для зарегистрированных посетителей!"

    Ответить
  19. Kirill
    Kirill says:

    Возможно форматировать текст, при копирование в textarea, текст с стилями с другого сайта?

    Ответить
  20. Олег
    Олег says:

    Здравствуйте, подскажите почему редактор NicEdit загружается только в firefox?

    Ответить
  21. Softmaker
    Softmaker says:

    Здравствуйте, Олег! Проверил в Хроме, работает, да и в Опере, насколько я знаю, тоже работает. Может неправильно установили?

    Ответить

Ответить

Want to join the discussion?
Feel free to contribute!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *