PHPackages                             vxm/yii2-mobile-first - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. vxm/yii2-mobile-first

ActiveYii2-extension[Utility & Helpers](/categories/utility)

vxm/yii2-mobile-first
=====================

Support implementing mobile first principle for Yii2 application.

1.0.0(7y ago)55184BSD-3-ClausePHPPHP ^7.1

Since May 1Pushed 7y ago2 watchersCompare

[ Source](https://github.com/vuongxuongminh/yii2-mobile-first)[ Packagist](https://packagist.org/packages/vxm/yii2-mobile-first)[ RSS](/packages/vxm-yii2-mobile-first/feed)WikiDiscussions master Synced today

READMEChangelog (1)Dependencies (2)Versions (2)Used By (0)

Yii2 Mobile First
=================

[](#yii2-mobile-first)

[![Latest Stable Version](https://camo.githubusercontent.com/481c2d24ffea398fbd06b4588bdd31f68edc6d22f59d8cc2c1d6aa504114a224/68747470733a2f2f706f7365722e707567782e6f72672f76786d2f796969322d6d6f62696c652d66697273742f762f737461626c65)](https://packagist.org/packages/vxm/yii2-mobile-first)[![Total Downloads](https://camo.githubusercontent.com/c039ccc04772a9f00668600cb27f0ffbcb445c6dbc220faaaa91aac5a4bfa256/68747470733a2f2f706f7365722e707567782e6f72672f76786d2f796969322d6d6f62696c652d66697273742f646f776e6c6f616473)](https://packagist.org/packages/vxm/yii2-mobile-first)[![Build Status](https://camo.githubusercontent.com/c1d136dbd5fdcc30915cd8ed0413e71188d42b114179f10f82c521e6f0e00bb5/68747470733a2f2f7472617669732d63692e6f72672f76756f6e6778756f6e676d696e682f796969322d6d6f62696c652d66697273742e7376673f6272616e63683d6d6173746572)](https://travis-ci.org/vuongxuongminh/yii2-mobile-first)[![Code Coverage](https://camo.githubusercontent.com/29ee80f47d50ed71a03061863fd18e43e134dfb21a17ea4387eb4f2bd757896f/68747470733a2f2f7363727574696e697a65722d63692e636f6d2f672f76756f6e6778756f6e676d696e682f796969322d6d6f62696c652d66697273742f6261646765732f636f7665726167652e706e673f623d6d6173746572)](https://scrutinizer-ci.com/g/vuongxuongminh/yii2-mobile-first/?branch=master)[![Scrutinizer Code Quality](https://camo.githubusercontent.com/af3412b92ae59816276f00d13aa3916eb1056d066c6ab2fa606fe4018a8915eb/68747470733a2f2f7363727574696e697a65722d63692e636f6d2f672f76756f6e6778756f6e676d696e682f796969322d6d6f62696c652d66697273742f6261646765732f7175616c6974792d73636f72652e706e673f623d6d6173746572)](https://scrutinizer-ci.com/g/vuongxuongminh/yii2-mobile-first/?branch=master)[![Yii2](https://camo.githubusercontent.com/d6b0929173e28cc627430d2519ca1853466a70f37395877eaf4820cb3e1e1909/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f506f77657265645f62792d5969695f4672616d65776f726b2d677265656e2e7376673f7374796c653d666c6174)](http://www.yiiframework.com/)

About it
--------

[](#about-it)

An extension provide an easy way to implementing mobile-first principle base on [Mobile Detect](https://github.com/serbanghita/Mobile-Detect) wrapper for Yii2 application.

Requirements
------------

[](#requirements)

- [PHP >= 7.1](http://php.net)
- [yiisoft/yii2 >= 2.0.13](https://github.com/yiisoft/yii2)

Installation
------------

[](#installation)

Require Yii2 Mobile First using [Composer](https://getcomposer.org):

```
composer require vxm/yii2-mobile-first
```

Usage
-----

[](#usage)

This extension give you two features:

- **Adaptive Filter** support you redirect user to mobile site when detected user using mobile or tablet.
- **View Render Behavior** support you rendering view file by device type (mobile, tablet, iOs, android...).

### Adaptive Filter

[](#adaptive-filter)

To use this filter you just add it to an application config file:

```
[
    'id' => 'test',
    'basePath' => __DIR__,
    'vendorPath' => dirname(__DIR__) . '/vendor',
    'components' => [

    ],
    'as adaptiveFilter' => [
        'class' => 'vxm\mobileFirst\AdaptiveFilter',
        'redirectUrl' => ['https://m.yoursite.com', 'getParam1' => '1']
    ]
]
```

If user go to your site with url: `yoursite.com/product?sort=price` and you want to keep `/product?sort=price` url path when redirect user to mobile site: `m.yoursite.com/product?sort=price` you just config:

```
[
    'id' => 'test',
    'basePath' => __DIR__,
    'vendorPath' => dirname(__DIR__) . '/vendor',
    'components' => [

    ],
    'as adaptiveFilter' => [
        'class' => 'vxm\mobileFirst\AdaptiveFilter',
        'redirectUrl' => ['https://m.yoursite.com', 'getParam1' => '1'],
        'keepUrlPath' => true
    ]
]
```

### View Render Behavior

[](#view-render-behavior)

It is a way to replace a set of views with another by user device without the need of touching the original view rendering code. You can use it to systematically change the look and feel of an application depend on user device. For example, when call `$this->render('about')` in SiteController, you will be rendering the view file `@app/views/site/about.php`, if user use mobile device, the view file `@app/views/site/mobile/about.php` will be rendered, instead.

To use it, you need to attach it to the view application component in configure file:

```
[
    'id' => 'test',
    'basePath' => __DIR__,
    'vendorPath' => dirname(__DIR__) . '/vendor',
    'components' => [
        'view' => [
            'as mobileFirst' => [
                'class' => 'vxm\mobileFirst\ViewRenderBehavior',
                'dirMap' => [
                    'mobile' => 'mobile',
                    'tablet' => 'tablet'
                ]
            ]
        ]
    ]
]
```

The `dirMap` property governs how view files should be replaced by user device. It takes an array of key-value pairs, where the keys are the device types and the values are the corresponding view sub-directory. The replacement is based on user device: if user device match with any key in the `dirMap` array, a view path will be added with the corresponding sub-directory value. Using the above configuration example, when user using `mobile` device because it match the key `mobile`, a view path will be added `mobile` look like `@app/views/site/mobile/about.php`. Of course you can change the value or add more cases:

```
[
    'id' => 'test',
    'basePath' => __DIR__,
    'vendorPath' => dirname(__DIR__) . '/vendor',
    'components' => [
        'view' => [
            'as mobileFirst' => [
                'class' => 'vxm\mobileFirst\ViewRenderBehavior',
                'dirMap' => [
                    'mobile' => 'mobile-tablet',
                    'tablet' => 'mobile-tablet',
                    'ios' => 'ios',
                    'android' => 'android'
                ]
            ]
        ]
    ]
]
```

The above configuration if user using mobile or tablet device, the view path will be added `mobile-tablet`.

###  Health Score

29

—

LowBetter than 60% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity20

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity54

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Unknown

Total

1

Last Release

2567d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/8901d64a1059726b851dbdd91463ad1d3169f9dba6a2dcff11d05f97d9bccaea?d=identicon)[vuongxuongminh](/maintainers/vuongxuongminh)

---

Top Contributors

[![vuongxuongminh](https://avatars.githubusercontent.com/u/38932626?v=4)](https://github.com/vuongxuongminh "vuongxuongminh (6 commits)")

---

Tags

mobile-firstyii2yii2-extensionyii2extensionmobile-first

### Embed Badge

![Health badge](/badges/vxm-yii2-mobile-first/health.svg)

```
[![Health](https://phpackages.com/badges/vxm-yii2-mobile-first/health.svg)](https://phpackages.com/packages/vxm-yii2-mobile-first)
```

###  Alternatives

[dmstr/yii2-cookie-consent

Yii2 Cookie Consent Widget

1452.6k](/packages/dmstr-yii2-cookie-consent)[richardfan1126/yii2-js-register

Yii2 widget to register JS into view

1357.2k7](/packages/richardfan1126-yii2-js-register)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)