Php html редактор html


лучшие инструменты для написания кода

Одной из стремительно развивающихся отраслей ИТ-индустрии является веб-программирование.

Наша статья ориентирована, прежде всего, на новичков, которые только начинают делать свои первые шаги в области веб-программирования и ищут наиболее подходящий HTML-редактор для написания кода.

Содержание:

Некоторые из представленных в обзоре редакторов, несмотря на базовую поддержку HTML\CSS, поддерживают возможность работы с более чем 20-ю языками программирования и являются скорее мультифункциональными комбайнами, нежели HTML-редакторами в классическом понимании этого термина.

Важно! По большему счету, для написания HTML-кода достаточно стандартного блокнота Windows (Notepad). Но если вы хотите получить максимум функциональности и удобства при работе с HTML-кодом, все же рекомендуем позаботиться об установке HTML-редактора.

HTML-редактор – программа, с помощью которой можно создавать и изменять HTML-страницы. По функциональному признаку HTML-редакторы, можно разделить на 2 категории:

  1. Редакторы, которые показывают только исходный код. Данные редакторы появились несколько раньше, чем редакторы второй категории и предлагают более гибкие возможности и более точные результаты.

  2. Редакторы, которые показывают готовую страницу в режиме WYSIWYG (от англ. What You See Is What You Get, «что вы видите, то вы и получаете»).Отметим, что большинство WYSIWYG-редакторов позволяют одновременно работать и с кодом страницы в том числе. Данный тип редакторов подойдет людям, у которых нет времени и возможность изучать основы HTML.

CKEditor – WYSIWYG – редактор, доступный в платной и бесплатных версиях. Особенность данного редактора заключается в сравнительно малом размере и отсутствии необходимости установки на стороне клиента.

Программа интегрирована с большинством современных языков – ASP, ASP.Net, Java, JavaScript, Perl, PHP, Python, Ruby и с системами управления содержимым – Drupal, Plone.

Для ознакомления с функционалом утилита существует демо-версия, доступная на официальном сайте в соответствующем разделе.

Краткий алгоритм установки редактора на сайт.

Первое, что необходимо сделать – это скачать последнюю версию (можно здесь), там же можно выбрать одну из версий (минимальная, стандартная, полная) и язык интерфейса. Распаковываем архив с редактором и загружаем содержимое каталога в корневую директорию сайта или CMS.

В коде страницы, следует загрузить основной код и вставить элемент textаreа, после чего следует выполнить инициализацию (рекомендуем делать после того, как объектная модель документа будет готова).

К достоинствам программы следует отнести отсутствие платы за утилиту, поддержку русскоязычного интерфейса, довольно широкий функционал, который можно наращивать в зависимости от потребностей разработчика (благодаря использованию плагиновой архитектуры), сохранение чистого HTML-кода.

вернуться к меню ↑

Бесплатный online-редактор, поддерживающий работу с HTML, CSS и JavaScript. Для работы с редактором нет надобности в регистрации и приступать к написанию кода можно без промедлений.

Спартанский дизайн ресурса предусматривает написание кода в левой колонке, тогда как в правой можно наблюдать за результатами своей работы (после нажатия кнопки Render, выполняется преобразование кода в HTML-страницу), что довольно удобно, т. к. для просмотра результатов нет необходимости в переключении между вкладками.

Раздел «Examples» содержит примеры базовых HTML-конструкций кода поддерживаемых языков программирования.

вернуться к меню ↑

Текстовый веб-редактор для работы с HTML, CSS и JS-кодом, который позволяет написать или сделать хорошо читаемым (форматированным) уже имеющийся код. Имеет подсветку синтаксиса, что делает его более удобным для работы, нежели стандартный блокнот Windows.

Для упорядочивания кода необходимо вставить его в главное окно сервиса и нажать кнопку «Clean».

вернуться к меню ↑

Как видно из названия, данный ресурс является интегрированной средой разработки (IDE, от англ. Integrated development environment) созданной по модели облачных вычислений.

Помимо поддержки распространенных HTML, CSS, JavaScript, PHP, Python, Perl, Ruby среда имеет поддержку 20 других языков программирования.

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

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

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

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

вернуться к меню ↑

Интегрированная среда разработки ShiftEdit является упрощенным аналогом Cloud9IdE, помимо функциональной разницы, также присутствует разница в цене — 6 долларов в месяц. К основным возможностям среды ShiftEdit следует отнести возможность:

Редактор поддерживает:

В платной версии программы есть возможность ведения неограниченного количества проектов, импорт проектов из Dreamweaver, хронологический откат изменений с возможностью просмотра истории, email-поддержка пользователей ресурса.

geek-nose.com

Бесплатный редактор html | Notepad++

В ряду полезных программ для вебмастера бесплатный редактор html и php Notepad++ занимает почетное место. Что из себя представляет Notepad++?

Всем привет! Сегодня я расскажу о программе, без которой не обходится ни один вебмастер. Это бесплатный редактор html  и php Notepad++. Конечно, конкретно без Notepad++ некоторые вебмастера и обходятся, но без текстового редактора html  и php (платного или бесплатного) – нет. Многие используют другой подобный софт, например, тот же WordPad. Продвинутые используют для редактирования html и php файлов обычный Блокнот (Notepage), имеющийся практически на всех компьютерах. Кстати, сходство в названии заметили? 🙂

Но по мне, так Notepad++ реально удобен и сильно облегчает жизнь начинающим вебмастерам. Так сказать, БлогМонет.ру рекомендует…

К слову сказаь, если вам интересна тематика моего блога, вы находите здесь полезную информацию, советую подписаться на новые статьи: к вам на почту или по rss (чтотакое rss) будут приходить уведомления с анонсами моих новых статей.

 

Загрузка и установка Notepad++

Давайте я сначала расскажу, как установить Notepad++, а уж потом поведаю, какой он хороший и как работает 🙂

