Category Archive: Создание сайтов

Subcategories: Нет рубрик

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. Подключаем аналогично.

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

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

Сниппеты MODx

Что такое сниппет (snippet) MODx?

Сниппет – это код элемента сайт требующего динамики на странице, который встраивается в страницу (гостевая книга, форма обратной связи, поиск по сайту и т. д.). Сниппеты  хорошо расширяют возможности системы управления. Сниппет может быть “серьезным” и многофункциональным, либо простым и несложным. Но оба они будут выполнять важную функцию. Возможность написанию собственных сниппетов дает большие возможности в “сайтостроении” на MODx.

Встроенные сниппеты в MODx

AjaxSearch — Назначение: позволяет пользователям производить поиск по сайту, не покидая страницы, на которой они находятся. Результаты возвращаются посредством запроса ajax и выводятся в окно результата ниже формы поискового запроса. (Если у пользователя отключен JavaScript, результаты выводятся в отдельном окне).

Breadcrumbs — 0.9d readcrumb (англ. «Хлебные крошки») — элемент навигации по сайту, представляющий собой путь по сайту от его «корня» до текущей страницы, на которой находится пользователь. Действие: представляет собой полосу в верхней части страницы примерно такого вида: Главная страница → Раздел → Подраздел → Текущая страница.

Ditto — Среди его основных функций — разбивка на страницы, вывод краткой версии статьи со ссылкой «далее», генерирование архива, сортировка по дате, заголовку и т. д.

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

FirstChildRedirect — Автоматически переводит на первый дочерний документ в папке.

Jot — 1.1.2 Коментарии пользователей, с возможностью модерирования и подписыванием на е-мэйл (вероятно при появлении ответа приходит уведомление на емэйл).

ListIndexer — Показывает самые недавние документы, Очень гибкая.

MemberCheck — Выборочно показывает чанки based on logged in Web User’ group memberships.

NewsPublisher — Публикация новостных статей прямо из web.

Personalize — Простая Персонализация для web пользователей.

Reflect — Используется с Ditto, создаёт архивы статей, записей блога, галлерей изображений.

UltimateParent — Travels up the document tree from a specified document and returns the «ultimate» parent.

Wayfinder — Основное назначение Wayfinder — генерировать навигационные меню, автоматически отражающие изменения в структуре сайта, однако он может быть использован и с другими целями. Wayfinder — сниппет, сканирующий заданную часть дерева документов MODx, находящий все документы, отвечающие заданным условиям, и выводящий форматированный список этих документов. Формат вывода определяется шаблонами, он может включать любые комбинации HTML, CSS и JavaScript, что дает невероятную степень гибкости. Эти шаблоны являются чанками (то есть для задания какого-либо шаблона следует создать новый чанк, он то и будет являться шаблоном) На одной странице может присутствовать несколько вызовов Wayfinder, соответственно можно создавать несколько независимых меню и списков документов.

WebChangePwd — Сниппет смены пароля для web user’ов.

WebLogin — Сниппет входа на сайт web user’ов.

WebSignup — Сниппет регистрации на сайте web user’ов.

Как вызвать сниппет на странице сайта на MODx?

Обычно есть несколько вариантов добавления сниппета на страницу:

  • Для того чтобы вызвать сниппет на странице сайта в шаблоне сайта, надо вставить в код шаблона сайта [[name]], где вместо name необходимо вставить имя созданного или используемого сниппета.
  • Для того чтобы вызвать сниппет в теле документа в области [*content*], необходимо также вставить код вызова сниппета [[name]], где вместо name необходимо вставить имя созданного или используемого сниппета.

Есть и другие варианты вызова сниппета, но здесь мы рассмотрели базовые.

Где скачать сниппеты на MODx?

Сниппеты для MODx я обычно качаю с официального сайта – http://modx.com в разделе Extras. Несмотря на то, что многие сниппеты на английском, обычно присутствует инструкция по установке на английском языке. Поэтому с установкой проблем не возникало. Если необходим сниппет на русском языке, то стоит на этом же сайте в разделе форума поискать соответствующий языковой пакет.

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

MODx установка шаблона

modx установка шаблонаИногда при создании сайта на MODx можно найти уже готовый дизайн, который будет не в точности (иногда и в точности) соответствовать техническому заданию, но будет по структуре очень похож. Например, надо будет изменить только “шапку” сайта и изменить текст ссылок. В таком случае будет проще и быстрее использовать готовое решение.

Шаблоны для MODx

В интернете есть ресурсы, которые позволяют скачать готовые шаблоны для MODx. Как правило, все эти ресурсы предлагают сделать это бесплатно. Не буду останавливаться на этом моменте в будущем посвещу этому отдельную статью :-)

Исходники шаблона для установки на MODx

