Хлебные крошки в CakePHP

"Хлебные крошки" - это удобный способ навигации, который к тому же даёт понять текущее положение на сайте. Для моего текущего проекта этот способ очень упрощает использование. Я задумался, как сделать это наиболее красиво в CakePHP.

На Bakery нашёл только этот ужас. К тому же, это больше подходит под Element, а не Helper. Если сделать Element, то во View можно будет писать

PHP:
  1. <?=$this->renderElement('breadcrumbs', array('items'=> array(
  2.     $html->link('Site group', array('controller'=>'site_groups', 'action'=>'edit', $this->data['Site']['site_group_id'])),
  3.     $html->link('Site', array('controller'=>'sites', 'action'=>'edit', $site['Site']['id'])),
  4.     'Page'
  5. )))?>

Это значит, что мы находимся в разделе "SiteGroup / Site / Page", причём на SiteGroup и Site можно перейти, нажав на ссылки.

breadcrumbs.jpg

Меня наши верстальщики умудрились достать по поводу корректости кода, разделения контента и представления. По их мнению, это список, а список делается с помощью ul-li, а не просто через пробел. Поэтому получается такой Element:

app\views\elements\breadcrumbs.ctp

PHP:
  1. <? if (empty($separator)) $separator = '&#187; ' ?>
  2. <div id="breadcrumbs">
  3.     <ul>
  4.         <li class="first"><?=$html->link('Home', '/')?></li>
  5.         <? if (!empty($items) && is_array($items)) foreach ($items as $item): ?>
  6.             <li><?=$separator.$item?></li>
  7.         <? endforeach ?>
  8.     </ul>
  9. </div>

Можно было бы обойтись без обрамляющего div, но он оставлен для универсальности на случай сложной кроссбраузерной вёрстки. Теперь осталось сделать CSS, чтобы "хлебные крошки" выводились слева направо, а не сверху вниз.

CSS:
  1. #breadcrumbs {
  2.     color: #333;
  3.     padding: 0;
  4.     margin-bottom: 15px;
  5.     font-size: smaller;
  6. }
  7.  
  8. #breadcrumbs ul {
  9.     margin: 0;
  10.     padding: 0;
  11.     display: inline;
  12. }
  13.  
  14. #breadcrumbs ul li {
  15.     margin: 0;
  16.     padding-left: 2px;
  17.     border: none;
  18.     list-style: none;
  19.     display: inline;
  20. }
  21.  
  22. #breadcrumbs ul li a {
  23.     text-decoration: none;
  24. }
  25.  
  26. #breadcrumbs ul li a:hover {
  27.     text-decoration: underline;
  28. }

Этот CSS подключается после стандартного cake.generic.css.


Понравилось?

  1. Подпишись через RSS
  2. Расскажи о http://php.southpark.com.ua друзьям.
    Все способы хороши: ICQ, E-mail, свой блог, комментарий в чужом блоге или сообщение на форуме
  3. Добавь статью на news2.ru, Хабрахабр или в закладки

Огромное спасибо!

И не стесняйтесь комментировать - у меня стоит плагин, который убирает rel="nofollow" у людей, которые написали больше 5 комментариев.

RSS feed | Trackback URI

14 комментариев »

Comment by интернет бизнес
2007-11-27 01:12:15

имхо пока

т.е. пока нет отделения бизнес логики от представления проект мертв (
опять же мое мнение . это к смарти тоже касается.

 
2007-11-27 13:55:19

@интернет бизнес: Что?

 
Comment by Evgeny Sergeev
2007-11-28 04:27:34

ИМХО, "интернет бизнес" - бот :-)

 
Comment by larin Subscribed to comments via email
2007-11-29 16:39:16

Владимир, почему вы решили не делать "хлебные крошки" хелпером?

 
2007-11-29 19:25:59

Helper - это дополнительный модуль, который надо подключать. Я обычно делаю Helpers для больших функций с private методами или набора хотя бы трёх public методов. А для такой мелочи Element, IMHO, самое оно.

 
2007-11-29 19:30:22

Кстати, Helper был бы кстати, если бы был стандартный одинаковый CSS. А так как в нашей компании HTML+CSS+JS я пишу очень редко, то я слабо влияю на стандартность.

 
Comment by larin Subscribed to comments via email
2007-11-29 19:39:01