Надеюсь, WordPress на свой компьютер вы уже установили. Если не знаете, как это сделать, читайте мою статью Установка WordPress на локальный компьютер. Но, если вы не устанавливаете блог сразу на хотинг, а хотите обкатать его «в домашних условиях», на своем компьютере, тогда вам предварительно нужно установить Denver. Об этом я тоже писал — в статье Как установить Денвер новичку? Кто не знает, что это такое, читайте здесь.

Вернемся к теме статьи. На первых порах текстовой редактор нужен вебмастеру для того, чтобы менять дизайн своего блога, подстраивать его под себя.

Я уже сказал, что Notepad++ это бесплатный редактор html и php и других языков. А скачать его можно с официального сайта здесь http://notepad-plus-plus.org

 

А так как это официальный сайт редактора Notepage++, традиционных интернет-подвохов (ключ, кряк, смс, номер телефона и пр.) можно не бояться.

Сайт на английском языке, поэтому, кто не силен в нем, немного расскажу, что там. Если честно, то я тоже не дружу с буржуйским языком, но для этого поста посидел со словарем, разбираясь, что на том сайте есть интересного. Поэтому, если вам жаль своего времени, воспользуйтесь моими пояснениями.

Справа в колонке выбираем «download» (скачать). На открывшейся странице можно выбрать из десятка последних версий. Самая верхняя версия – самая свежая («Current Version» – «текущая версия»). Просто не всегда свежие версии отвечают необходимым требованиям – им требуется доработка, обкатка. Но как бы то ни было, на данный момент, когда писался этот пост, последняя актуальная версия была Notepade++ v6.1.5

На странице закачек (когда выберете свежую версию) вам предложат несколько вариантов скачивания (zip, 7z, минипак). Если же вы не знаете, что вам подойдет, качайте по верхней ссылке – там написано примерно следующее «для тех, кто не знает, что ему нужно» 🙂

Далее выбираете папку для установки, жмете «загрузить», разрешаете программе внесение изменений на компьютере, выбираете язык.

Далее следуйте указаниям мастера установки.

 

 

Бесплатный редактор html и php Notepad++

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

 

Давайте посмотрим, как это делается, в чем плюсы именно этого редактора.

И еще не один десяток достоинств, рассказывать о которых можно долго. Для вебмастеров начального уровня достаточно уметь извлекать пользу из перечисленных мной. Подробнее остановлюсь на некоторых.

 

Подсветка кода в Notepad++

Если вы, например, нажмете на тег

, он подсветится и автоматически подсветится его парный закрывающий тег

. Кроме того, если вы нажмете на тот же тег, подсветятся скобки, в которые он заключен.

Еще. Если в открытом документе дважды щелкнуть левой мышкой по какому-либо слову, подсветятся все повторения этого слова.

Можно задать несколько стилей подсветки (жмем на выбранном тексте – слове или теге – правой мышкой и выбираем стили). Например, подсвечивать разными цветами разные теги. Вот так:

 

На рисунках я показал некоторые из перечисленных выше функций

Строки, подсветка парных тегов

Выбор языка программирования

 

Свернутые и развернутые блоки кода

 

 

Отмена предыдущих действий

Как вы наверное уже видели, в административной панели вашего блога на WordPress помимо текстового редактора для добавления статей есть еще и редактор для файлов темы (внешний вид – редактор). С помощью него тоже можно вносить изменения в дизайн вашего шаблона. Но здесь, если вы что-то криво подправили, отмотать действие нельзя. Только загружать исходный файл (или предварительно откопированный – вы же делаете копии файлов перед изменениями, правда же?).

А вот если вы редактируете файл темы с помощью бесплатного редактора html и php Notepad++, все намного проще: все можно вернуть «на круги своя».

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

Опытным вебмастерам эта функция также полезна – есть возможность для «безнаказанных экспериментов с кодом.

 

Запоминание ранее открытых файлов

Тоже очень полезная функция. Во вкладке «опции» — «настройки» – «новый документ» можно задать количество запоминаемых файлов (по умолчанию – 15). И если вы перед этим закрывали Notepad++ с незакрытыми (но сохраненными) файлами, когда откроете в следующий раз редактор, все эти файлы также откроются: можно продолжать с ними работать.

 

А если же вы перед завершением работы бесплатного html и php редактора Notepad++ закрыли редактируемые файлы и на следующий день не помните, в какой директории их искать (ну всякое же бывает 🙂 ), в меню редактора жмете на кнопку «файл» — на открывшейся вкладке внизу будут все файлы, с которыми вы недавно работали.

 

Строка состояния редактора Notepad++

Что еще сказать? Обратите внимание на строку состояния внизу редактора.

 

Из строки состояния можно узнать следующее:

  1. Тип документа
  2. Количество символов и строк в документе
  3. Положение курсора (строка, столбец и количество выделенных символов)
  4. Формат документа (Win|Mac|Unix)
  5. Кодировка документа
  6. Режим (вставка или заполнение, Ins или Ovr)
  7. Кнопка для изменения размера окна Notepad++

 

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

Ну как, убедил я вас установить на свой компьютер бесплатный редактор html  и php Notepad++? Если да, то не теряйте времени!

Удачи всем!!!

 

blogmonet.ru

Бесплатный редактор с подсветкой синтаксиса Notepad++. Где скачать Notepad++. Начало работы с HTML и PHP редактором Notepad++