Под шаблоном для системы управления подразумевается набор файлов:

  • файл с кодом шаблона для размещения его в шаблоне MODx
  • файл со стилями CSS
  • папка с изображениями для данного шаблона
  • файлы JavaScript (не обязательно)
  • другие необходимые для работы шаблона файлы (не обязательно)

Последовательность установки шаблона на MODx

Последовательность установки не строгая. Можете выполнять ее по своему усмотрению. Сам я обычно поступаю так:

  • создаем в директории сайта assets/templates/ новую директорию, например, new и закачиваем туда файл со стилями CSS, папку с изображениями. Важно! изначально не изменяйте пути к файлам в таблице стилей и коде шаблона.
  • в панели администрирования MODx выбираем Элементы -> Управление элементами -> Новый шаблон. В появившемся окне в поле Имя шаблона вводим название нового шаблона. Пускай будет тоже new. В поле Код шаблона вставляем код шаблона сайта, который мы скачали. Обычно код хранится в отдельном текстовом файле из набора скачанных файлов шаблона сайта на MODx и называется template. После этого жмем Сохранить.
  • Поздравляю! мы установиди новый шаблон на MODx :-)

Привязка нового шаблона к старнице MODx

Чтобы привязать новый шаблон к странице, необходимо в окне создания/редактирования страницы в поле Шаблон выбрать созданный шаблон (в данном случае new).

Проблемы установки на шаблона MODx

  • Некоторые шаблоны смотрятся эффектно при наличии некоторых дополнительных плагинов. Но плагины автоматически не настраиваются при установке шаблона. Решение: смотреть статьи о плагинах установить плагины :) или отредактировать код шаблона и файл стилей CSS.
  • Обычно структура меню очень сильно зависит от шаблона. И далеко не факт что новый шаблон будет отображать меню вашего сайта так, как это было при предпросмотре шаблона перед скачиванием. Решение: изменить настройки сниппета вывода меню Wayfinder в коде шаблона и файл стилей CSS.
  • Некоторые пути в файле стилей CSS и шаблоне являются абсолютными, поэтому после установки шаблона эти ссылки получаются битыми. Решение: переписать ссылки.
Основные теги , , ,

Настраиваем “дружественный URL” в MODx

Настраиваем дружественный URL в MODxДружественный URL позволяет отображать адрес страницы в виде статического текста вместо сгенерированного системой управления кода. Но в то же время дружественный URL тоже является сгенерированным. Поэтому приведу пример: вместо адреса страницы  http://site.ru/index.php?id=1/home.html. В таком случае еам необходимо выполнить ряд нехитрых действий. я хочу отображить http://site.ru

Возможные преимущества дружественного URL

  • поисковые системы научились сравнивать поисковый запрос с транслитом адреса страницы;
  • более удобное представление адреса страницы для пользователя (для ввода с клавиатуры или запоминания).

Важно!

Основное правило только одно: для каждой страницы должен быть свой уникальный адрес (url).

Настройка дружественного URL в MODx

Для того чтобы дружственный URL заработал, необходимо сделать несколько не сложных действий:

Переименовываем файл ht.access

Я обычно делаю так:

  • скачиваем файл себе на компьютер из директории сайт
  • открываем файл ht.access с помощью блокнота
  • выбираем “Сохранить как..” -> Выбираем “Все файлы” -> Имя как .htacess
  • закачиваем файл в основную директорию сайта

Включаем дружественный URL в панеле управления сайта

  • В панеле управления сайта на MODx выбираем “Инструменты”->“Конфигурация”
  • далее выбираем вкладку “Дружественный URL”
  • в полеИспользовать дружественные URL” выбираем ДА

Где задать URL страницы в MODx?

Теперь необходимо каждой созданной странице присвоить свой уникальный URL. А делается это в окне создания/редактирования страницы (см. создание страниц в MODx). В поле “Псевдоним” необходимо на латинице ввести ее название. Это и будет URL-ом страницы.

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

MODx: привязка TV параметра к странице

MODx – система управления сайтом (CMS). Описание системы можно посмотреть здесь.

В данной статье будет изложена информация о таком параметре в MODx как TV (сокращенно от «template variables», что можно перевести как «изменение шаблона»).

Параметр TV является дополнительным переменным полем в структуре страницы. Т. е., проще говоря, можно добавить на страницу переменный элемент (поле), который может быть представлен в виде кнопки, текстового поля, загрузчика изображения или файла, выпадающий список и т. д. Используются практически все элементы ввода используемые в HTML. Далее рассмотрим пример создания параметра TV.

Создание TV параметра в MODx

Чтобы создать новый TV параметр, необходимо зайти в панели администрирования Элементы → Управление элементами → Параметры (TV) → Новый параметр TV. После этого должно появится меню нового параметра как на нижеприведенном изображении.

Создание нового параметра TV в MODx

Создание нового параметра TV в MODx

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

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

Описание: описание TV параметра, которое на даст в них запутаться если их будет очень много :-)

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

Визуальный компонент: тип отображаемого компонента.

