Uikit3 for Yii2

Installs: 12 101

Dependents: 3

Suggesters: 0

Security: 0

Stars: 4

Watchers: 3

Forks: 10

Open Issues: 0


1.2.12 2018-01-17 07:04 UTC

This package is not auto-updated.

Last update: 2021-09-04 01:49:33 UTC


Widgets & assets for a lightweight and modular front-end framework UiKit

Installation of yii2-uikit Extension

The preferred way to install this extension is through composer. You have to set in your project's composer.json to use this package, because of Uikit 3 RC version.

"minimum-stability": "dev",

After this settings, just run:

composer require --prefer-dist worstinme/yii2-uikit:"dev-master"

or add

"worstinme/yii2-uikit": "dev-master"

to the require section of your composer.json file and start composer update

Assets usage exaple:

For example, including main UiKit css & js files in any view files


ActiveForm improvements examples:

Horizontal layout for ActiveForm

$form = ActiveForm::begin([
    'layout'=>'horizontal', // also available 'stacked' option

To get a column layout in grid mode you can modify those options

$form = ActiveForm::begin([
    'options'=>['class'=>'uk-child-width-1-2@m uk-form-small uk-grid-match'],
    'fieldConfig' => [
        'width' => "1-3@m"

Different options for single field


ActiveField additional methods:

The code below will generate question icon (?), placed after label text, with information showed with uk-tooltip

$form->field($model,'attribute')->label('label')->info('Additional info to the label of this field');

This will generate <i uk-icon="lock"></i> inside input field wrapped by div.uk-inline


Icon can be placed in the right side of input field or changed to non uikit icon by this settings

$form->field($model,'attribute')->icon('<i class="fas fa-user"></i>',['flip'=>true,'uikit'=>false,'tag'=>'a','href'=>'http://example.com']);

Alert widgets:

Alert renders an alert uikit component.

For example,

echo Alert::widget([
  'body' => 'Say hello...',

The following example will show the content enclosed between the [[begin()]] and [[end()]] calls within the alert box:

  'type' => 'warning',

echo 'Say hello...';


And the AlertFlashes widget to automatically call alert widgets for existing flash messages stored in session