Здравствуйте, уважаемые посетители моего скромного блога ZametkiNaPolyah.ru. Сегодня я бы хотел поговорить о том как сделать процесс написания наших PHP-скриптов, HTML-страниц и другого кода намного более комфортным и простым и при том не потратив на это ни цента, ни копейки, ведь на начальной стадии, будь-то блогер или программист не имеет возможности тратить приличные суммы на покупки дорогих и многофункциональных редакторов, так как сайт блогера не приносит ему дохода, а к молодому программисту еще нет доверия, даже на различных биржах фрилансеров нужно заработать себе рейтинг и иметь хоть не большое, но портфолио. Сейчас в интернете Вы сможете скачать множество бесплатных PHP и HTML редакторов, но их функционал меня мягко говоря не всегда впечатляет, возможности блокнота в Windows вовсе ущербны. И вот тут нам на помощь приходит чудесный редактор PHP, HTML, JavaScript, который можно скачать бесплатно — Notepad++. В Notepad++ можно работать и с другими языками программирования, но мы-то его собрались использовать в сфере web-программирования, кстати Notepad++ будет подсвечивать и ваши SQL запросы. Представляете, какая получается красота. Скачали и поставили вы Denwer, установили себе Mozilla FireFox прикрутили к нему два полезных для веб-разработчика плагина: первый — Web Developer и второй - FireBug. Осталось найти удобный, функциональный, с подсветкой синтаксиса и желательно бесплатный редактор, всеми этими качествами обладает редактор Notepad++, которому и посвящена эта публикация.

Возможности редактора Notepad++. Где бесплатно скачать Notepad++.

Содержание статьи:

У обладателей операционных систем Windows уже есть один бесплатный редактор — Блокнот(Notepad), но мягко говоря возможности Notepad сведены к минимуму. А вот о возможностях Notepad++ можно говорить долго и упорно. Сравнивать Блокнот с Notepad++ как минимум некорректно.

А вот сравнить Notepad++ с платными аналогами вполне реально, но плюс Notepad++ сразу очевиден — он бесплатный.  Вторым плюсом данного редактора является тот факт, что разобраться с его возможностями куда проще чем скажем с редактором Dreamweaver, так же он более легок в том плане, что занимает гораздо меньше места на Вашем компьютере, не говоря уже о том, что в Notepad++ HTML-документы, скрипты PHP и JavaScript открываются гораздо быстрее, чем в том же Dreamweaver. То есть гораздо быстрее открыть файл с расширением PHP в редакторе Notepad++, нежели в том же Dreamweaver и что-то быстро в нем подправить.

Кроме того, Вы сможете использовать Notepad++ не устанавливая его на свой компьютер(так называемая портативная версия Notepad ++ rus) и запускать его с флэшки на любом компьютере, тем самым всегда имея под рукой удобный, функциональный, с подсветкой синтаксиса, бесплатный и легко доступный для Вас редактор для  HTML , PHP и JavaScript кода(заметьте, синтаксис, который «знает» Notepad++ не ограничивается языком разметки гипертекста(HTML), каскадных таблиц стилей CSS, PHP и JavaScript).

Скачать Notepad++ Вы можете с сайта разработчика. На этой странице Вам доступен исходный код редактора, инсталяционный пакет Notepad++, упакованный в архивы Notepad++ и мини версия Notepad++. Никаких языковых пакетов дополнительно скачивать не надо, в установочный пакет Notepad++ входят десятки языков, в том числе и русский язык(Notepad ++ rus).

Протативную версию HTML и PHP редактора Notepad++ — Notepad++ Portable, Вы сможете перейдя по этой ссылке — скачать Notepad++ Portable. Или же прямо с сайта разработчика редактора Notepad++. Заходите в раздел Download, и выбираете Notepad++ zip package ,  скачанный архив Вы можете распаковать на внешний носитель, после чего у Вас будет всегда под рукой бесплатный редактор Notepad++.

Ну что же, надеюсь, что я Вас убедил в необходимости скачать и установить Notepad++, если нет — то давайте перейдем к рассмотрению возможностей Notepad++.

Возможности бесплатного редактора с подсветкой синтаксиса Notepad++

И так уважаемые посетители, если я Вас еще не убедил, в необходимости скачать и установить редактор Notepad++, то попытаюсь это сделать в этой части статьи, где хочу более подробно остановиться на возможностях редактора Notepad++.

Редактор с подсветкой синтаксиса Notepad++.

Ну очевидно, что если Notepad++ редактор с подсветкой синтаксиса, то и первая его возможность — это подсветка синтаксиса, а список языков, синтаксис которых распознает редактор Notepad++ очень огромен, как я уже говорил, Notepad++ «знает»: HTML — язык разметки гипертекста, PHP, CSS, JavaScript, MySQL (точнее SQL), C, C++, Java, C Object (если правильно помню), Python, Perl, XML и так далее список можно продолжать долго, а все языки синтаксис которых распознает Notepad++ Вы сможете увидеть если попытаетесь сохранить файл в редакторе Notepad++.

Обратите внимание, что список языков синтаксис, которых распознает бесплатный редактор Notepad++ просто огромен! То есть Notepad++ может быть полезен не только в сфере web-программирования.

Выбрать же язык, синтаксис которого будет подсвечиваться в открытом документе редактора Notepad++, Вы сможете из верхнего меню Notepad++, выбрав пункт «Синтаксис».

Обратите Ваше внимание, что языки синтаксис которых будет подсвечивать Notepad++ упорядочены и расположены в алфавитном порядке, что не может нас не радовать. То есть нам не надо рыскать по спискам, что бы найти тот язык, синтаксис которого нам захочется подсветить.

Например у нас возникло желание подсветить синтаксис PHP, из большого списка выбираем букву P, а из появившегося контекстного меню уже выбираем PHP, по аналогии мы можем поступить и с CSS, HTML или JavaScript.

Теперь в давайте вкратце рассмотрим какие удобства дает нам подсветка синтаксиса в Notepad ++ начнем с HTML-документов, например при помощи подсветки синтаксиса очень удобно посмотреть закрыли ли Вы все тэги, особенно когда этих тэгов становится очень много, например в случае с блочной версткой, когда в одном блоке может быть вложено несколько других блочных элементов.

Со временем Вы уже чисто визуально сможете определить где допустили ошибку, так цветовое оформление в случае ошибки изменяется. Текст же, который Вы пишите в своих HTML документах свой цвет изменять не будет, он просто остается черным.

