Themes »Mobile Themes
When a visitor browses to a WordPress.com blog on a mobile device, we show special themes designed to work on small screens focusing on fast load times.
Depending on your current theme and the type of mobile device, you will see one of the mobile themes.
- Mobile-ready theme + rich browser on modern mobile devices:
If you are using one of the themes that are smartphone-ready, that’s what you will see on rich browsers on iPhone, Android, and other smartphones and tablets.
- Non-mobile theme + rich browser on modern mobile devices:
If your current theme is not smartphone-ready, the standard WordPress.com mobile theme is displayed on modern mobile devices.
- Any theme + older devices:
To all other devices, you will see a version of the WordPress Mobile Edition theme.
The WordPress.com mobile theme features your header image and custom background. When viewing your blog on older phones, the focus will be on loading the blog quickly while displaying the important information about your content.
Disabling Mobile Themes
If you would like to disable mobile themes on your blog, go to Appearance -> Mobile in the Dashboard and select “No” for “Enable mobile theme” option. All visitors will see the full theme of your blog, but keep in mind this will:
- prevent users on old cell phones from viewing your content
- slows down the display of your site on mobile devices
Switching Between Full Site & Mobile Site View
Mobile visitors can switch to the full version of your blog using the links at the bottom of each page.
To switch back to the mobile-ready view, click “View Mobile Site” link provided at the bottom.
The custom header image, custom header text color, and custom background color and image are honored on up-to-date browsers for modern mobile devices.
If you have the Custom Design upgrade and use Custom CSS, you can opt to apply custom CSS to the WordPress.com mobile theme. To enable this option, go to Appearance > Customize > CSS and check the “Include this CSS in the Mobile Theme” option. Then use “.mobile-theme” at the beginning of your CSS selectors to target just the mobile theme.