Tag Archives: modx

Добавление кнопки Twitter на сайт (на примере CMS MODx)

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

Где взять кнопку Twitter?

Кнопку Twitter для добавления на свой сайт можно взять на официальном сайте микроблога в разделе Ресурсы.

twitter ресурсы

На странице Ресурсы выбираем раздел Кнопки. Заполняем соответствующие поля настройки кнопки. Потом копируем получившийся код.

twitter кнопки

 Как вставить код кнопки в шаблон MODx?

Для того чтобы добавить кнопку на свой сайт, необходимо вставить код скопированный с сайта Twitter в разделе Ресурсы -> Кнопки после заполнения всех полей в шаблон страницы, в данном случае MODx. Для этого в панели администрирования MODx выбираем Элементы -> Шаблоны и выбираем соответствующий шаблон (см. рисунок ниже).

twitter modx

После этого вставляем код кнопки в соответствующее место в шаблоне.

В итоге на сайте должна появиться красивая кнопочка Твитнуть. Такая же какой мы ее видели в примере на странице кнопки Twitter:

Twitter кнопка

Примечание по кнопке Twitter в шаблоне MODx

  • Данный метод позволяет добавить кнопку на все страницы сайта благодаря встраиванию кнопки в шаблон.
  • Для того чтобы добавить кнопку в соответствующую область в области контента на отдельной странице MODx целесообразно создать отдельный чанк с кодом кнопки (создание чанка можно рассмотреть на примере создания сниппета в MODx).
  • Для того чтобы кнопка появлялась только в соответствующем разделе, например, новости. То целесообразно будет сделать для данного раздела свой шаблон. В таком случае не придется добавлять код кнопки (или чанк) на каждую создаваемую страницу раздела отдельно, а достаточно просто присвоить данному разделу соответствующий шаблон. Что может сэкономить немного драгоценного времени :-)
Основные теги , , ,

MODx: видео урок по установке и созданию сайта

modx создание сайта урокиСистема управления сайтом MODx (описание CMS MODx) становится все популярнее у разработчиков. В основном это связанно с простотой и гибкостью системы.

Для получения удовольствия от работы с CMS MODx вы должны обладать первоначальными навыками в создании сайтов. Для новичка первоначально работа будет трудновата. Но потраченные силы не пропадут даром!

Для упрощения процесса “втягивания” в MODx предлагаю ознакомиться с обучающими информационными статьями:

Так же предлагаю к ознакомлению обучающий видео урок по установке и созданию сайта на MODx. Длительность видео составляет 30 минут. Надеюсь данные материалы  будут полезны.

Также автор видео предлагает бонус — подборка полезных ссылок из видео, а также исходники.

Всем успехов!

Основные теги , , , ,

MODx Revolution: установка

Требование к хостингу для установки MODx Revolution:

  • поддержка PHP;
  • наличие СУБД MySQL.

Загружаем исходные файлы MODx Revolution

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

Переносим исходные файлы на хостинг

Быстрее и проще всего это сделать через ftp-клиент. Лично я пользуюсь Total Commander (как закачать файлы на FTP при помощи TotalCommander?).

Установка MODx Revolution

Теперь приступаем непосредственно к установке.

  • Открываем страницу http://адрес_сайта/setup/. Если надо, меняем язык на родной (я поменял на русский). Жмем Дальше.
  • В появившемся окне выбираем пункт “Новая установка”
modx revolution установка
  • В появившемся окне необходимо настроить соединение с  базой данных. Необходимо указать хост сервера базы данных, имя базы данных, префикс таблиц, логин и пароль пользователя базы данных. После этого необходимо проверить соединение с БД, нажав соответствующую ссылку. Если все хорошо, то откроется следующий блок настроек, к котором нужно будет указать кодировку подключения с сопоставления базы данных. Желательно указать utf8 и utf8_general_ci соответственно. Далее проверяем указанные настройки. Если все хорошо, то остается последний шаг настроек – настроить данные администратора сайта (логин, пароль и  емейл). Данный шаг довольно простой, поэтому подробно останавливаться на этом не буду. Если у вас возникли с этим шагом проблемы, то можете проверить свои действия по аналогии ввода данных доступа к базе данных для MODx Evolution. После этого жмем Далее.
  • В следующем окне вы увидите полный отчет о проверке сервера перед установкой. Если все хорошо, жмем “Установить”.
  • Оставив галочку удаления папки с установочными файлами (в целях безопасности), нажимаем Войти. Таким образом мы переходим в административную панель по адресу http://адрес_сайта/manager/. Для входа в панель необходимо ввести логин и пароль, указанные во время установки.

 