Так же в редакторе Notepad++ есть возможность подсвечивания отдельных блоков кода с помощью подсветки скобок вида { } [ ] ( ). Что бы подсветить отдельный блок, достаточно поставить курсор мыши между какими-либо скобками, и эти скобки подсветятся, как бы выделяя начало и конец блока HTML или PHP кода. Удобно, не правда ли, особенно тогда, когда у вас возникнет потребность вставки в HTML-страницы блоков PHP кода или же наоборот.

Настройка подсветки синтаксиса в Notepad++

Да Вы не ослышались, в Notepad++ можно настроить подсветку синтаксиса причем для каждого языка в отдельности, будь-то PHP, SQL, Язык Разметки Гипертекстов(HTML), каскадных таблиц стилей(CSS), JavaScript (все языки долго перечислять) и настроить подсветку в Notepad++ можно так как Вам будет нравится, сразу скажу, что каких-то определенных настроек в Notepad++ касаемых подсветки синтаксиса я не делал, но если Вас не устроит настройка подсветки по умолчанию, Вы ее сможете изменить. Достаточно в верхнем меню редактора Notepad++ выбрать пункт «Опции», а из появившегося меню выбираем пункт «Определение стилей».

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

Если у Вас возникнет необходимость вывести на печать HTML-документ или PHP код, сделать Вы это сможете из окна редактора Notepad++, на печать пойдет код примерно в том же виде, который Вы видите, грубо говоря если в Notepad++ включена подсветка синтаксиса — то текст, который будет напечатан сохранит все цветовое оформление исходного файла, включая и его стили. Но это так по умолчанию, в общих настройках Notepad++ мы посмотрим как это изменить.

Пробельные символы в Notepad++

В статье HTML теги, часть 1. Тэг PRE авторское форматирование, тэг BR перенос строк. Пробельные символы, я уже рассматривал вопрос о том как можно увидеть пробельные символы в Notepad++, а так же мы с Вами посмотрели, как можно изменить размеры табуляции в Notepad++.

Как говориться, повторение мать учения.  Как Вы наверное знаете, к пробельным символам относятся перенос строк, пробелы и табуляция. В Notepad++ можно увидеть все эти пробельные символы. Для того, что-бы настроить отображение пробельных символов в Notepad++, из верхнего меню программы выбираем пункт «Вид», а из появившегося меню выберем «Отображение символов»:

И теперь мы сможем выбрать, что нам будет графически показывать Notepad++. Если мы нажмем на «Пустые пробелы и табуляции» — то Notepad++ графически отобразит их в окне для редактирования «Символ конца строки» — будет графически показывать пробельный символ перенос строк.

Настройка размера табуляции в Notepad++

Размер табуляции в Notepad++ так же мы сможем настроить. В верхнем меню программы выбираем пункт «Опции» из появившегося меню выберем пункт «Настройки...»  появится окно, в меню которого нам нужен пункт «Синтаксис/табуляция»:

Обратите внимание, что в Notepad++ можно выбрать и настроить табуляции для каждого из поддерживаемых языков в отдельности, а можно установить единую табуляцию для всех языков, размер табуляции вы сможете изменить просто нажав по цифре справа от слова «Размер».

Кодировка в Notepad++

Как Вы уже поняли, настройка подсветки синтаксиса в Notepad++ очень гибкая и не очень сложная, Notepad++ без проблем может отображать пробельные символы, но и более того в Notepad++ можно настроить размеры табуляции. Думаю Вы не останетесь разочарованными, после того как узнаете, что в Notepad++ можно легко работать с документами с различной кодировкой, а так же изменять кодировку этих документов.

Что бы посмотреть, какая кодировка у открытого документа, а так же изменить кодировку документа в окне редактора Notepad++ выбираем пункт кодировка:

В верхней части открывшегося меню мы можем посмотреть кодировку открытого документа, а в нижней части этого меню мы сможем её преобразовать в ту, которая нам требуется или подходит для нашего проекта. Из скрина Вы видите, что специфических кодировок в редакторе Notepad++ очень много.

В Notepad++ Вы сможете автоматически задать кодировку, которая будет у только что созданного документа. Из верхнего меню Notepad++ выбираем пункт «Опции» затем «Настройки...» и в появившемся окне открываем вкладку "Новый

".

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

Небольшое дополнение при работе с кодировками. На втором скрине этого раздела статьи, Вы можете видеть такие надписи, «Преобразовать в UTF 8 без BOM», «Кодировать в UTF8 без BOM». Вот о этом самом BOM я и хотел бы поговорить. Всё дело в том, что когда вы работаете с файлами сайта в обычном редакторе Windows (Блокнот и т.д.), то при сохранении его в кодировке UTF-8 происходит добавление невидимых символов (BOM), которые могут существенно подпортить Ваши нервные клетки  так эти невидимые символы могут существенно повлиять на работу Ваших скриптов (Например интерпретатор PHP может кричать, что произошла ошибка в файле, в котором ошибки и близко нет).

Поэтому если Вы хотите сохранить свои нервы и время, не работайте с кодировкой UTF-8 в стандартном блокноте Windows, а использовать для этого редактор Notepad++.

Основные настройки  PHP, HTML, JavaScript редактора Notepad++

Давайте теперь посмотри, что, где и как мы сможем настроить в редакторе Notepad++. И так все основные настройки редактора Notepad++ находятся в верхнем меню программы, пункт «Опции», а из появившегося меню выбираем пункт «Настройки...». У нас открывается окно с несколькими вкладками. Где мы можем настроить редактор так, как нам будет удобно.

Общие настройки Notepad++

И так первым пунктом нашей программы идут общие настройки редактора Notepad++:

В этом пункте меню, Вы сможете выбрать язык программы Notepad++, воспользовавшись выпадающим списком. В блоке «Панель инструментов» можно изменить способ отображения графической панели инструментов редактора Notepad++. Если Вы поставите галочку напротив пункта скрытая, графические значки исчезнут из верхнего меню. В этом блоке Вы сможете изменить размер значков графической панели инструментов Noteapd++.

