Контактная информация

По всем интересующим вас вопросам связывайтесь при помощи контактной информации приведенной на этой странице!

skype: metsof
email: accusser@gmail.com

В социальных сетях...

Форма обратной связи

Авторизация

Дополнение EventsX MODX Revolution для создания календаря

Сайдбар

EventsX – это приложение-календарь для MODx Revolution. EventsX показывает предстоящие (и прошедшие) события в календаре (jQuery) и/или показывает список предстоящих событий.

Свойства:

  • Управление событиями (создать/обновить/удалить/(де)активировать)
  • Для каждого события есть дата начала и окончания (возможна одинаковая дата для однодневного события)
  • Календарь jQuery включительно
  • Языки: 1. Английский 2. Немецкий 3. Русский

Требования:

  • MODx Revolution (протестировано с 2.1.3pl)
  • jQuery для календаря (вы можете создать свой календарь на базе JSON)

История:

Приложение EventX было написано Джероном Кентерсом (Jeroen Kenters). Пилотная версия вышла 1 декабря 2011 года.

Загрузка:

Это приложение можно загрузить из MODx Revolution manager или из MODx Extras Repository.

В планах:

  • Регистрация событий
  • Исправление ошибок

Установка:

Установите с помощью менеджера установки.

Использование:

Как создать календарь на Вашей странице?

Перейдите в Components >EventsX и создайте события (убедитесь, что они активны)

  1. Добавьте jQuery в шаблон вашего вебсайта, если требуется (требуется только на страницах, где будет использоваться календарь)
  2. Copy & add /assets/components/calendar.js (копировать и добавить/активы/компоненты/календарь ) в шаблон вашего вебсайта (требуется только на страницах, где будет использоваться календарь)
  3. Copy & add /assets/components/jquery.calendar-widget.js (копировать и добавить/активы/компоненты/jquery.пиктограма календаря.js) в шаблон Вашего вебсайта (требуется только на страницах, где будет использоваться календарь)
  4. Создайте ресурс календаря событий (или добавьте в свой шаблон)
  5. Создайте ресурс для списка предстоящих событий (смотреть пример ниже)
  6. Ниже создайте ресурс для единичного события (смотреть пример ниже)
  7. Создайте контекстные настройки «evxEventsPage» и установите id страницы «предстоящих событий» как значение
  8. Создайте контекстные настройки «evxEventsPage» и установите id страницы «единичное событие» как значение
  9. Не забудьте сохранить контекст и очистить кэш-память (контекстные настройки кэшированны)

Шаблоны:

Шаблон календаря событий

<html>
<head>
<title>[[++site_name]] - [[*pagetitle]]</title>
<base href="[[++site_url]]" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="assets/components/eventsx/js/web/jquery.calendar-widget.js"></script>
<script type="text/javascript" src="assets/components/eventsx/js/web/calendar.js"></script>
<link rel="stylesheet" type="text/css" href="assets/components/eventsx/css/calendar.css" />
</head>
<body>
  <a href="" id="prevMonth">previous month</a> <a href="" id="nextMonth">next month</a>
  <div id="calendar"></div>
  [[*content]]
</body>
</html>

Шаблон календаря предстоящего события

<html>

<head>

<title>[[++site_name]] - [[*pagetitle]]</title>

<base href="[[++site_url]]" />

</head>

<body>

[[!EventsX? &tpl=`evxEventTpl` &limit=`10`]]

[[*content]]

</body>

</html>

Шаблон календаря единичного события

[[!evxEvent?]]<html>
<head>
<title>[[++site_name]] - [[*pagetitle]]</title>
<base href="[[++site_url]]" />
</head>
<body>
    <p>Name: [[+event.name]]</p>
    <p>Start date: [[+event.startdate:strtotime:date=`%d-%m-%Y`]]</p>
    <p>End date: [[+event.enddate:strtotime:date=`%d-%m-%Y`]]</p>
    [[+description]]<!-- Description is a TinyMCE field by default, so no <p> here -->
    <h2>Location</h2>
    <p>[[+event.location]]
 [[+event.street]]
 [[+event.pc]]
 [[+event.city]]
 [[+event.region]]
 [[+event.country]]</p>
    <p><a href="[[+event.website]]">Visit website</a></p>
</body>
</html>

Примеры EventsX MODX Revolution

Показывает список предстоящих событий
Перейдите в «Компоненты» - > «EventsX» и создайте события (убедитесь, что они активны)

Создайте блок «предстоящие события»:

<li>[[+location:htmlentities]]: <a href="[[+url]]" title="[[+name:htmlentities]]">[[+name:htmlentities]]</a> <time datetime="[[+startdate:strtotime:date=`%Y-%m-%d`]]" title="event 
is scheduled on [[+startdate:strtotime:date=`%d.%m.%Y`]]">[[+startdate:strtotime:date=%d.%m.%Y`]]</time></li>


Создайте вызов фрагмента


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

<h2>next events:</h2>
<ol id="eventcal">
        [[!EventsX? &tpl=`upcomingEvents` &limit=`10`]]
</ol>

Скриншот:

Скриншот может выглядеть вот так:





Учтите, что временной элемент я устанавливал индивидуально.