- WordPress Mobile Web Development：Beginner's Guide
- Rachel McCollin
- 452字
- 2021-08-13 18:06:19
Time for action—configuring the WordPress Mobile Pack plugin as a theme switcher
To configure the WordPress Mobile Pack plugin as a theme switcher, perform the following steps:
- Download WordPress Mobile Pack from http://wordpress.org/extend/plugins/wordpress-mobile-pack/ if you haven’t already, and activate it.
- On the Mobile Switcher screen, select the responsive theme from the Mobile theme drop-down list. Here, we will select Ari, as shown in the following screenshot. Click on Save Changes.
- Now, let’s see how the site looks, firstly on a desktop and then on a mobile. Note that the site will look the same on tablets as it does on the desktop, as the theme switcher is only activated for mobile devices. The following screenshot shows how the site looks on the desktop:
The look of the site on the mobile is shown in the following screenshot:
What just happened?
Using a theme switcher plugin (WordPress Mobile Pack), we configured our site so that people visiting it on desktop PCs will see the existing theme, while mobile visitors will see our configured version of the Ari theme. We did this using one plugin and two themes, with no coding required.
So, how does it look? Interestingly, it doesn’t look quite the same as when we had Ari as our only theme. The widgets are above the content and we’ve lost the problem with text wrapping around the images. I don’t think the images look quite right when left-aligned like that, but we could always change that with a media query and some tweaks to our CSS (which we’ll learn about in the next two chapters).
All in all, this is a solution with which we don’t have to sacrifice our existing theme and it also gives us a mobile theme, which I think is far superior to those provided by the mobile plugins, with less than half an hour’s work and no coding. That’s what I call a result!
Pop quiz
Now we’ve spent some time getting to grips with responsive themes, let’s see what you can recall. Choose one of the options for each of the following questions:
- A responsive theme is one, which:
- Uses a different theme on mobile devices.
- Uses a combination of fluid layout and media queries to alter the layout for mobile devices.
- Has theme options that you can alter.
- A mobile switcher:
- Uses a responsive theme to display the site differently on mobiles, affecting layout, text, and images.
- Makes a site look different on mobiles.
- Switches the theme used by the site according to the device it’s being viewed on.