Code Monkey home page Code Monkey logo

sergiodanilojr / breadcrumb Goto Github PK

View Code? Open in Web Editor NEW
4.0 1.0 2.0 33 KB

Breadcrumbs in an uncomplicated way. This component facilitates the way to create breadcrumbs for your website, to favor a more accessible navigation. It was designed to work very well with the Bootstrap Framework. Besides being very easy to use, it has very interesting possibilities, such as adding new separators and new CSS classes to style this interface component to your liking. The Breadcrumb Component also allows you to have access to the Array assembled to feed into other features of your system, such as a microformat, for example.

License: MIT License

PHP 100.00%

breadcrumb's Introduction

Breadcrumb @ElePHPant

Maintainer Source Code PHP from Packagist Latest Version Software License Build Quality Score Total Downloads

Breadcrumbs in an uncomplicated way. This component facilitates the way to create breadcrumbs for your website, to favor a more accessible navigation. It was designed to work very well with the Bootstrap Framework. Besides being very easy to use, it has very interesting possibilities, such as adding new separators and new CSS classes to style this interface component to your liking. The Breadcrumb Component also allows you to have access to the Array assembled to feed into other features of your system, such as a microformat, for example.

Breadcrumbs de maneira descomplicada. Este componente facilita a forma de criar breadcrumbs para o seu website, para favorecer uma navegação mais acessível. Foi projetadopara trabalhar muito bem com o Bootstrap Framework. Além de ser muito fácil de utilizar ele conta com possibilidades bem interessantes, como adicionar novos separadores e novas classes CSS para estilizar ao seu gosto este componente da interface. O Breadcrumb Component também possibilita que você tenha acesso ao Array montado para alimentar em outras features do seu sistem, como um microformato, por exemplo.

Highlights

  • Add others classes CSS (adicione outras classes CSS)
  • Output as array (saída em Array)
  • It's possible add a other separator (possibilita adicionar outro separador de Links*)
  • Compatible with Bootstrap Framework (compatível com o Framework CSS Bootstrap)
  • Composer ready and PSR-2 compliant (Pronto para o composer e compatível com PSR-2)

Installation

Breadcrumb is available via Composer:

"elephpant/breadcrumb": "^1.1"

or run

composer require elephpant/breadcrumb

Documentation

For details on how to use, see a sample folder in the component directory. In it you will have an example of use for each class. It works like this:

Para mais detalhes sobre como usar, veja uma pasta de exemplo no diretório do componente. Nela terá um exemplo de uso para cada classe. Ele funciona assim:

Set all nodes of Your Web Page:

<?php
require __DIR__ . "/../vendor/autoload.php";

$breadcrumb = (new \ElePHPant\Breadcrumb\Breadcrumb(null))
    ->base("https://www.sergiodanilojr.com.br", "Home")
    ->addCrumb("Blog", "blog")
    ->addCrumb("Nome do Artigo", "url-do-artigo")
    ->addCrumb("Comentários", "comments");

//In Your webpage you can show the breadcrum, like that
echo $breadcrumb->render();

Change the links separator in the constructor method:

<?php
require __DIR__ . "/../vendor/autoload.php";
$separator = "<i class='icon-angle-right'></i>";

$breadcrumb = (new \ElePHPant\Breadcrumb\Breadcrumb($separator));

//NOTEs:
// The default value of the separator is null. But the Bootstrap use with the 'content' attribute the slash ("/") like a separator 
// The separator's of string type, therefore you can set html or just a character (example: '>>')

Choose if you want show the Home Page Name and insert a icon in the place:

<?php
require __DIR__ . "/../vendor/autoload.php";
$icon = "<i class='icon-home'></i>";

$breadcrumb = (new \ElePHPant\Breadcrumb\Breadcrumb(null));
$breadcrumb->base("https://elephpant.com.br", "Home",false, $icon);
//NOTE: The third param's is false for hide the name (Home)

//If you want to put another class insert value in the 5th param:
$class = "p-3 rounded";
$breadcrumb->base("https://elephpant.com.br", "Home",false, $icon, $class);

Insert a class in the Crumb (link):

<?php
require __DIR__ . "/../vendor/autoload.php";
$class = "text-underline text-danger";

$breadcrumb = (new \ElePHPant\Breadcrumb\Breadcrumb(null));
$breadcrumb->base("https://elephpant.com.br", "Home",false, $icon)
->addCrumb("Blog", "blog", $class);

Output all nodes of your Breadcrumb as array

<?php
require __DIR__ . "/../vendor/autoload.php";

$breadcrumb = (new \ElePHPant\Breadcrumb\Breadcrumb(null))
    ->base("https://www.sergiodanilojr.com.br", "Home")
    ->addCrumb("Blog", "blog")
    ->addCrumb("Nome do Artigo", "url-do-artigo")
    ->addCrumb("Comentários", "comments");

print_r($breadcrumb->allCrumbs());

Contributing

Please see CONTRIBUTING for details.

Support

Security: If you discover any security related issues, please email [email protected] instead of using the issue tracker.

Se você descobrir algum problema relacionado à segurança, envie um e-mail para [email protected] em vez de usar o rastreador de problemas.

Thank you

Credits

License

The MIT License (MIT). Please see License File for more information.

breadcrumb's People

Contributors

sergiodanilojr avatar wilderamorim avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.