После этого нужно выбрать в разделе Доступ шаблонов для каких шаблонов привязанных ддля данного сайта будет использоваться созданный параметр.

Выбираем в поле Права доступа “доступен для всех”.

Присваиваем категорию созданному параметру в пункте Категория и жмем Сохранить.

После того как создан параметр TV, соответствующие поля поавляются в меню создания страницы (см. ниже).

Создание новой страницы в MODx с привязанными TV параметрами

Создание новой страницы в MODx с привязанными TV параметрами

Вывод параметра TV на страницу MODx

Ну и самое главное: а где же на странице будет выводится наш параметр TV?

При создании нового шаблона (пример создания простого шаблона можно посмотреть здесь) или редактирования готового шаблона в MODx, необходимо прописать такой код [+name_tv+], где вместо name_tv необходимо вставить имя созданного TV параметра. Соответсвенно в этой области и будет вставлена информация из TV параметра страницы.

Краткий вывод

Данная возможность открывает большой простор для экспериментов. С помощью данных параметров можно сделать удобную ленту новостей, каталог товаров и т. д. Что лишний раз заставляет хорошо отозваться о данной CMS.

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

Создание страниц в MODx

Данная тема посвящена основам работы с MODx, а именно созданию новой страницы на сайте. Предположим что Вам создали сайт на MODx, и спустя какое-то время появилась необходимость в создании нового раздела на сайте. Разработчик вашего сайта, помимо всего прочего, представил данные для доступа в административную панель управления данной системой управления. Эта панель управления обычно доступна по адресу http://www.vash_site.ru/manager. Здесь необходимо ввести предоставленные логин и пароль. После того как мы правильно вбили данные и прошли авторизацию, мы попадаем в панель администрирования.

Слева находится структура страниц сайта в виде древа документов (“разделы”). Элементы древа отображают название ресурса (title). Данная организация структуры сайта интуитивно понятна и удобна.

Вверху жирным шрифтом указано название сайта (“title”). Изменить название можно в панели администрирования:

Инструменты → Конфигурация → Сайт → Заголовок сайта

Для создания новой страницы необходимо нажать на кнопку-ссылку в верхней части древа меню:

После этого в правой части появится следующее окно:

Заголовок – название страницы. Оно же по-умолчанию title и пункт меню (см. Пункт меню).

Расширенный заголовок - название говорит само за себя. Необязательно поле для заполнения.

Описание - необязательно поле.

Псевдоним – если используете дружественный URL, то данное поле необходимо заполнить.

Атрибуты ссылки – необязательное поле.

Summary – аннотация.

Шаблон – привязка шаблона к странице.

Пункт меню – пункт меню страницы. Можно не заполнять, тогда пунктом меню будет описание.

После того как заполнили все поля, жмем сохранить. После этого новая страница должна появиться в древе меню.

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

301 редирект в файле .htaccess

Установить редирект с 301 ошибкой через файл .htacess (при наличии Apache на сервере), на мой взгляд, проще всего.

Редирект с помощью директивы Redirect или RedirectPermanent модуля mod_alias

Redirect 301 /old-page.html http://new-domain.ru/new-page.html

или

Redirect permanent /old-page.html http://new-domain.ru/new-page.html

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

RedirectPermanent /old-url.html http://new-site.ru/new-url.html

Редирект с помощью директивы RedirectMatch

Этот редирект подобен предыдущему, за исключением того, что можно задавать регулярное выражение для старых URL адресов. Допустим, при смене движка с PHP на ASP, можно старые адреса перенаправить следующим образом:

RedirectMatch /(.*)\.php$ /$1.aspx

Редирект с помощью директивы RewriteRule модуля mod_rewrite

Для использования директивы RewriteRule необходимо удостовериться, что в httpd.conf подключен модуль mod_rewrite, а также влючена опция FollowSymLinks. Использование реврайт модуля дает много возможностей для перенаправления страниц на новые адреса.

Перенаправление домена с www на не-www

Options +FollowSymLinks
RewriteEngine On
RewriteCond %{HTTP_HOST} ^www\.(.*) [NC]
RewriteRule ^(.*)$ http://%1/$1 [R=301,L]

или альтернативный, более понятный синтаксис

Options +FollowSymLinks
RewriteEngine On
RewriteCond %{HTTP_HOST} ^www.domain\.com$ [NC]
RewriteRule ^(.*)$ http://domain.com/$1 [R=301,L]

Редирект запросов с не-www на домен с www префиксом

Options +FollowSymLinks
RewriteEngine On
RewriteCond %{HTTP_HOST} ^domain\.com$ [NC]
RewriteRule ^(.*)$ http://www.domain.com/$1 [R=301,L]

или же альтернативный вариант

RewriteEngine On
RewriteCond %{HTTP_HOST} !^www\.(.*) [NC]
RewriteRule ^(.*)$ http://www.%1/$1 [R=301,L]

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