В принципе верное, ИМХО, "хлебные крошки" вообще должны быть в системе на уровне ядра, но это ИМХО

А на счет единой структуры, то в 99% случаев "хлебные крошки" это не маркированный список. А CSS & JS должны идти отдельно, так что можно сделать и хелпером. =)

 
Comment by Влад
2007-12-05 17:04:47

Красивый код пишешь, Владимир! :) РЕспект

Читаю и учусь :)

 
2007-12-05 21:41:59

@larin: А как это на уровне ядра? В смысле, как $form? Но ведь это не такая уж и стандартная штука. В CakePHP даже меню не на уровне ядра, а ведь по меню намного меньше разногласий, что это точно список :)

Мне кажется, что в ядро должно быть вкючены только стандартные сложные вещи вроде форм, сессий, отправки e-mail. А для всякие визуальные удобности, которые у всех разные, должны быть легко для себя один раз написаны и потом постоянно использоваться, меняя только параметры и CSS. А то получится какая-то Symfony :)

Кстати, в большинстве случаев я не призываю напрямую пользоваться моим кодом - просто показываю как с Cake всё легко делается. И мои "хлебные крошки" могут натолкнуть кого-то на мысль как сделать свою навигацию, например, то же меню.

 
Comment by larin Subscribed to comments via email
2007-12-05 22:43:16

Как это не такая стандартная? Ее по-моему нет только в блогах и то не во всех. А вообще делайте ее для себя стандартной и пользователи вам скажут спасибо.

Меню не включено, потому что меню может разделяться, так сказать на несколько блоков, и тогда стандартность исчезает... А хлебные крошни ИМХО, должны быть на каждом сайте и их устройство полностью инвариантно.

 
2007-12-06 00:30:59

Я тоже юзабилист ещё тот и сам знаю, что хлебные крошки нужны :)
Но, во-первых, это не догма - они нужны не всегда, иногда они только мешают. Вот, например, сайт, который мы когда-то давно делали - http://www.simoniz.ua/rus/ . Там хлебные крошки совсем не подходят. Конечно, можно сказать, что это же не "веб-приложение", а обычный сайт. Но наши "веб-приложения" условно можно поделить на 2 категории - с внешней сложностью на уровне того сайта (самое сложное внутри - пользователи этого не видят) и что-то вроде http://extjs.com/deploy/dev/examples/feed-viewer/view.html (но с на порядок более сложным интерфейсом; там приходится придумывать не хлебокрошечную навигацию). Кстати, CakePHP+ExtJS - это очень круто. В философии обоих фрейморков поощиряется разбивка задачи на много ajax-запросов. Это больше напрягает сервер, но зато меньше кода, проще поддерживать и интерфейс получается более удобным.

В общем, я хотел сказать, мне кажется, CakePHP - это не Drupal и он не должен быть конструктором определённого типа сайтов. Его мощь как раз в его универсальности, на нём можно одинаково просто делать абсолютно разные вещи и при этом не путаться в куче кода ядра, которое сейчас компактное и довольно шустрое. При этом он заставляет делать одинаковые вещи одинаково, а не даёт Zendовскую полную свободу.

 
Comment by KPOTOB Subscribed to comments via email
2007-12-17 20:18:21

Для себя, как эксперимент, делал генерацию breadcrumb от модели/инстанса.
Гораздо приятнее видеть путь не по типам а по реальным данным

 
Comment by ring0
2008-09-07 15:03:47

Полностью согласен с вашими верстальщиками. Хлебные крошки - это список. Другое дело, что не всегда их можно использовать. Например когда в древовидном каталоге элемент может находится в разных категориях. Когда просматривается подробная информация об элементе, то хлебные крошки становится затруднительно построить.

 
Pingback by Хлебные крошки в CakePHP | Meelky Blog Subscribed to comments via email
2008-12-30 17:26:44

[...] русскоязычных блогах. Вместо этого используют разные велосипеды. Они, несомненно хороши, однако я всё-таки склоняюсь к [...]

 
Имя (required)
E-mail (required - never shown publicly)
URL
Текст комментария
You may use <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> in your comment.