Add event php добавление объявления заголовок

One customization request we"ve seen come up regularly is how to add post content to the . Here we"ll take a look at how to do just that.

The Scenario

Let"s say we have placed the Mini Calendar widget in the sidebar of a page. We can expect to see a lot of information about our events, including the dates, times, location, and more, depending on our widget settings.

That"s nice and dandy, but what if we want to include a little more information about our events? Specifically, let"s find a way to add the event"s excerpt below the dates.

How it"s Done

The key here is that we can use the default WordPress function for the_excerpt() to display content from the event directly in the widget.

This will require a template override. If you"re new to overriding calendar templates, then it"s a good idea to check out our , which will walk you through the process step-by-step. The basic idea is that we will be creating a copy of one of the plugin"s templates, then adding it to our theme files. This allows us to override the template without touching the core code of the plugin.

  • Make a copy of the Mini Calendar"s list.php file. This is located in /plugins/events-calendar-pro/src/views/pro/widgets/mini-calendar/list.php.
  • Call it tribe-events .
  • Call it pro .
  • Make a new folder in that one. Call it widgets .
  • Make one last new folder in that one. Call it mini-calendar .
  • Add the file. Drop the copied list.php file in that last folder.

Presto! Now that the template is in our theme directory, we can modify to suit our needs. In this case, we will add this:



Right below the single event module. As of this writing, that is after Line 24 of the template.

Now, we can save our work, head back to our widget and see the event"s excerpt display with the rest of event"s information. Nice work!

That"s great, but how about the List Widget?

The above example is indeed applicable to only the Mini Calendar. However, the same technique applies to the Events List widget in both The Events Calendar and The Events Calendar PRO.

For the Events List widget in The Events Calendar:

  • Make a copy of the list-widget.php file. This is located in /plugins/the-events-calendar/src/views/widgets/list-widget.php.
  • Make a new folder in your theme directory. Call it tribe-events .
  • Make a new folder in that one. Call it widgets .
  • Add the file. Drop the copied list-widget.php file in that last folder.

For the Advanced Events List widget in Events Calendar PRO:

  • Make a copy of the list-widget.php file. This is located in /plugins/events-calendar-pro/src/views/pro/widgets/list-widget.php.
  • Make a new folder in your theme directory. Call it tribe-events .
  • Make a new folder in that one. Call it pro .
  • Make a new folder in that one. Call it widgets .
  • Add the file. Drop the copied list-widget.php file in that last folder.

Now we can add the same the_excerpt() snippet wherever we would like it to display.

- автомодерирование объявлений (автоудаление объявлений по прошествии указанного в объявлении срока);
- возможность настройки верхней и нижней части всех страниц (top.html и bottom.html );
- отправка на емайл админу и тому кто написал это объявление (опционально);
- Е-майл участников доски закрыт для защиты от спамеров (имеется форма для отсылки сообщения);
- имеется удобный поиск на доске по параметрам объявления;
- Регистрация и возможность редактирования-удаления регистрационных данных;
- определение IP пользователей при регистрации/перерегистрации и добавлении объявления IP сохраняется в базу;
- система отсылки на мыло утеряного имени и пароля ;
- если клиент, с поисковика попадает на страницу с объявлением, которого уже нет - он увидит спецсообщение;
Админинтерфейс с возможностью:
- выбора своего заголовка для всех страниц (увеличивает рейтинг в поисковых системах);
- выбор количества отображаемых объявлений в каждой категории, разбивка на страницы;
- редактировать/переносить в другую рубрику/удалять объявления;
- возможность создавать/удалять/править разделы;
- возможность удалять/банить участников;
- в случае появлении неверного кол-ва рубрик можно нажать кнопку "ПЕРЕСЧИТАТЬ" - которая всё исправит.
2. Фишки и изменения в новой версии по сравнению с v. 1.7-1.8 lite:

Добавлен ФИЛЬТР по теме объявления в списке объявлений;

Модернизировал работу в админке с рубриками/разделами: привязал кнопку "Добавить рубрику" к разделу, чтобы при её нажатии рубрика добавлялась в начало выбранного раздела;

Внимание WEB-мастеров! Введены новые переменные:
- $board_title -> TITLE - текст, находящийся в этой переменной высвечивается в заголовке страницы;
- $board_description -> Description - описание страницы (используется поисковиками при составлении рейтинга страницы);
- $board_keywords -> Keywords - ключевые слова страницы. Данные переменные внесены во все скины доски, их наличие повысит рейтинг страниц.

Также ВЕБ-мастера могут легко менять значения этих переменных по своему усмотрению. В версии 1.8.0 настроено автоматическое формирование тэгов Description и Keywords при показе текущего объявления, в остальных блоках формирование переменных "вручную". В следующих сборках "автомат" будет и в списке объявлений;

Если объявление просрочено, то оно уже не показывается в списке "новых объявлений" на главной;

Переписан код вывода текущего объявления. Внешний вид объявления изменён так, чтобы было удобнее листать (кнопки вперёд и назад вынесены вверх страницы), блок о разместившем и фото собраны в левой части, в правой выводится только текст объявления;

