WordPress.com

1. milesfromperfect
   Member
   Nov 5, 2012, 9:51 PM

   Hello,

   I was told that through CSS I can add sidebar widgets to the Ever After theme. Can someone walk me through how to do this? Specifically I would like to add a "follow blog" widget and a "search" widget. I don't know anything about CSS, so I would just need super specific instructions.

   Thank you!!

   The blog I need help with is milesfromperfect.wordpress.com.

2. designsimply
   Staff
   Dec 4, 2012, 4:16 PM

   Well, the Ever After theme was designed to have one column and footer widgets. You can't add widgets using CSS, but you can move things around on a page once they have been added. So, in this case, you can move the footer widgets up and to the right. To make it work, we'll need to use absolute positioning. That means you overlay, or position, the widgets where you want them on the page—and so if you change the height of anything in the header, keep in mind you may also need to adjust this type of custom CSS. Here is an example for you to play around with:

   #primary {
   	width: 70%;
   }
   #supplementary {
   	width: 23%;
   	position: absolute;
   	top: 460px;
   	right: 0;
   }
   #supplementary.two .widget-area,
   #supplementary.four .widget-area {
   	width: 100%;
   }

3. fashionablyroyal
   Member
   Dec 12, 2012, 10:48 PM

   I would like to do this too. But, I don't understand what you mean by absolute positioning or moving the widgets up and to the right. How exactly do you do that? I'm just confused...

4. designsimply
   Staff
   Dec 27, 2012, 7:05 PM

   Absolute positioning means you take an element out of the normal flow of the document and stick it in a specific position on the browser page. When you do that, other stuff will probably move around on the page and so you most likely need to adjust the other elements to make room. The best way to explain might be to look at a few examples. This is a nice example walkthrough:
   http://www.barelyfitz.com/screencast/html-training/css/positioning/

   Note that CSS is theme specific, so if you're not using the Ever After theme, then the example above won't work for you and you should start a separate thread to ask for help for your theme.

   If you're interested in learning a little more about CSS, check out this beginner tutorial:
   http://en.forums.wordpress.com/forum/css-customization/

Topic Closed

This topic has been closed to new replies.