avolle / cakephp-font-awesome
FontAwesome plugin for CakePHP
Installs: 2 139
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Type:cakephp-plugin
Requires
- php: ^8.1
- cakephp/cakephp: ^5.0.0
Requires (Dev)
- cakephp/cakephp-codesniffer: ^5.0.0
- phpstan/phpstan: ^1.10.33
- phpunit/phpunit: ^10.3.3
README
Create FontAwesome icons with a CakePHP helper
NB! FontAwesome scripts not included in plugin. You can use FontAwesome kits without downloading assets. See further down.
Version map:
Supports these Fonts:
- Solid
- Regular
- Light
- Thin
- Duo
- Brand
- Sharp * through passing fa-sharp to class option
Installation
composer require avolle/cakephp-font-awesome
Usage
Add FontAwe helper to your AppView (src/View/AppView.php
)
/** * Application View * * @property \Avolle\FontAwesome\View\Helper\FontAweHelper $FontAwe */ class AppView extends View { public function initialize(): void { $this->loadHelper('Avolle/FontAwesome.FontAwe'); } }
Icons with title (optional)
echo $this->FontAwe->solid('receipt'); // <i class="fas fa-receipt"></i> echo $this->FontAwe->regular('receipt', 'Title'); // <i class="far fa-receipt"></i> Title echo $this->FontAwe->light('receipt'); // <i class="fal fa-receipt"></i> echo $this->FontAwe->duo('receipt'); // <i class="fad fa-receipt"></i> echo $this->FontAwe->brand('github'); // <i class="fab fa-github"></i> echo $this->FontAwe->thin('receipt'); // <i class="fat fa-receipt"></i>
Alternatively: Icons with title (optional)
echo $this->FontAwe->icon('fas', 'receipt'); // <i class="fas fa-receipt"></i> echo $this->FontAwe->icon('far', 'receipt', 'Title'); // <i class="far fa-receipt"></i> Title echo $this->FontAwe->icon('fal', 'receipt'); // <i class="fal fa-receipt"></i> echo $this->FontAwe->icon('fad', 'receipt'); // <i class="fad fa-receipt"></i> echo $this->FontAwe->icon('fab', 'github'); // <i class="fab fa-github"></i> echo $this->FontAwe->icon('fat', 'receipt'); // <i class="fat fa-receipt"></i> echo $this->FontAwe->icon(FontAweHelper::SOLID, 'receipt'); // <i class="fas fa-receipt"></i> echo $this->FontAwe->icon(FontAweHelper::REGULAR, 'receipt', 'Title'); // <i class="far fa-receipt"></i> Title echo $this->FontAwe->icon(FontAweHelper::LIGHT, 'receipt'); // <i class="fal fa-receipt"></i> echo $this->FontAwe->icon(FontAweHelper::DUO, 'receipt'); // <i class="fad fa-receipt"></i> echo $this->FontAwe->icon(FontAweHelper::BRAND, 'github'); // <i class="fab fa-github"></i> echo $this->FontAwe->icon(FontAweHelper::THIN, 'receipt'); // <i class="fat fa-receipt"></i>
Links with icon
// Use string urls echo $this->FontAwe->solidLink('receipt', '/some-url'); // <a href="/some-url"><i class="fas fa-receipt"></i></a> // Use router urls echo $this->FontAwe->regularLink('receipt', ['controller' => 'Icons', 'action' => 'index']); // <a href="/icons"><i class="far fa-receipt"></i></a> // Add a title after the icon echo $this->FontAwe->lightLink('receipt', '/some-url/', 'Icons'); // <a href="/some-url"><i class="fal fa-receipt"></i> Icons</a> // Add a class to the icon (not anchor element) echo $this->FontAwe->duoLink('receipt', '/some-url/', 'Icons', ['icon' => ['class' => 'text-success']]); // <a href="/some-url"><i class="fad fa-receipt text-success"></i> Icons</a>
Using the sharp styling
// Icon echo $this->FontAwe->solid('receipt', null, ['class' => 'fa-sharp']); // <i class="fas fa-receipt fa-sharp"></i> // Link echo $this->FontAwe->solidLink('receipt', '/some-url/', null, ['icon' => ['class' => 'fa-sharp']]); // <a href="/some-url"><i class="fas fa-receipt fa-sharp"></i></a>
Load a FontAwesome kit script
echo $this->FontAwe->scriptKit('3247824fdhufhd'); //<script src="https://kit.fontawesome.com/3247824fdhufhd.js" crossorigin="anonymous"></script>
Load a FontAwesome script (not a kit, but either downloaded or CDN)
echo $this->FontAwe->script(); //<script src="/js/all.js"></script> echo $this->FontAwe->script('font-awesome'); //<script src="/js/font-awesome.js"></script> echo $this->FontAwe->script('all', 'font-awesome/'); //<script src="/js/font-awesome/all.js"></script>