Вот так выглядят мелкие значки панели инструментов Notepad++ :

Крупные значки панели инструментов Notepad++ выглядят точно так же как и мелкие, но размеры их гораздо больше.

А вот так выглядят стандартные мелкие значки панели инструментов Notepad++ :

Функционал панели инструментов Notepad++ при изменение стилей панели инструментов никак не изменяется, какой стиль значков Вам нравится, такой и выбирайте.

В общих настройках Вы сможете так же скрыть верхнее меню если Вам необходимо больше рабочего пространства, затем Вы сможете вызывать это меню путем нажатия клавиш Alt либо F10. Обратите внимание, что снизу, под рабочей областью Notepad++ идет строка состояния документа, в которой написаны: тип документа, количество символов в документе, координаты курсора, формат и кодировка документа.

В моем случае: тип документа PHP, длина документа 1879 символов, 65 строк, координаты курсора: 61 строка, 30 столбец, формат документа UNIX, кодировка ANSI. Строку состояний Вы так же сможете скрыть в Notepad++, просто поставив галочку. Последняя настройка в этом окне это -панель вкладок Notepad++. Тут думаю все просто.

Правка в Notepad++

Теперь по подробнее рассмотрим настройки правки в Notepad++:

Эти настройки отвечают за мелкие удобства при редактирование текста. В блоке настроек «Знак вставки» вы можете настроить толщину и частоту мерцания курсора в редакторе Notepad++, мелочь а приятно все-таки. В блоке настроек

«Оформление границ блока» вы сможете настроить левую границу Вашего редактора.

А именно-то, как будут отбражаться вложенные участки кода(к примеру структура HTML документа, когда главный элемент HTML, а внутри него лежат HEAD и BODY). При помощи данных настроек Вы сможете либо скрыть, либо изменить оформление границ блока, если Вас не устраивают квадратики стоящие по умолчанию(как на скрине).

Если Вы выбирите простые, то вместо квадрата в случае закрытого блока будет символ «+», в случае открытого «-». Если хотите оформление в виде стрелок, то открытые блоки будут обозначаться стрелкой направленной вниз, закрытые — стрелкой направленной вправо.

Если Вы включите мультиредактирование, то путем двойного клика левой кнопкой мыши и зажатой клавиши Ctrl по какому-либо слову сможете подсветить(выделить) такие же слова во всем документе и произвести с ними какие-либо действия.

В соответствующем блоке Вы сможете настроить вертикальную границу в рабочей области редактора Notepad++, иногда эта граница может сделать код более удобочитаемым. Для начала задаете область границы(в графе столбец задаете столбец, на котором будет находиться граница), а затем выбираете отображение этой границы(либо вертикальная линия, либо разница цветов в фоне).

Настройка создания нового документа в Notepad++

В Notepad++ Вы сможете задать свойства вновь созданного документа:

В блоке настроек «Формат» можно задать формат документа под различные платформы, макинтош, окна или униксы, различия будут и различия существенные, используйте Unix, даже если работаете в Windows. В блоке настроек «Кодировка» Вы сможете задать кодировку для новых документов, а можете настроить авто преобразование кодировок для открываемых документов, в случае ANSI. Так же Вы можете задать синтаксис и его подсветку для только что созданного файла(расширение при сохранение файла в этом случае будет назначено автоматически и будет совпадать с выбранным языком, но при сохранение у Вас останется возможность выбрать другой язык), справа в этом окне Вы без проблем сможете указать рабочую папку или же дать указание для Notepad++ куда сохранять файлы, что бы каждый раз не выбирать нужную директорию.

Ассоциации файлов Notepad++

В Notepad++ можно задать ассоциации расширений файлов с языками программирования, на которых эти файлы написаны:

Из левого списка выбираете группу языков программирования(языки в этом меню изначально разделены по сфере использования, а не по синтаксической схожести и подобности) а справа выбирайте расширение, которое хотите добавить в Notepad++. Таким же образом Вы сможете перетаскивать языки из группы в группу(заходим в языковую группу, выбираем нужный язык, нажимаем на ->, после чего заходим в языковую группу в которую хотим перенести формат из правого столбца выбираем взятый формат и нажимаем на <-) Настройка Синтаксиса/табуляции в Notepad++ мы с Вами рассмотрели чуть выше в этой статье, добавлю только то что в этом меню Вы сможете отключить подсветку синтаксиса ненужных Вам языков.

Настройка печати в Notepad++

Теперь давайте посмотрим, как можно настроить печать в бесплатном редакторе с синтаксической подсветкой Notepad++:

В Notepad++ очень гибкая настройка печати документов. Начнем с того, что мы можем печатать или не печатать номера строк, достаточно поставить галочку в нужном месте. В Notepad++ можно настроить цветовую схему печати, вариантов несколько: «Как есть» — документ пойдет на печать таким, каким мы видим его на экране монитора, «Обратить» — произойдет инверсия тех цветов, которые мы видим на экране, можем распечатать как черно-белый документ, а так же сохранить всю подсветку синтаксиса, но цвет фона сделать белым(если Вы использует цвет фона в редакторе отличный от белого).

В Notepad++ можно задать поля или отступы для печати, причем со всех четырех сторон(сверху, снизу, слева, справа) обратите внимание, что отступы в этом случае указываются в миллиметрах. При печати документа из Notepad++ можно добавить колонтитулы, причем как сверху, так и снизу.

Указать в какой части страницы будет находиться колонтитул(слева, справа или по центру) причем горизонтальное расположение задается отдельно для нижнего и отдельно для верхнего колонтитула. Шрифт, размер шрифта, его жирность и наклон, всё это Вы сможете задать в Notepad++.

Так же в этих настройках Вы сможете указать вверху в выпадающем списке, что будет являться колонтитулом(Дата и время, название документа, название директории и т.д.)

Настройка резерва и автозавершения в Notepad++