Основные теги , , , , , ,

MODx: эволюция или революция? (краткий обзор)

modx logo логоПервое знакомство с MODx Revolution, новой версией системы управления  сайтом, оказалось не таким приятным как представлялось. Может просто дело привычки…
Скачать свежие версии CMS MODx вы всегда можете на официальном сайте.

Дизайн и интерфейс

modx revolution отзывы, обзорКак и все новое и красивое, подкупила сначала обновленная панель администрирования: довольно простые цвета, скругленные края, градиент кнопок и т. д. Но после этого началось “путешествие” по области настроек сайта. Сразу найти необходимые настройки не получилось. Хотя обратил внимание на большое количество настроек и это, конечно, плюс. Но аналогии с прошлой версии нет. А так как “просидел” на MODx Evolution долгое время, то для меня это был минус.

Сниппеты

Все основные функции MODx реализованы и в данной версии. Основные плагины, такие как Ditto, Wayfinder, Breadcrumbs и др. также присутствуют и здесь. Данные снипеты хорошо себя зарекомендовали. Поэтому надеемся на дальнейшее их развитие.

Скорость работы

Еще хотелось бы отметить скорость работы: новая версия (revolution) явно уступает в производительности своему предшественнику. Что для меня значит также минус.

Возможности

Предшественник справлялся со всеми поставленными задачами на сайте. С такими задачами скорее всего справиться и Revolution. Так что на данный момент Evolution мне вполне достаточно. И поэтому судить о возможностях не возьмусь, так как могу внести смуту в ряды :-)

Подведу свой итог

В движении – жизнь. Но MODx Evolution закончился на версии 1.0.5. Может быть стоило продолжить развитие первой версии и выпустить MODx 1.1? MODx Revolution не оправдал своего названия. Новая версия вышла, но революцию не произвела. По крайней мере для меня.
Основные теги , , , ,

Шаблоны MODx

В данной статье будут публиковаться шаблоны MODx свои и собранные с разных источников. Так что следите за обновлением.
Если у вас возникли проблемы при установке, то ознакомьтесь со статьей “Как установить шаблон MODx?”

Шаблон “Ночной дом (Night home)”

Ночной дом шаблон MODxСкачать шаблон

Шаблон “Недвижимость (Real estate)”

Шаблон MODx недвижимостьСкачать шаблон

 Шаблон “Простой серо-голубой”

Шаблон MODx Простой серо-голубойСкачать шаблон

 Шаблон “Любовь”

Шаблон MODx Любовь
Скачать шаблон

 

Основные теги , ,

Обратная связь MODx

обратная связь MODx, форма обратной связи на MODxФорма обратной связи на сайте на данный момент является одним из стандартных элементов, как разделы Контакты, или Карта сайта. В данной статье я расскажу как создать форму обратной связи на сайте в системе управления сайтом MODx. Реализованна форма будет при помощи сниппета eForm.

Что такое сниппет eForm в MODx?

eForm – сниппет входящий в стандартную поставку Modx. Отвечает за обработку данных, которые пользователи вводят в формы на сайте. Полученные данные можно отослать по электронной почте используя формат html, вложения, автоответчик, а также расширенную обработку данных и генерацию настраиваемых отчетов. Сниппет довольно прост в использовании. Но также позволяет решать довольно сложные задачи.

Этапы создания формы обратной связи на MODx

Создание формы обратной связи можно разделить на следующие этапы:

  1. создание чанка формы, которая будет располагаться на сайте
  2. создание чанка шаблона письма, которое будет приходить на электронную почту
  3. вставка сниппета eForm на страницу

1. Создание чанка формы обратной связи

Создаем новый чанк form_tpl и вставляем туда следующий код:

