Кнопки быстрого редактирования

2750
Всем привет!

Наряду со стандартными дополнениями периодически появляются мысли и потребности в реализации мелких плюшек для InstantCMS 2. Специально для этого я завел здесь у себя в блоге раздел "Разное", где планирую постить интересные мысли, небольшие доработки, хаки и другие подобные мелочи.



Сегодня я хотел бы описать как в список записей можно добавить кнопки "Редактирование" и "Удалить" для быстрого перехода к соответствующим функциям.
При разработке и тестировании одного из дополнений, у меня возникла потребность в частом редактировании записей. Стандартный функционал предполагает для этого перейти в список требуемого типа контента (через меню), затем войти "в тело" самой записи, и только после мы можем нажать кнопку "Редактировать ..." справа в меню действий. На моем уже стареньком компьютере с запущенным OpenServer'ом процесс открытия любой страницы сайта - очень не быстрый. Сокращение списка вышеописанных действий, пусть даже на один шаг, очень экономит время и нервы))).

И так, приступим...


готовый результат

Посмотрим сначала как выводится кнопка "Редактировать" внутри записи. Идем в ..\templates\default\controllers\content\item_view.tpl.php и
находим следующие строки:
Код PHP:
  1. if (cmsUser::isAllowed($ctype['name'], 'edit', 'all') ||
  2. (cmsUser::isAllowed($ctype['name'], 'edit', 'own') && $item['user_id'] == $user->id)){
  3. $this->addToolButton(array(
  4. 'class' => 'edit',
  5. 'title' => sprintf(LANG_CONTENT_EDIT_ITEM, $ctype['labels']['create']),
  6. 'href' => href_to($ctype['name'], 'edit', $item['id'])
  7. ));
  8. }
т.е. перед выводом кнопки проверяется ряд условий, при выполнении которых функции addToolButton() передаются соответствующие параметры (css-класс, заголовок и url). Всё элементарно и понятно)) Переносим подобную структуру в файл ..\templates\default\content\default_list.tpl.php - шаблон вывода списка записей по умолчанию - так, например, выводятся статьи и блоги в дефолтном шаблоне.

Находим тег <div class="content_list_item ...> внутри которого выводятся поля записи (у меня это 23-ая строка), и сразу за ним добавляем найденный код (точнее небольшую его модификацию):
Код PHP:
  1. <?php if (cmsUser::isAllowed($ctype['name'], 'edit', 'all') ||
  2. (cmsUser::isAllowed($ctype['name'], 'edit', 'own') && $item['user_id'] == $user->id)){ ?>
  3. <div class="actions">
  4. <?php if (cmsUser::isAdmin()) { ?>
  5. <a href="<?php echo href_to($ctype['name'], 'delete', $item['id']); ?>" class="delete-this" title="<?php echo sprintf(LANG_CONTENT_DELETE_ITEM, $ctype['labels']['create']); ?>"></a>
  6. <?php } ?>
  7. <a href="<?php echo href_to($ctype['name'], 'edit', $item['id']); ?>" class="edit-this" title="<?php echo sprintf(LANG_CONTENT_EDIT_ITEM, $ctype['labels']['create']); ?>"></a>
  8. </div>
  9. <?php } ?>
Как видно, здесь мы обернули кнопки/ссылки в div с классом "actions" и добавили еще кнопку "Удалить" запись, которая будет показываться только администратору сайта.
Теперь немного стилизуем добавленные ссылки. Открываем файл ..\templates\default\css\theme-content.css и в самом низу добавляем следующие строки:
Код CSS:
  1. .content_list_item .actions {
  2. float: right;
  3. visibility: hidden;
  4. }
  5.  
  6. .content_list_item:hover .actions {
  7. visibility: visible;
  8. }
  9.  
  10. .content_list_item .actions a {
  11. display: inline-block;
  12. width: 16px;
  13. height: 16px;
  14. overflow: hidden;
  15. }
  16.  
  17. .edit-this {
  18. background: url("../images/icons/edit.png") no-repeat center center;
  19. }
  20.  
  21. .delete-this {
  22. margin-right: 5px;
  23. background: url("../images/icons/delete.png") no-repeat center center;
  24. }
Всё! Можем испытывать))
Кнопки "Удалить" и "Редактировать" будут видны администратору сайта для всех записей - тут он царь и бог)) А кнопка "Редактировать", при наведении курсора на статью или пост, будет показываться только автору записи. Гости и остальные пользователи (не авторы) никаких кнопок не увидят. Получился, такой своеобразный хак шаблона))))

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

Всем удачи!
Ещё один виджет бегущей строки для InstantCMS 2.x | "Опросы" для InstantCMS 2.x. Обновление которого так долго ждали ;)
Комментарии (11)
F_a_R_i_D 31 мая 2015 в 00:12 +2
То, что надо!
Респект!
Игорь Lu 31 мая 2015 в 01:45 +1
Правильная задумка, тем более, что бывают ситуации, когда меню действий не выведешь из за особенностей дизайна.
По поводу хостинга, пользуюсь Этим уже больше двух лет. Не дорогой безлимитный хостинг без всяких ограничений и с хорошими параметрами. Можно создавать неограниченное количество доменов и субдоменов и БД на MySQL. Лично у меня на нём лежит больше десятка сайтов и файлов уже поти 100 гигов.
В общем, это как вариант, спросили, поделился, не сочтите за рекламу joke
А за идею, плюс однозначно v
Алексей Тимофеев 31 мая 2015 в 10:08 +1
Val могу делать для вам демо сайты на моем хосте
Алексей Тимофеев 31 мая 2015 в 11:21 0
вам могу делать для вас zst
Val 31 мая 2015 в 22:21 +3
Cтудия Sitestroi, выражаю вам огромную благодарность за предоставление бесплатного хостинга для размещения демо дополнений!
Дмитрий 31 мая 2015 в 23:16 0
Не совсем понятно. Есть же бесплатные хостинги, с вполне приемлемыми параметрами. Например www.hostinger.ru
• Mike • 2 июня 2015 в 17:12 +2
Просьба ко всем — пишите по теме или по тому что с ней явно связано…
Def 15 февраля 2018 в 14:15 0
в 2.9 как можно реализовать? изменились файлы(
Pocus 11 марта 2018 в 11:06 0
Val, спасибо за урок. Ваш код я слегка изменил, с тем, чтобы экспресс-меню было не только у автора и админа, но и у модератора, а так же добавил кнопки корзины. Получилось довольно клёво.



Теперь вопрос ко всем:
Как бы обойтись без правки или создания шаблонов вывода?
Может быть есть какой-то хук, срабатывающий при каждом создании ***_list_item?
Pocus 11 марта 2018 в 11:39 0
Кстати, если кому интересно.
Экспресс-меню
Pocus 11 марта 2018 в 11:58 0
Забыл уточнить.
Чтобы абсолютно-позиционируемое меню отображалось там, где нужно, родительский контейнер должен иметь относительное позиционирование.
Например для "плиточного" шаблона, в файле "ваш_шаблон/css/theme_content.css" добавьте правило для класса:
.content_list.tiled .tile {
...
...
position: relative;
}