Mobile Features

Version 2.2 introduces both the ability to create mobile pages using page templates and some site-wide code and styling changes to make all pages more friendly for mobile users. The latter is activated as soon as you upgrade to v2.2 but the former piece needs to be configured to start working.

In short, you’re creating a new page with a single-column layout and adding widgets to control the display. This lets you create a page with the most important information gathered near the top.

Configuring mobile styling and features

1) Create a mobile page template

1. In the admin, click Pages then Add New
2. Give your mobile page a Title (this won’t be seen by your users)
3. The Body text is also not used on the mobile template so this can be left blank
4. On the right side, under “Page Attributes,” select “Mobile page”
5. Now, just below the title field, you’ll see the “Permalink” that will be your mobile page. You can edit the path here to be whatever you’d like. Most popular are “m” or “mobile.”
6. Now, publish the page and you’re ready to configure what is being displayed

2) Add widgets to the mobile page

1. In the admin, go to Appearance then Widgets
2. Now that you’ve published the mobile page, you should see a widget area on the right called “Mobile” with your page title attached
3. Drag and drop any widgets you’d like using the regular widget process
4. Once you’re complete, visit the mobile page to make sure things are appearing as they should

What you want to do here is add widgets that let you keep the most important information concentrated at the top. You could add posted widgets for each of your categories with only 5 links in each or just add a widget that shows the featured posts. Alternatively, you could create a new category specifically for the mobile site.

3) Configure the mobile options

All the mobile options are explained in detail on this page.

4) Add a menu for the mobile template (optional)

The mobile page template has its own location for a new menu. Follow these steps to create a menu and add it to “Menu for mobile site” template location.

5) Configure mobile advertising [v2.7 and above]

WP-Drudge can display different ads based on the size of your visitors’ screens. The theme loads both advertisements at the same time and hides one depending on the screen size. the main purpose behind this is to load ads that are of the proper size (300 pixels or less wide) and technology (no Flash ads) for mobile and desktop users alike. This will require you to create 2 ads for each location, one for desktop and one for mobile.

For this to work, you’ll need to have:

• Responsive CSS turned on for the whole site (options page, Mobile tab)
• Responsive ads turned on(options page, Mobile tab)
• Ad code or images for both the regular and mobile location (adding advertisements is covered here) for the ad locations you want to use

With all of these options activated, your mobile users will see different ads from your desktop users.