Добавлена кнопка в админке: "Удалить фото "старше" 6 месяцев" для всех, у кого на доске накопился "мусор" и нет возможности удалить фото вручную;

В рубриках и при просмотре объявлений теперь в верхней части выводится удобная навигация, например: "Все рубрики » Транспорт » Легковые авто » Продам автомобиль BMW 6". Это удобно для пользователей и повышает рейтинг доски в поисковых системах;

В админку добавлена кнопка: "Разрешить/запретить добавлять в файл городов свои города?";

Исправлен БАГ: если при добавлении объявления с прикреплёнными файлами, файлы с такими именами уже есть на сервере, тогда выдавалось сообщение об ошибке. Теперь в этом случае файлам присваиваем имена случайным образом;

Блок RSS-новостей убран в файл tools.php. Ссылка на rss-канал теперь выглядит так: "tools.php?rss". Если при обновлении доски Вы не меняете скин, то внесите изменения в файл top.html вручную;

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

Доработана система удаления фото в панели администратора. Ранее при удалении объявлений из рубрики или из блока модерирования, фото сохранялось. Теперь фото удаляется;

Исправлено в версии 1.9:

при подаче объявления;
- Предварительная модерация;
- Рассылка уведомлений на продление объявлений из админпанели;
- изменение статуса выбранного объявления на VIP;
- установка пользователю доски привелений VIP (все его объявления располагаются на первых страницах раздела);
- отсутствуют скины : светлоголубой, жёлтый, смешанный и для доски объявлений по недвижимости;
- Личный кабинет с возможностью удалять свои объявления (только просмотр);
- Спец.страницы для распечатки объявлений;
- Часовой пояс для доски объявлений.

Если Вам нужны указанные функции, прочтите условия приоретения

Продолжаем рассмотрение jQuery плагина FullCalendar, установка которого была описана в предыдущей статье . Что бы использовать больше функциональных возможностей плагина, мы настроим добавление, редактирование и удаление событий, которые будут храниться в базе данных MySQL.

Добавление событий

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

Для начала сделаем эту форму модальным диалоговым окном, при помощи jQuery UI Dialog и создадим в ней 4 кнопки: Добавить , Изменить , Удалить и Отмена .

