Home

¿Que es un Breadcrumb?

El Breadcrumb es un elemento de orientación dentro del sitio, por lo regular este elemento se encuentra posicionado entre la cabezera y en contentenido principal del sitio.

El Breadcrumb ofrece al usuario su ubicación actual dentro del sitio. El término viene de la pista de migas de pan que dejan Hansel y Gretel en el popular cuento.

En ejemplo de su vista en el sitio web, seria de la siguiente manera.

Home > Sección Página > Subsección página o Portada del sitio > Sección del sitio > Página de la subsección

Tipos de Breadcrumb

Existen 3 tipos:

• Ruta de acceso: Son dinámicas y muestran la ruta que el usuario ha empleado para llegar a una página.
• Ubucación: Son de tipo estatico e informa del lugar, dentro del sitio web, donde se encuentra la página y es independiente a la navegación que el usuario a seguido
• Atributo: Muestran información que categoriza la página actual.

Instalación

Pegar el archivo en la siguiente ruta default\app\libs\

Modificar el archivo de configuración

Agregamos al archivo default\app\config\config.ini el switch breadcrumb que activa(true) o inactiva(false) el breadcrumb.

routes = On
breadcrumb = true

Crear partial breadcrumb.phtml

Crear en default\app\views_shared\partials\ el archivo breadcrumb.phtml con el siguiente contenido.

<?php if(Config::get('config.application.breadcrumb')): ?>
<div id="breadcrumb">
  <?php
    Load::lib('breadcrumb');
    $Crumb = new Breadcrumb();
    $Crumb->addCrumb(0, _('Inicio'), Router::get('module'));
    $Crumb->addCrumb(1, Router::get('controller'), Router::get('module') . '/' . Router::get('controller'));
    $Crumb->addCrumb(2, Router::get('action'), Router::get('module') . '/' . Router::get('controller') . '/' . Router::get('action'));
    echo $Crumb->display();
  ?>
</div>
<?php endif; ?>

Configuraciones al Breadcrumb

$Crumb->separator

(string)Modifica el separador para los item del crumb, por default es ».

$Crumb->separator = ' | ';

$Crumb->class_ul

(string)Nombre de la clase para ul en la lista, por default es NULL.

$Crumb->class_ul = 'breadcrumb_ul';

$Crumb->class_separator

(string)Nombre de la clase para li del separador, por default es NULL.

$Crumb->class_separator 'breadcrumb_li';

$Crumb->camel_case

(bool)Aplica notación CamelCase(ucwords) a los titulos de los items, por default es true.

$Crumb->camel_case = TRUE

$Crumb->upper_case

(bool)Transforma a mayusculas(strtoupper) los titulos de los items, por default es false.

$Crumb->upper_case = FALSE

$Crumb->lower_case

(bool)Transforma a minusculas(strtolower) los titulos de los items, por default es false.

$Crumb->lower_case = FALSE

$Crumb->cut

(bool)Corta los titulos de los items, por default es false.

$Crumb->cut = FALSE

$Crumb->cut_len_max

(int)Longitud maxima del titulo, si esta activado $Crumb->cut evalua si la longitud del titulo es mayor a $Crumb->cut_len_max para realizar el corte, por default es 10.

$Crumb->cut_len_max = 10

Desde el controlador

Modificar el switch del Breadcrumb

Activar la impresion del Breadcrumb.

Config::set('config.application.breadcrumb', TRUE)

Inactivar la impresion del Breadcrumb.

Config::set('config.application.breadcrumb', FALSE)

Breadcrumb::add($title, string $url)

Agrega un crumb al final del Breadcrumb.

• string $title => Titulo del crumb.
• string $url => URL destino.

Breadcrumb::update($key, $title, $url)

Actualiza un crumb siempre y cuando este definido, para respetar el valor original de title o url se debe pasar como parametro un punto(.).

• int $key => Index del crumb.
• string $title => Titulo del crumb.
• string $url => URL destino.

Imagenes de ejemplo

Ejemplo estilo sencillo.

Ejemplo estilo avanzado

---

IRC KumbiaPHP