Guest

3 column twenty eleven http://zeaks.org

By: Zeaks on Aug 16th, 2011  |  syntax: PHP  |  size: 1.45 KB  |  hits: 878  |  expires: Never
download  |  raw  |  embed  |  report abuse
Copied
  1. */ ADD TO FUNCTIONS.PHP */
  2.  
  3. // Register out extra sidebar for the three column layouts
  4.         register_sidebar( array(
  5.                 'name' => __( 'Extra Sidebar', 'twentyeleven' ),
  6.                 'id' => 'extra-sidebar',
  7.                 'description' => __( 'The sidebar for three column layouts', 'twentyeleven' ),
  8.                 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  9.                 'after_widget' => "</aside>",
  10.                 'before_title' => '<h3 class="widget-title">',
  11.                 'after_title' => '</h3>',
  12.         ) );
  13.  
  14. /* ADD TO SIDEBAR.PHP AFTER #SECONDARY DIV */
  15.  
  16.         <!-- Add our .extra-sidebar are for three column layouts -->
  17. <div id="extra-sidebar" class="widget-area" role="complementary">
  18.     <?php if ( ! dynamic_sidebar( 'extra-sidebar' ) ) : ?>
  19.     <?php endif; // end extra sidebar widget area ?>
  20. </div><!-- .extra-sidebar .widget-area -->
  21.  
  22.  
  23. /* CSS for 3 column Layout
  24. ------------------------------------------------ */
  25. #page { max-width: 989px;}
  26. #primary {
  27.    float: left;
  28.     margin: 0 -26.4% 0 0;
  29.     width: 100%;
  30. }
  31. #content {
  32.    margin: 0 34% 0 26.4%;
  33.     width: 46.4%;
  34. }
  35. #secondary {
  36.    float: right;
  37.     margin-right: 2.6%;
  38.     width: 19.8%;
  39. }
  40. #extra-sidebar{
  41.         position:relative;
  42.     float: left;
  43.     width: 19.8%;
  44.     margin-left: -70%;
  45. }
  46. /* Adjust the comments */
  47. .commentlist, #respond {
  48.    margin-right: -2%;
  49. }
  50. /* Extra sidebar fix for narrow browsers/media devices */
  51. @media (max-width: 800px) {
  52. #main #extra-sidebar{
  53.                 float: none;
  54.                 margin: 0 7.6%;
  55.                 width: auto;
  56.         }
  57. }