Removing responsiveness from wordpress theme

any idea how i would go about removing the responsiveness from a wordpress theme so that it always looks like the full monitor version?

just looking for some direction here. please advise. thanks in advance.

It’s probably die to the CSS, so remove the styles you don’t want. At a guess, they are likely to be served as @media rules, so you might just be able to remove those. A link would be needed for more accurate advice.

so here’s where it gets a little tricky. i’m using a child theme setup. the CSS from the parent theme that contains the @media stuff is located at:

here’s a look at that code:

I don’t want to touch any code in my parent theme because it would obviously defeat the purpose of using a parent theme. to OVERRIDE all parent theme styles that I dont like, I’ve been entering my CSS at:

so is there a way i can write styles into my childtheme css that will override and cancel the responsiveness? for instance, would something like this work?
@media only screen and (min-width: 481px) {something here???;}

please advise. thanks.

If you are trying to modify the styles for small screens, it might need to be like this:

@media only screen and (max-width: 480px) {something here;}

It sounds like you are trying to style the child theme for mobiles, so I’d think this is what you need to do. If these styles don’t override the parent styles, you could make your override styles more specific … or, at a pinch, just use the !important sledgehammer.

I’m not try to modify the style for mobile sites, I’m trying to eliminate it. I want them to looks just like it does on a big monitor.

The only way to eliminate it is to remove the styles in the parent style sheet. If you can’t do that, then you are stuck with having to modify it. In other words, change the styles back to what you want them to be. :slight_smile:

Mind you, this whole setup sounds pretty dreadful to me.

Maybe another option would be to modify the styles in the parent style sheet so that they only apply to the parent site. For example, you could add a class to the body tag on each page of the parent site like .parent and then change the media rule to

@media only screen and (max-width: 480px) {.parent something here;}

I have to wonder why this is a problem.

If someone is viewing in a small monitor, it won’t look like a big monitor no matter what. Unless they can zoom in or have superior eyesight the site will be pretty useless at worst and troublesome at best no?

Or maybe the mobile styles are getting inappropriately used and messing up the desktop view?

if you must know, the company will be doing a PPC campaign with an advertising platform that overlays the phone number in order to track the success of the program. so if the sections are moving around the site when adjusting to different widths, the phone number overlays are going to get all screwed up.

Ah, that makes sense, thanks.

I guess ideally the solution would be to fix the overlay code to work with the responsiveness rather than take away the responsiveness. But I can understand how that might not be so easy, if even possible.

If it’s just for the duration of the campaign, maybe you could use javascript to take out / replace the troublesome CSS so you won’t need to mess with the parent theme’s files?

Without looking @ the code it would be hard to say how this could be done. Depending on how the theme was set-up will depend on how easy is it to make it non-responsive. The easier solution was one suggested by @ralph_m;, I recommend this solution, however, personally, I like easy solutions, which for me would be a similar theme of non-responsive nature. :slight_smile:

Your solution also works fine, but I much prefer @ralph_m; solution. You’re right, for edits use the child theme, and never the parent. I am not too sure how child themes are setup from a developers point of view, as I’ve not created one, I soon will however. =)