Gwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywnaGwiazdka nieaktywna
 

Istnieje wiele bibliotek zawierających ikony przystosowane do stron internetowych. Jedną z nich jest Font Awesome, podstawowa wersja biblioteki jest darmowa. Instalację biblioteki przedstawiliśmy w artykule „Jak zainstalować ikony Font Awesome w Zend Framework 3”.

Kod <i class="far fa-save text-success"></i>, odpowiedzialny za wyświetlenie ikony dyskietki umieszczamy w kluczu label. Na początku dodany kod HTML zostanie wyświetlony jako tekst. Odpowiada za to klucz disable_html_escape, który domyślnie ma przypisaną wartość false, dlatego zmieniamy wartość na true (Listing 1.). Działanie kodu możemy zobaczyć na rysunku 1. 

Kolor ikony dodaliśmy za pomocą klasy text-success, pochodzącej z biblioteki Bootstrap.

 

Listing 1. Fragment pliku LanguageForm.php

...
// Font Button Zend Form
$this->add([
   'name' => 'save',
   'type' => Button::class,
   // icon Button Zend Framework 3
   'options' => [
      'label' => '<i class="far fa-save text-success"></i>&nbsp;Zapisz',
      'label_options' => [
         'disable_html_escape' => true,
      ],
   ],
   'attributes' => [
      'value' => 'save',
      'type' => 'submit',
      'title' => 'Zapisz nowy język dla treści',
      'class' => 'btn btn-outline-secondary',
      'data-toggle' => 'tooltip',
      'data-placement' => 'top',
   ],
]);
... 

 

Listing 2. Fragment pliku widoku create.phtml

...
$this->formButton($form->get('save'));
... 

 

 

Rys. 1. Prezentacja przycisku z ikoną w przeglądarce Chrome

Rys. 1. Prezentacja przycisku z ikoną w przeglądarce Chrome

 

W przyszłości kody HTML ikon mogą zostać zmienione, ikony Font Awesome znajdziemy pod adresem https://fontawesome.com/icons?d=gallery.

 

Wybrane książki:

  1. Adam Omelak: Zend Framework 3. Poradnik programisty, Wydawnictwo Helion, 2017
  2. Eric A. Meyer, Estelle Weyl: CSS. Kaskadowe arkusze stylów. Przewodnik encyklopedyczny. Wydanie IV, Wydawnictwo Helion, 2019.
  3. Keith J. Grant: CSS od podszewki, Wydawnictwo Helion, 2019.

Wybrane strony:

  1. Domeny, Serwery, Wizytówki w dobrych cenach!
  2. Zend Framework Documentation
  3. Font Awesome
  4. Bootstrap

  

Książki Helion