В Notepad++ можно быстро и легко настроить резервное копирование, а именно указать папку для резервного копирования, а так же какую копию делать. Так же в Notepad++ есть автозавершение:

По умолчанию в Notepad++ резервное копирование отключено, но вы сможете указать директорию для копий и какие копии делать путем двух кликов мышки. Автозавершение в Notepad++ подразумевает под собой функцию автоматической вставки целой команды или функции по первым нескольким буквам, которые Вы напечатали на клавиатуре, задать с какой буквы Notepad++ будет Вам подсказывать, Вы можете нажав на синию цифру справа и указав численное значение.

Разные настройки Notepad++

Ну что же осталось рассмотреть еще несколько дополнительных настроек, которые помогут сделать работу с Notepad++ более комфортной:

И последний пункт настроек Notepad++ — разные. Во-первых здесь можно задать, сколько Notepad++ будет запоминать файлов, которые Вы открывали и редактировали, по умолчанию он запоминает 15 файлов(как это изменить Вы знаете, жмемте по числу, затем в появившееся окно вводите своё число и подтверждаете путем нажатия Enter) .

Ну все наверное знают, что в ОС Windows между окнами можно переключаться нажимая alt+tab, а вот в Notepad++ между окнами можно переключаться нажимая ctrl+tab, причем такой способ переключения можно отключить либо сделать его односторонним.

В разных настройках Notepad++ настраивается-то, что не связано непосредственно с процессом написания Ваших PHP или JavaScript скриптов, HTML-документов и так далее, за исключением подсветки синтаксиса, здесь Вы ее сможете отключить, либо частично либо полностью.

И так в этой статье мы поговорили о бесплатном редакторе с синтаксической подсветкой Notepad++. Рассмотрели, где скачать Notepad++, процесс установки Notepad++ я не стал рассматривать, ибо он очень простой, посмотрели основные настройки Notepad++, настроили подсветку синтаксиса в Notepad++, поработали с кодировкой и форматами файлов в редакторе Notepad++. Осталось научиться только правильно и быстро работать с редактором Notepad++, в этом нам должны помочь горячие клавиши редактора Notepad++ и дополнительные функции, о которых в этой статье я не успел поговорить.

Возможно, вам будет интересно:

zametkinapolyah.ru

Notepad++ — бесплатный редактор Html и PHP с подсветкой синтаксиса- Все для Windows OC

Здравствуйте уважаемые читатели. Уже очень давно хотел написать про замечательный бесплатный Html и PHP редактор Notepad++, который на протяжении нескольких лет является одной из самых востребованных и используемых мною программ. Даже удивляюсь: «а как я раньше обходился без Notepad++, реализуя его потенциал с помощью каких-то других редакторов Html и PHP?».

Сейчас у меня на компьютере, обычно, бывает одновременно запущена пара браузеров (FireFox — для работы с сайтом, благодаря наличию в нем уникального плагина FireBug и Opera — для серфинга и удобного просмотра Seo показателей сайтов с помощью SEObar), очень простой, бесплатный и удобный Ftp клиент FileZilla — для доступа к сайту по FTP и тот самый Html и PHP редактор Notepad++ (в нем можно работать и с другими языками программирования, но лично я использую его только для подсветки и упрощений набора кода в Html и PHP), возможности которого просто несравнимы с используемым в Windows по умолчанию текстовым редактором (Блокнот).

Возможности Html и PHP редактора Notepad++, где скачать русский Notepad ++ rus

На самом деле встроенный в Windows текстовый редактор отличается от Notepad ++ так же, как небо и земля. В первом текстовом редакторе (блокнот Windows) нет практически ничего, кроме возможности просмотра и создания простейших текстовых файлов (получается нечто похожее на палку-копалку, используемую людьми на ранних этапах развития). Начав же пользоваться редактор Notepad++, хотя бы для корректировки Html или PHP файлов, вы сразу попадете из каменного века в кабину современной землеройной машины.

Да, конечно же, поначалу использование редактора Notepad++ вместо стандартного блокнота Windows может показаться сложным, замысловатым и пугающим. Но это будет только в самом начале знакомства, а потом вам будет так же сложно обходиться без Notepad++ при редактировании Html или PHP кода, как, например, уверенному пользователю ПК без файлового менеджера Total Commander.

Если сравнивать Notepad ++ с более сложными программами, предназначенными для облегчения написания и редактирования различных кодов, таких, например, как Dreamweaver, то и тут найдется не мало аргументов для использования именно Notepad ++ для работы с Html и PHP. Во-первых, он абсолютно бесплатный, а значит вы сможете существенно сэкономить, используя редактор Notepad++ вместо того же Dreamweaver, если не брать в расчет взломанных версий платных программ.

Во-вторых, Notepad++ намного более легкий и быстрый, нежели многие из платных редакторов. Кроме того, имеется возможность использовать Notepad++ вообще не устанавливая его в операционную систему Windows (так называемая портативная версия Notepad ++ rus) и носить его, допустим, на флешке, тем самым всегда имея под рукой удобный, функциональный и хорошо понятный вам редактор для работы с Html и PHP кодом (а так же и целым рядом других языков).

Скачать редактор Notepad ++ можно прямо с сайта разработчика, причем, в комплект входит поддержка нескольких десятков языков, включая русский (Notepad ++ rus). Установка программы для работы с Html и PHP под названием Notepad++ в Windows осуществляется совершенно обычным способом.

Так же, при желании или в случае необходимости, вы может скачать Notepad ++ Portable, представляющий из себя портативную версию этого Html и PHP редактора, не требующую установки в операционную систему. Notepad++ Portable можно скачать и на самом сайте разработчиков, просто зайдя на страницу для скачивания очередного релиза редактора и выбрав для скачивания вариант Notepad++ v6.x.x zip package. Вам достаточно будет распаковать архив с редактором в любое удобное место и запустить исполняемый файл notepad++.exe.

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

Возможности Html и PHP редакторе Notepad++