<div id=”forma”>
<p> [+validationmessage+] </p>
<br/>
<form method=”post” action=”[~[*id*]~]” name=”myform”>
<input type=”hidden” name=”formid” value=”form1″ />
<table  cellpadding=”1″ cellspacing=”1″ >
<tr >
<td >Ваше Имя:</td>
<td ><input type=”text” name=”Name” size=”40″ maxlength=”60″ eform=”Ваше Имя::1″ /></td>
</tr>
<tr >
<td >Ваш телефон:</td>
<td><input type=”text” name=”phone” size=”40″ maxlength=”40″ eform=”Ваш Телефон::1″ /></td>
</tr>
<tr >
<td >Ваш email адрес:</td>
<td><input type=”text” name=”email” size=”40″ maxlength=”40″ eform=”Ваш email:email:1″ /></td>
</tr>
<tr >
<td >Текст письма:</td>
<td><textarea cols=”40″ rows=”6″ name=”comments” eform=”Текст письма:html:1″></textarea></td>
</tr>
<tr >
<td colspan=”2″>Пожалуйста введите код: (Чтобы предупредить спам)</td>
</tr>
<tr >
<td ><img src=”[+verimageurl+]” alt=”verification code” /></td>
<td><input type=”text” name=”vericode” size=”20″ /></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type=”submit” name=”submit” value=”Отправить” ></td>
</tr>
</table>
</form>
</div>

Шаблон довольно прост. Поэтому останавливаться не буду. Если возникнут вопросы, то оставляйте комментарии :-)

2. Создание чанка письма, приходящего на почту

Создаем новый чанк formreport и вставляем туда следующий код:

<p>Это письмо было отправлено с сайта</p>
<table>
<tr valign=”top”><td>Name:</td><td>[+Name+]</td></tr>
<tr valign=”top”><td>Email:</td><td>[+email+]</td></tr>
<tr valign=”top”><td>Телефон:</td><td>[+phone+]</td></tr>
<tr valign=”top”><td>Текст сообщения:</td><td>[+comments+]</td></tr>
</table>

3. Вставляем код формы на страницу

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

[!eForm? &formid=`form1` &to=`mail@site.ru` &tpl=`form_tpl` &report=`formreport` &vericode=`1` &subject=`Сообщение с сайта` !],

где formid - уникальный идентификатор нашей формы,
to - адрес электронной почты, куда будут приходить сообщения,
form_tpl - имя чанка формы, созданного нами,
report - чанк шаблона письма приходящего на электронную почту.

После этого проверяем форму и если все сделали правильно, то все будет работать и теперь можно расслабиться и пойти попить чайку :-)

Основные теги , ,

MODx мета-теги (meta): настройка

Что такое мета-теги?

Мета-теги (англ. meta-tags) — это HTML (XHTML) -теги, предназначенные для предоставления структурированных метаданных о веб-странице. Мета-теги помещаются внутрь тега head в (X)HTML-документе, как правило, после тега TITLE. Мета-теги используются для указания описания страницы, ключевых слов и других данных.

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

В каких целях необходимо настроить мета-теги?

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

Обычно мета-теги настраиваются в целях внутренней оптимизации. Данные теги помогают лучше поисковым машинам охарактеризовать страницы сайта.

Основные мета-теги:

  1. title – наверное самый главный тег, от которого может измениться положение страницы в поисковой выдаче. Как у книги должно быть название, так у сайта должен быть заполнен тег title.
  2. description – данный тег содержит краткое описание сайта. Обычно 2-3 предложения. Так же важный тег. Старайтесь всегда заполнять его.
  3. keywords – “ключевые слова”. Название говорит само за себя. Заполняется тег ключевыми словами, соответствующими странице.

Мета-тегов на самом деле намного больше, но в данной статье рассматривать подробно не будем.

Настройка мета-тегов в MODx

Последовательность подключения мета-тегов к страницам выглядит так:

  • включаем отображение мета-тегов: заходим в панели администрирования Инструменты -> Конфигурация -> Интерфейс и представление и в пункте Показывать вкладку с META-тегами и ключевыми словами отмечам - Да. После этого в окне редактирования/создания страницы появится вкладка Ключевые слова.
  • создаем теги: заходим в Элементы -> Управление МЕТА-тегами и ключевыми словами. Начинаем заполнять поля Название -> home, Тег -> title, Значение -> Заполняем тег соответствующим заголовком, жмем Создать тег.
  • привязываем тег к станице: заходим в окно редактирования/создания страницы, далее во вкладку Ключевые слова. В окне Мета-теги подсвечиваем кликом созданный нами тег с именем home (можно выбрать несколько тегов с Ctrl) и жмем Сохранить.
  • все готово. Тег подключен. По аналогии создаем теги description и keywords. Подключаем аналогично.

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

Основные теги , , , , , , ,