moving widget area

• 

  awaywiththespoons · Member · Dec 23, 2014 at 5:27 pm

  • Copy link
  • Add topic to favorites

  Does anyone know if it is possible to use CSS to move the “main sidebar” widget area in hum theme from the footer area to the actual sidebar area.

  I wanted my widgets in the sidebar area (below the logo), but they actually appear in the footer.

  thank you!

  The blog I need help with is: (visible only to logged in users)

• 

  staff-happychia · Staff · Dec 24, 2014 at 8:22 am

  • Copy link

  It is easier to switch to a theme that supports the sidebars in the place you wish rather than dealing with CSS.

  Are you okay to switch to a new theme? Here are the themes in the WP.com theme directory that sport left and right sidebars: http://theme.wordpress.com/themes/features/left-sidebar+right-sidebar/

• 

  awaywiththespoons · Member · Dec 24, 2014 at 3:53 pm

  • Copy link

  Is there no way of using CSS? I have edited it before on my sites, and also program in Java, so if it is possible I’d prefer to use CSS.

• 

  awaywiththespoons · Member · Dec 24, 2014 at 4:25 pm

  • Copy link

  Hi I managed to move the widgets using this code. BUT the problem is the widgets scroll with the page -rather than static with the logo.

  Is there a way to fix them to the logo?

  /*moving the widget area*/
  
  #page {
  	position: relative;
  }
  
  #text-7 {
  position: absolute;
  top: 250px;
  left: 0px;
  width: 20%;
  }	
  
  #categories-4 {
  position: absolute;
  top: 450px;
  left: 0px;
  }
  
  #twitter-6 {
  position: absolute;
  top: 550px;
  left: 0px;
  width: 20%;
  }

• 

  staff-happychia · Staff · Dec 24, 2014 at 10:43 pm

  • Copy link

  Let’s try the following style:

  #branding {
  top: -50px;
  position: absolute;
  }

• 

  awaywiththespoons · Member · Dec 24, 2014 at 10:47 pm

  • Copy link

  Thank you!

  That fixes it the scroll!

  I have also noticed that the links now do not work! If I use the code:

  .widget-area {
  position: relative;
  }

  then all the content moves BUT the links work! I am playing around with this -but if you know what would help the links work that would be great!

  happy holidays!!

• 

  staff-happychia · Staff · Dec 24, 2014 at 11:19 pm

  • Copy link

  Could you add z-index as following to make the links clickable:

  #branding {
  top: -50px;
  position: absolute;
  z-index: -1
  }

• 

  awaywiththespoons · Member · Dec 25, 2014 at 5:14 pm

  • Copy link

  Thank you.