Во-первых, это, конечно же, подсветка синтаксиса огромного числа языков программирования, перечислять которые довольно долго, поэтому ограничусь лишь наиболее распространенными языками — HTML, CSS, PHP, Java Script, Perl, MySQL, C, C++, С#, Java, Pascal, Python, XML. Выбрать язык, синтаксис которого будет подсвечиваться в открытом документе, можно будет из верхнего меню редактора Notepad++, выбрав пункт «Синтаксис».

Благодаря подсветке синтаксиса в Notepad ++ будет очень легко, например, проверить закрыты ли всеHtml теги в коде, а при наличии минимального опыта вы уже визуально будете отмечать, что где-то в коде у вас была допущена ошибка, ибо изменится цветовое оформление кода в этом месте. Ну, и благодаря тому, что код в Notepad++ выделяется цветом, а обычный текст моих статей остается черным, моему неизменному корректору грамматических ошибок (любимой супруге) очень удобно осуществлять проверку грамматики именно в Notepad ++.

В Notepad++ очень мне нравится возможность наглядного отображения отдельных блоков кода с помощью подсветки скобок вида { } [ ] ( ). Когда курсор мыши находится между какими-либо скобками, то эти самые скобки подсвечиваются, как бы выделяя начало и конец блока Html или PHP кода.

Да, еще в этом текстовом редакторе имеется возможность настройки подсветки синтаксиса (а так же десятка других языков) под свои вкусы и нужды, но я этой опцией ни разу не пользовался, ибо вполне устраивают настройки, принятые в редакторе Notepad++ по умолчанию. Но вам никто не мешает это сделать, благо что все предельно просто — выбрать из верхнего меню пункты «Опции» — «Определение стилей», в результате чего откроется окно, где вы сможет сами тонко настроить шрифты и цвета для подсветки синтаксиса Html, PHP или любого другого нужного вам языка:

Если вы захотите распечатать Html или PHP код из окна редактора Notepad++, то на печать будет выведен код не в том виде, в каком вы его наблюдаете в окне программы. Т.е. в случае включения вами подсветки синтаксиса и на печать будет выводиться разноцветный код с учетом всех используемых стилей подсветки.

Работа в Html и PHP редакторе Notepad ++

Кроме отличной реализации подсветки синтаксиса Html и PHP, в текстовом редакторе Notepad++ следует отдельно отметить возможность сделать шаг назад (отменить предыдущее действие). Причем количество шагов назад не ограничено, что позволяет не бояться экспериментировать с кодом без риска необратимых последствий. Отмена действия в редакторе Notepad++ возможна с помощью горячих клавиш Ctrl+Z (Ctrl+Y — шаг вперед, т.е. отмена произведенной отмены), с помощью соответствующих пунктов меню «Правка» или же с помощью кнопок в виде загнутых стрелочек на панели инструментов этого редактора Html и PHP кода.

Следует отметить, что текстовый редактор Notepad++ позволяет сохранять и преобразовывать файлы Html и PHP в кодировку UTF-8 (без BOM). Мне это не раз помогало побороть проблему с русской кодировкой при работе с различными сайтами. Когда я хотел изменить какую-либо надпись на сайте на русскую, то зачастую получал в результате кракозябры, причиной которых была кодировка Windows-1251, в которой был сохранен исходный файл (читайте подробнее про кодировки ASCII, юникод, UTF 8, а так же про возникающие с ними проблемы в виде кракозябров).

После того, как исходный файл Html была сохранен через редактор Notepad++ в кодировке UTF-8 (без BOM), кракозябры с успехом трансформировались в обычные русские символы. Т.о. если вы добавляете русские символы в какие-либо файлы движка, то для их правильного отображения на сайте нужно будет сохранить файл в кодировке UTF-8 (без BOM).

Следует сказать, наверное, пару слов про этот самый BOM. Дело в том, что когда вы работаете с разными файлами сайта в обычном редакторе Windows, то при сохранении его в кодировке UTF-8 происходит добавление невидимых символов (BOM), которые могут сказаться впоследствии на работоспособности данного файла (например, PHP файл может выдавать ошибку).

Поэтому настоятельно рекомендую не работать с кодировкой UTF-8 в стандартном блокноте Windows, а использовать для этого редактор Notepad++. Возможности работы с кодировками в этом текстовом редакторе скрываются за пунктом меню «Кодировки».

В Notepad++ так же имеется возможность открывать сколь угодно много новых документов, не опасаясь, что вы тем самым захламите панель задач операционной системы. В унисон с современными браузерами, Html редактор Notepad++ будет открывать все новые документы не в новом окне программы, а в новой вкладке уже открытого окна.

Причем, эти вкладки различных документов в окне редактора Notepad++ можно будет произвольным образом перетаскивать мышью, закрывать и сворачивать. Ну, и в зависимости от сделанных настроек, все открытые перед закрытием редактора Notepad++ вкладки будут восстановлены при очередном запуске программы (опять же аналогично работе браузеров).

