So my question is, how difficult would it be for me to take a site/theme that isn’t responsive
It’s quite simple if the theme only has 1 or 2 columns. It would be a matter of adding max-width: 100%; to the divs and some content (images, videos…)
You can use media queries to indicate when a div goes underneath another to form 1 column in case there are 2 initially. Media queries would also be useful to control when certain elements are shown or hidden. Ex. Some theme have separate navigation menus for certain screen sizes.
@ron thanks, I’ll be playing with it tonight so I’m sure I’ll be back with some more questions before long.
I’ll be more than happy to send some cash your way for your time.
The site looks simple enough to convert. I would say your biggest hurdles will be making the slideshow resize itself and toggling to a drop-down or hamburger menu at whatever screen width you decide on.
So the first issue I’ve run into is that my cell phone is still viewing the site as a “desktop” site. You mentioned some themes having separate navigation menus for certain screen sizes, I think that is the client’s main concern – having menus be readable/navigable on smaller screens.
I created a test version of the clients site while I try to learn/figure out the media queries, etc.
I’m beginning to think it may be easier (for me anyways) to take a responsive layout (such as the frontier theme) and style it to look like the client’s current set up (complexity-2), although over all I would like to better understand media queries.
my cell phone is still viewing the site as a “desktop”
You’ve added the max-width: 100%; right? Add this on the <head>
<meta name="viewport" content="width=device-width" />
Thanks for the tip, I put that meta tag into the <head> and it now recognizes my max-width styling.
This is as far as I’ve gotten…
http://www.sulu13.net/test/
Still playing with it, I know the menu is supposed to be displayed as a block and not a table, right? I couldn’t seem to get that to work. No luck with the slider either.
Going to get back to it tomorrow, signing off for now.
Any advice is welcome.
Cheers!
*update*
I was able to make the menu a block, just had to change height to 100% for it to view correctly.
The menu looks good from my phone, but when I click on any of links other than the home page it becomes distorted.
