change width of 2011 theme WordPress

perolsen comments:

2011 has the ability to change header on a side basis, using the "selected image" function i believe its called.

but youre right about the responsive, it shoul be the 2014 theme or the Sequel
by zgani ( a 2014 child theme) instead.

Could you do it with the Sequel?

Best regards.

Per olsen denmark

MJ comments:

Personally I wouldn't try to coerce a theme to do something it wasn't designed to do, there are just too many things to take into account to ensure it works reliably not only in a responsive sense (at many screen dimensions), but also across the many different browsers, plus the different versions of those browsers.

I've had a look at the Sequel theme (http://sequel.wpdefault.com/)

The following CSS makes the column 360px as you requested. But it may or may not be what you really need. The solution does this at widths of 1080px or more. (It's a responsive theme so the column reduces size between 1080px and 1008px.)

It also hasn't been the easiest theme to work with - it uses a kind of fake column which doesn't make changing it as straightforward as it might seem.

I've tested this on my test site. Put this CSS at the end of your CSS file (you can remove the old widths and colours, they're to help you see what's going on):


@media screen and (min-width: 1080px) {
.site:before {
width: 222px;
/*background-color: rebeccapurple;*/
width: 380px;
}
}

@media screen and (min-width: 1080px) {
.main-content {
float: left;
margin-left: 200px;
/*background-color: blue;*/
}
}

@media screen and (min-width: 1080px) {
#secondary {
width: 162px;
/* background-color: cadetblue; */
width: 360px;
position: relative;
left: -220px;
top: 10px;
}
}

@media screen and (min-width: 1080px) {
/*You may need to add other elements, this works for the items that are shown on the demo site*/
.secondary-navigation, .secondary-navigation ul ul {
width: 222px;
width: 360px;
}
}



I believe this solves your question, but my advice is still to use a theme that does what you need out of the box.

perolsen comments:

it did not work on woodcut.dk.

tried to remove it again but still problems with css, hope it just in my browser....never mess with code when youre tired :-/

"my advice is still to use a theme that does what you need out of the box." what theme would you surgest?

i have tried a lot of different themes over time, prefer ones with the same clean primary navigation/meny as default wordpress themes, but with wider sidebars, with space for form.

MJ comments:

Here's what it looks like on my test site: http://gyazo.com/9f5b9ac098b4c3b99dfaa588be4f609a

Sorry about the Pulp Fiction text ;)


Using this revised version:


@media screen and (min-width: 1080px) {
.site:before {
width: 222px;
/*background-color: rebeccapurple;*/
width: 380px;
}
}

@media screen and (min-width: 1080px) {
.main-content {
float: left;
margin-left: 200px;
/*background-color: blue;*/
}
}

@media screen and (min-width: 1080px) {
.grid-content {
padding-left: 222px;
max-width: 1060px;
}
}

@media screen and (min-width: 1080px) {
#secondary {
width: 162px;
/* background-color: cadetblue; */
width: 360px;
position: relative;
left: -220px;
}
}

@media screen and (min-width: 1080px) {
/*You may need to add other elements, this works for the items that are shown on the demo site*/
.secondary-navigation, .secondary-navigation ul ul {
width: 222px;
width: 360px;
}
}



Likely more adjustments will be needed depending on your exact content/widgets.


Off the top of my head you could try this theme: http://www.wpexplorer.com/wptuts-wordpress-theme/

(Others here: http://www.wpexplorer.com/top-free-themes/)

If none of those works for you let me know and I'll hunt around a bit more - not sure how flexible you are on the choice or whether you want a premium theme.

MJ comments:

If you want a premium theme I've liked Enfold a lot http://www.kriesi.at/themedemo/?theme=enfold

I've used it a few times and my experience has always been good. It's very flexible, very clean, very well done, just click through all the options in the demo, you don't need to have a slider there if you don't want it. (Hover over the Home menu to see some of the many options, and in Header check the links on the right for various menu styling options.) You can make it look very different so if you have many sites you can use the same theme and they won't all look the same. I think it's a very small investment for what you get in return, and the Avia framework does a lot of the work for you. If you haven't used a Framework before, it's a small learning curve but this one is very intuitive and I think you'll soon be flying. Check out the other themes there too.

Alternative suggestions would be themes using the Genesis Framework by studiopress. Google it.

perolsen comments:

Sorry i problbly has to use the 2014 theme for better responsive design


on http://www.woodcut.dk/ i uses sequel a 2014 child, the best was if this could be set up to 360 px sidebars without problems.

if this is a problem then on http://akupunktur-ringsted.dk i uses a standard 2014 theme instead.

best regards