Кроме привычных операций с вкладками в редакторе Notepad++ можно будет открыть в одном окне сразу две копии одного и того же документа. Это может понадобиться, если нужно проводить работу с документом в разных его частях (где-то посмотреть или скопировать, а куда-то вставить). Для активации этого режима вам будет достаточно просто щелкнуть правой кнопкой мыши по нужной вкладке PHP редактора Notepad++ и выбрать из контекстного меню пункт «Вторым окном» ("Copy to other view” в англоязычной версии программы).

Очень удобно то, что сохранив изменения в одной из копий документа в окне Notepad++, обновится и вторая копия документа (т.е. вы не запутаетесь — сохранили ли вы произведенные изменения и в какой именно копии). Ну, и продолжая тему вкладок в редакторе Notepad++ стоит упомянуть еще о возможности сравнения двух документов в этом Html и PHP редакторе.

Для активации режима сравнения документов в редакторе Notepad++ вам будет достаточно выбрать из верхнего меню пункты «Дополнения» — «Compare» — «Compare» или нажать Alt+D на клавиатуре. В результате в окне Notepad++ будет открыта активная в данный момент вкладка, а так же вкладка расположенная рядом с ней.

Для удобства сравнения двух Html или PHP документов, редактор Notepad++ подсветит для вас различия в них. Для перехода в обычный режим работы с документами вам нужно будет в верхнем меню Notepad++ выбрать пункты «Дополнения» — «Compare» — «Clear Results» или нажать Ctrl+Alt+D на клавиатуре.

Причем, два документа в окне редактора Notepad++ можно будет просматривать как в вертикальном, так и в горизонтальном виде. Для выбора наиболее удобного для вас способа нужно будет щелкнуть правой кнопкой по месту раздела двух Html или PHP документов и выбрать направление поворота (вправо или влево).

Редактор Notepad++ постоянно отслеживает состояние открытых в нем документов и в случае их изменения или удаления, например, в другой программе, вам будет показано окно с предложением закрыть данную вкладку с документом или же повторно подгрузить документ в Notepad.

Так же в редакторе Notepad++ мне очень нравится встроенный поиск по открытым Html или PHP документам с возможностью замены (некоторые активно используют для этого регулярные выражения, но я к своему стыду их не знаю). Все богатство поиска в этом продвинутом текстовом редакторе можно оценить просто открыв пункт меню «Поиск».

Редактор Notepad++, работа с Html и PHP кодом

Выбрав из меню пункты «Поиск» — «Поиск» вы увидите окно поиска в Notepad ++ с тремя вкладками, позволяющими осуществлять простой поиск в открытой вкладке с документом, поиск с заменой или же поиск во всех документах, указанной вами папки на вашем компьютере:

Довольно удобный инструмент поиска по содержимому сразу многих файлов, но мне все же больше по душе аналогичный инструмент поиска в файловом менеджере Total commander. Как-то он мне больше приглянулся, но на вкус и цвет, как говорится...

Очередной примочкой, которая кажется мне довольно удобной в редакторе Notepad++ — возможность перетаскивания ярлыков документов прямо в окно программы для их открытия (хотя этим вряд ли можно кого-то удивить) и возможность перетаскивать в самом документе выделенный фрагмент кода (левой кнопкой мыши) в нужное вам место.

Так же в редакторе Notepad++ имеется возможность автоматического завершения набираемого вами слова, что может быть очень удобно, если вы не уверены в правильность написания того или иного оператора Html или PHP кода. Для этого вам при наборе оператора достаточно будет нажать сочетание клавиш Ctrl-Пробел и выбрать из открывшегося окна нужный вам вариант:

Если хотите сделать автозавершение кода в Notepad ++ автоматическим, без использования горячих клавиш, то вам нужно будет выбрать из верхнего меню «Опции» — «Настройки» и на вкладке «Резерв/Автозавершение» поставить галочку в поле «Включить для каждого ввода». Вообще, текстовый редактор Notepad++ очень много чего взял полезного и удобного из функционала других приложений, за что отдельный респект его разработчикам.

При работе с Html или PHP кодом в окне Notepad++ у вас будет возможность ставить пометки, которые в данном редакторе обзываются заметками, но суть от этого не меняется. В нужной вам строке Html или PHP кода вы можете поставить на левом поле щелчком мыши маркер в виде синей точки. Для установки маркера (заметки) в редакторе Notepad так же воспользоваться сочетанием клавиш Ctrl-F2, а для перемещения между проставленными в документе маркерами достаточно будет последовательно нажимать F2 или Shift-F2 для листания заметок в обратную сторону.

Если вы работаете в редакторе Notepad++, например, с Html файлом, то можете посмотреть как будет выглядеть ваш код в браузере FireFox или Google Chrome просто посредством выбора соответствующих пунктов меню «Запуск». При желании можно будет еще и привязать проверку орфографии русского языка к Notepad++, если вы имеете привычку писать статьи напрямую в этом текстовом редакторе.

Для подключению проверки грамматики русского языка в редакторе Notepad++ используется плагин Shell-Checker (из пункта меню «Плагины»), для работы которого вам потребуется скачать словарик русского языка с этой страницы, а при активации данного плагина проверки орфографии указать путь на вашем компьютере до файла словаря.

В Notepad++ имеется возможность записи макросов, которые мне еще не доводилось создавать, но логика их работы довольно проста. Сначала вы записываете макрос, выбрав из меню редактора пункты «Макросы» — «Старт записи», а затем вставляете записанные макросы в нужное место кода, выбирая их из меню редактора или же воспользовавшись назначенными для макросов горячими клавишами.

Кстати, если вы, как и я, в основном используете Notepad++ для редактирования Html или PHP файлов своего сайта, то вам может пригодиться возможность подключаться к сайту по FTP напрямую из этого текстового редактора. Мне, правда, как то работа с FileZilla больше по душе, но вот многие используют для доступа к файлам по FTP именно Notepad++.

Если вы хотите попробовать работу с сайтом по FTP через Notepad ++, то выберите из верхнего меню пункты «Плагины» — «NppFTP» — «Show NppFTP Window», в результате чего справа откроется окно FTP клиента. Для настройки подключения по FTP щелкните по иконке шестеренки, выберите пункт «Profile Setting» и введите данные вашего подключения. Дальнейшая работа мало чем отличается от обычного FTP клиента.

Очень много дополнительных и удобных примочек вы можете активировать через пункт меню «TextFX» в редакторе Notepad++. Например, активация показанной на рисунке опции сильно может облегчить вам жизнь при редактировании или написании Html кода:

В этом случае, как только вы введете в текстовом редакторе Notepad++, открывающий Html тег, рядом с ним тут же появится парный ему закрывающий тег. На лицо сильная экономия времени и существенное снижение вероятности ошибки из-за незакрытого Html тега. Примочек в «TextFX» довольно много, поэтому попробуйте их работу на практике сами и определитесь что именно вам будет удобно и полезно.

windowsexpert.at.ua


Смотрите также