Title: Make Mobile Friendly
Last modified: August 22, 2016
---
# Make Mobile Friendly
* [youtalkmedia](https://wordpress.org/support/users/youtalkmedia/)
* (@youtalkmedia)
* [11 years, 9 months ago](https://wordpress.org/support/topic/make-mobile-friendly/)
* Hey,
* I love the plugin, but it does not work will with small mobile screens (if you
have larger ratings on desktops)
* I coded in a mobile setting for myself, and I think it would be a good add on
to the plugin.
* The code is as follows:
* For the mobile options in admin.
* ```
//Adding Mobile Widht Height And Stars
BhittaniPlugin_AdminMarkup::input(array(
'title' => 'Width of single star on mobile',
'description' => 'Set the width of a single star in pixels(px).
Note: All stars must be of equal width',
'field' => 'kksr_stars_w_m',
'value' => get_option('kksr_stars_w_m')
));
BhittaniPlugin_AdminMarkup::input(array(
'title' => 'Height of single star on mobile',
'description' => 'Set the height of a single star in pixels(px).
Note: All stars must be of equal height',
'field' => 'kksr_stars_h_m',
'value' => get_option('kksr_stars_h_m')
));
BhittaniPlugin_AdminMarkup::image(array(
'title' => 'Gray Star',
'description' => 'You can modify the gray star image here',
'field' => 'kksr_stars_gray_m',
'label' => 'Choose an image',
'caption' => 'Gray Star',
'value' => get_option('kksr_stars_gray_m') ? get_option('kksr_stars_gray_m') : BhittaniPlugin_kkStarRatings::file_uri('gray.png')
));
BhittaniPlugin_AdminMarkup::image(array(
'title' => 'Yellow Star',
'description' => 'You can modify the yellow star image here for mobile',
'field' => 'kksr_stars_yellow_m',
'label' => 'Choose an image',
'caption' => 'Yellow Star',
'value' => get_option('kksr_stars_yellow_m') ? get_option('kksr_stars_yellow_m') : BhittaniPlugin_kkStarRatings::file_uri('yellow.png')
));
BhittaniPlugin_AdminMarkup::image(array(
'title' => 'Orange Star',
'description' => 'You can modify the orange star image here for mobile',
'field' => 'kksr_stars_orange_m',
'label' => 'Choose an image',
'caption' => 'Orange Star',
'value' => get_option('kksr_stars_orange_m') ? get_option('kksr_stars_orange_m') : BhittaniPlugin_kkStarRatings::file_uri('orange.png')
));
```
* For the mobile options to be used on site:
* ```
$user_agent = strtolower( $_SERVER['HTTP_USER_AGENT'] );
$mob = false;
if ( preg_match ( "/phone|iphone|itouch|ipod|symbian|android|htc_|htc-|palmos|blackberry|opera mini|iemobile|windows ce|nokia|fennec|hiptop|kindle|mot |mot-|webos\/|samsung|sonyericsson|^sie-|nintendo/", $user_agent ) ) {
// these are the most common
$mob = true;
} else if ( preg_match ( "/mobile|pda;|avantgo|eudoraweb|minimo|netfront|brew|teleca|lg;|lge |wap;| wap /", $user_agent ) ) {
// these are less common, and might not be worth checking
$mob = true;
}
if($mob == true){
$star_w = parent::get_options('kksr_stars_w') ? parent::get_options('kksr_stars_w_m') : 24;
$star_h = parent::get_options('kksr_stars_h') ? parent::get_options('kksr_stars_h_m') : 24;
$star_gray = parent::get_options('kksr_stars_gray_m');
$star_yellow = parent::get_options('kksr_stars_yellow_m');
$star_orange = parent::get_options('kksr_stars_orange_m');
}else{
$star_w = parent::get_options('kksr_stars_w') ? parent::get_options('kksr_stars_w') : 24;
$star_h = parent::get_options('kksr_stars_h') ? parent::get_options('kksr_stars_h') : 24;
$star_gray = parent::get_options('kksr_stars_gray');
$star_yellow = parent::get_options('kksr_stars_yellow');
$star_orange = parent::get_options('kksr_stars_orange');
}
```
* What that code does is checks if it is a mobile device, and if so, it loads the
mobile options.
* [https://wordpress.org/plugins/kk-star-ratings/](https://wordpress.org/plugins/kk-star-ratings/)
Viewing 1 replies (of 1 total)
* [richelliot](https://wordpress.org/support/users/richelliot/)
* (@richelliot)
* [11 years, 8 months ago](https://wordpress.org/support/topic/make-mobile-friendly/#post-5219452)
* Great work here. Just implemented it and it works a treat. Worth mentioning for
future readers – the first bit of code needs to be inserted into admin.php line
50, and the second bit into index.php line 124(ish)
Viewing 1 replies (of 1 total)
The topic ‘Make Mobile Friendly’ is closed to new replies.
* 
* [kk Star Ratings - Rate Post & Collect User Feedbacks](https://wordpress.org/plugins/kk-star-ratings/)
* [Frequently Asked Questions](https://wordpress.org/plugins/kk-star-ratings/#faq)
* [Support Threads](https://wordpress.org/support/plugin/kk-star-ratings/)
* [Active Topics](https://wordpress.org/support/plugin/kk-star-ratings/active/)
* [Unresolved Topics](https://wordpress.org/support/plugin/kk-star-ratings/unresolved/)
* [Reviews](https://wordpress.org/support/plugin/kk-star-ratings/reviews/)
## Tags
* [admin](https://wordpress.org/support/topic-tag/admin/)
* [code](https://wordpress.org/support/topic-tag/code/)
* [mobile](https://wordpress.org/support/topic-tag/mobile/)
* [php](https://wordpress.org/support/topic-tag/php/)
* 1 reply
* 2 participants
* Last reply from: [richelliot](https://wordpress.org/support/users/richelliot/)
* Last activity: [11 years, 8 months ago](https://wordpress.org/support/topic/make-mobile-friendly/#post-5219452)
* Status: not resolved