| | |

How to: Add jScrollPane Scrollbars to WordPress Twenty Eleven Child Theme

ByReid Walley

Overview: Add iFrame-like scrolling to content, but only on specific pages Solution: Create Page template and add jScrollPane jQuery Live example: jScrollPane jQuery scrollbars on Body Conceptions 1. Download jScrollPane – Cross-browser styleable scrollbars with jQuery and CSS 2. Place Script and Style folders in child theme folder 3. Copy header.php file from Twenty Eleven,…

| | |

WP Twenty Eleven – Remove White Space At Top Of Page

ByReid Walley

Goal: Remove white space from top of page (between top of header and top of page). Solution: Add the following to Child theme’s style.css file: /* Remove white space between top of header and top of page */ #page { margin-top: 0; } Let’s also remove the gray line at the top of the header….

| | | |

WP Twenty Eleven – Custom Header Widget & Header Color

ByReid Walley

Goal: Add Social Media Widget‘s social media icons into Header area Solution: Replace WP Twenty Eleven’s search box with a Widget area, but still display the search box when no Widget is used. Reference (from WP Tuts Plus): Creating a Simple Child Theme Using Twenty Eleven includes instructions on how to add a widget to…

| |

WP Twenty Eleven – Add Responsive Image Rotator to Header

ByReid Walley

Goal: Rotating images, in WP Twenty Eleven’s child theme header, that are also “responsive” (they shrink to different device sizes): WP Rotator plugin (to add rotating images) Flex Slider for WP Rotator plugin (to make the rotating images “responsive”) – Turns WP Rotator into a fully “responsive” jQuery slider – MUST have WP Rotator installed…