Form.dialog({ autoOpen: false, buttons: [{ id: "add", text: "Добавить", click: function() { //some code } }, { id: "edit", text: "Изменить", click: function() { //some code } }, { id: "cancel", text: "Отмена", click: function() { $(this).dialog("close"); emptyForm(); } }, { id: "delete", text: "Удалить", click: function() { //some code }, disabled: true }] });

После этого создадим переменные для доступа к полям формы, настроим обработчик кнопки Добавить событие , создадим функцию очистки значений формы emptyForm , а так же функцию открытия формы formOpen которая принимает параметр mode :

  • add - добавление события
  • edit - изменение события
var event_start = $("#event_start"); var event_end = $("#event_end"); var event_type = $("#event_type"); var calendar = $("#calendar"); var form = $("#dialog-form"); var event_id = $("#event_id"); var format = "MM/dd/yyyy HH:mm"; /* кнопка добавления события */ $("#add_event_button").button().click(function(){ formOpen("add"); }); /** функция очистки формы */ function emptyForm() { event_start.val(""); event_end.val(""); event_type.val(""); event_id.val(""); } /* режимы открытия формы */ function formOpen(mode) { if(mode == "add") { /* скрываем кнопки Удалить, Изменить и отображаем Добавить*/ $("#add").show(); $("#edit").hide(); $("#delete").button("option", "disabled", true); } else if(mode == "edit") { /* скрываем кнопку Добавить, отображаем Изменить и Удалить*/ $("#edit").show(); $("#add").hide(); $("#delete").button("option", "disabled", false); } form.dialog("open"); }

Теперь при нажатии кнопки Добавить событие мы увидим вот такое диалоговое окно:

Для удобства ввода данных предлагаю использовать jQuery UI Datepicker с небольшой модификацией. Для этого необходимо скачать с сайта плагин Timepicker и подключить к нашему скрипту. После этого активируем Datetimepicker для полей начало и конец:

Event_start.datetimepicker({hourGrid: 4, minuteGrid: 10, dateFormat: "mm/dd/yy"}); event_end.datetimepicker({hourGrid: 4, minuteGrid: 10, dateFormat: "mm/dd/yy"});

Благодаря Timepicker выбор даты и времени станет еще более удобнее:

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

DayClick: function(date, allDay, jsEvent, view) { var newDate = $.fullCalendar.formatDate(date, format); event_start.val(newDate); event_end.val(newDate); formOpen("add"); }

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

CREATE DATABASE fullcalendar; CREATE TABLE events (id INT NOT NULL AUTO_INCREMENT PRIMARY KEY, start DATETIME, end DATETIME, type VARCHAR(20));

Изменим определение кнопки добавления в диалоговой форме, добавив тело обработчика:

{ id: "add", text: "Добавить", click: function() { $.ajax({ type: "POST", url: "ajax.php", data: { start: event_start.val(), end: event_end.val(), type: event_type.val(), op: "add" }, success: function(id){ calendar.fullCalendar("renderEvent", { id: id, title: event_type.val(), start: event_start.val(), end: event_end.val(), allDay: false }); } }); emptyForm(); } }

Данный код извлекает данные из формы и отправляет AJAX запросом скрипту ajax.php с меткой операции op: "add" . Так же после успешного выполнения запроса, мы вызываем функцию renderEvent для добавления события непосредственно в календарь. Вторым параметром передаем объект типа Event, который состоит из интуитивно понятных параметров. Свойство allDay объекта Event показывает занимает ли данное событие весь день. Если метка стоит false , то в календаре рядом с заголовком будет выведено время события.

Содержимое ajax.php для добавления записи в базу данных:

$db = mysql_pconnect("localhost", "rootuser", "123852"); mysql_select_db("fullcalendar"); /* для решения проблемы с русскими символами */ mysql_query("SET NAMES "utf8""); $start = $_POST["start"]; $end = $_POST["end"]; $type = $_POST["type"]; $op = $_POST["op"]; $id = $_POST["id"]; switch ($op) { case "add": $sql = "INSERT INTO events (start, end, type) VALUES ("" . date("Y-m-d H:i:s", strtotime($start)) . "", "" . date("Y-m-d H:i:s", strtotime($end)) . "", "" . $type . "")"; if (mysql_query($sql)) { echo mysql_insert_id(); } break; }

Все предельно просто, соединяемся с базой, извлекаем данных из POST, создаем SQL запрос и выполняем его предварительно преобразовав дату и время в формат MySQL Datetime. На этом функциональная часть добавления события выполнена. Можно динамически добавлять события, которые сразу же будут наноситься на календарь.

Источник событий

Добавлять данные мы научились. Теперь необходимо отобразить их на календаре не только при добавлении, но и при загрузке страницы. Для этого добавим в инициализацию календаря источник данных:

EventSources: [{ url: "ajax.php", type: "POST", data: { op: "source" }, error: function() { alert("Ошибка соединения с источником данных!"); } }]

Этот код делает AJAX запрос передавая параметр op: "source" . Добавим в файл ajax.php операцию возврата данных в формате JSON:

Case "source": $sql = "SELECT * FROM events"; $result = mysql_query($sql); $json = Array(); while ($row = mysql_fetch_assoc($result)) { $json = array("id" => $row["id"], "title" => $row["type"], "start" => $row["start"], "end" => $row["end"], "allDay" => false); } echo json_encode($json); break;

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

Изменение событий

Для изменения событий будем использовать функцию eventClick . Для этого в инициализацию календаря добавим код обработки, который заполняет форму свойствами события и открывает диалоговое окно с параметром edit :

EventClick: function(calEvent, jsEvent, view) { event_id.val(calEvent.id); event_type.val(calEvent.title); event_start.val($.fullCalendar.formatDate(calEvent.start, format)); event_end.val($.fullCalendar.formatDate(calEvent.end, format)); formOpen("edit"); }

Так же добавим обработку нажатия кнопки Изменить в форме:

{ id: "edit", text: "Изменить", click: function() { $.ajax({ type: "POST", url: "ajax.php", data: { id: event_id.val(), start: event_start.val(), end: event_end.val(), type: event_type.val(), op: "edit" }, success: function(id){ calendar.fullCalendar("refetchEvents"); } }); $(this).dialog("close"); emptyForm(); } }

Код очень похож на добавление события, отличается он только операцией op: "edit" , и добавлением в передаваемые данные id события. Так же после успешно выполненной операции AJAX, вызываем функцию календаря refetchEvents , для того что бы заново извлечь информацию для всех событий, таким образом обновив данные календаря. Код файла ajax.php для обновления данных:

Case "edit": $sql = "UPDATE events SET start = "".date("Y-m-d H:i:s", strtotime($start))."", end = "" . date("Y-m-d H:i:s", strtotime($end)) . "", type = "" . $type . "" WHERE id = "" . $id . """; if (mysql_query($sql)) { echo $id; } break;

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

Удаление событий

Для удаления нам необходимо открыть форму в режиме редактирования кликнув по определенному событию. В форме у нас есть кнопка Удалить . Добавим обработчик нажатия кнопки:

{ id: "delete", text: "Удалить", click: function() { $.ajax({ type: "POST", url: "ajax.php", data: { id: event_id.val(), op: "delete" }, success: function(id){ calendar.fullCalendar("removeEvents", id); } }); $(this).dialog("close"); emptyForm(); }, disabled: true }

Здесь мы передаем скрипту только id события и тип операции op: "delete" . После успешного выполнения запроса мы вызываем функцию removeEvents и передаем id события которое удалено. Это нужно для того что бы удалить данное события с календаря. Код файла ajax.php для удаления события:

Case "delete": $sql = "DELETE FROM events WHERE id = "" . $id . """; if (mysql_query($sql)) { echo $id; } break;




Top