Magento 2 module that enables automatic theme switching based on the X-UA-Device HTTP header. (Or any other header)
Magento 2 module that enables automatic theme switching based on X-UA-Device header. (Or any other header)
This module makes sure that Magento's design exceptions logic checks the value of the header "X-UA-Device" in addition to "User-Agent" when determining what theme it should use. You can also configure it to listen to other headers than the pre-configured "X-UA-Device" header.
Because many web proxies, like Varnish, suggest to use the "X-UA-Device" header for device detection and Magento should respect it.
Magento 2 allows for theme switching based on design exceptions which enables "you to specify an alternative theme for particular user-agents".
There are hundreds of user agents out there now and it makes it challenging to correctly identify which agents are coming from mobile, tablet and desktop devices.
There are great libraries for making detection easier - like the generic mobiledetect/mobiledetectlib and the excellent Magento module eadesignro/module-mobiledetect. Those modules will not work out of the box if you have a web proxy like Varnish installed.
That is why I wanted to use the Varnish Mobile Detect module which sends the "X-UA-Device" header from Varnish for device detection rather than tampering with the "User-Agent" header.
In Magento root:
$ composer require siment/module-http-header-theme-switch:"~1.0" $ php bin/magento module:enable Siment_HttpHeaderThemeSwitch $ php bin/magento cache:clean
In Magento admin:
Stores -> (Settings) Configuration -> General -> Design -> HTTP Header Theme Switch -> HTTP Header:
HTTP header which will be matched for theme exceptions in addition to the standard header "User-Agent". Standard value is "HTTP_X_UA_DEVICE"
You define the matching rules under Content -> (Design) Configuration -> (Select a theme) Edit -> User Agent Rules
Make sure the Composer dependencies have been installed and that the "post-install-cmd" scripts have executed.
In module directory:
$ composer install $ composer run-script post-install-cmd # May not be necessary $ vendor/bin/phpunit # For unit tests $ vendor/bin/phpcs # For code sniffs $ vendor/bin/phpmd src/,Test/ text phpmd.xml # For mess detector
Create an issue or a pull request.