Responsive Templates

Responsive templates seem to be the 'new' thing around these days. So I decided to try a few of them out from the Market (both free and paid). Of course I love the fact that it automatically adjusts to the device its being view on BUT the problem comes when view in desktop mode. The biggest problem I have had is that when you are in the Admin Panel > Page Builder and adjusting column width to your pages, it seems it does not 'take' when you view your site again.

For example: If I have a 2 column 'Account' page and make the left colum 25% and the right column 75%, when I view the Account page, none of the column widths have changes. Is anybod else having any issues with this?

I would love to find a good responsive template that you can actually adjust the 'desktop' view without having the 'responsive' settings override. Any ideas? BTW, I completely refuse to pay $150 - $300 for a template.... Sorry

I did speak with Gorpus since I have several of his templates and he stated that he will be getting into responsive templates once he has ironed out some issues. Not sure when that would be though. The 'Make ANY template responsive' module was also a choice but decided against it since I never heard a reply back from the owner.

If there is a module that can be used to make 'any' template responsive, surely there is a default set of files that are used but I have not found them yet. (No need to post it/them here - If you want to tell people how to make their template responsive, post it in the tips n' tricks). Maybe I just do not understand the whole 'responsive' thing yet :)

I have tried most all the responsive templates too, and found the same problems, actual column placements on the "shrunken" site.

Using two monitors, one in page builder, the other with the site open in a small box that will make the site all one column.

I have had to experiment on block placement too, lets say the site stats block is on the right in the third column, in responsive mode it may end up being the first block you see and not what should be from column one.

It can very frustrating but I have learned to organize the pages to look right so far. As for some of the templates, the columns totally switch sides even in full screen view, that was enough for me to remove those until the creator fixed them, which was very hard to explain as they do not communicate well in English.

Yep, the same exact problems here... What a shame too.

Just wondering, did you mess around with HyperNova from Master Theme?

 Yes i went to http://demo.mastertheme.com/hypernova on my Galaxy S3 and did not like the layout. Seemed the join/login buttons overlayed the banner/logos and everything was in a single file line. On the responsive templates I have used, there were at least 2 photos to a row instead of one. Also the navigation menu was 'exploded' meaning that all sub-links were displaying by deault.

Nice concept to be able to change your colors any way that you want, its just that visually, it did not look good on my phone. Thats my personal opinion and may not reflect others.

I to noticed this on a template that I am using for now. One thing that I noticed is that everything is placed in a container and that the container - based on what is being used to view the site - has different widths, and for me causes the blocks to not accept the proper page width.

To be more specific of one thing I noticed. when setting page width to 100%, only the top header actually expanded to 100%, but the main content area that holds the blocks remained the same. I made changes to the css files to get this area to finally expand to 10%, but not sure how it would affect the site being viewed on different devices.

I am glad that this topis was brought up. I personally have other things of more importance than the width right now, so have not been able to really try much and see what happens.

The best way to handle this is going to be different templates depending on the device.  There is a way to check for device in the browser much like we check the user agent.  I can not remember exactly what and would have to go digging it out.  Since I don't own any portable devices like smartphones or tablets, I can not test but did file it away for future reference.

We check and serve up the template that is best suited to the device.  Microsoft learned the hard way when it tried to have a single OS for both the desktop and the mobile world.  It is going to be the same with templates, we are going to have to have multiple templates best suited to the device that our sites are being viewed on.  We actually discussed this method for the templates of our CMS system; serve templates based on the device.

I think the only proper way to do this is the way facebook does it.

Basically a mobile version of the site. Complete with it's own template and builder systems so the layouts can be controlled from desktop all the way down to phone size screens.

I don't think just a template alone will do the job.

The way the way data is stored currently prevents this.  Modules would need a central store for the data outside of the modules.  Unless the page builders could be rewritten so that the pages are created dependent on the device; you would have two page builders in the backend, one for creating the layout of the desktop version and one for creating the layout of the mobile version.  How much of a task are we talking about here?

Yes. I did say separate template and builder systems. So yes, more than one builder.

 I am guessing a developer is not going to knock this out in a couple of weeks

Just wondering- Has anyone here yet tested the free Palcom responsive design template?

If so, what are your thoughts on this one?

I tried using the Palcom ones, but they wouldn't display correct on my site. Didn't pursue them as I already use the NEO template by AndrewP which is responsive, works very well for me. Costs a few $ but the support from Andrew has been worth it.

The menu displays fine on Neo also.

 I'm very surprised to hear that it didn't display correctly on your site....I have to wonder if it has been updated since you last tested it, as I am blown away with how much better this responsive design works over ALL the other designs I have and tested (most all of them). I have both ZZZ and GooglePlus, both of which are nice (and expensive too) and display the blocks 50%-50% side by side on Tablet 1024px width screens....just like their cousin NEO :) While I like the 50-50 look on many pages, I don't particularly care for how it looks with IBDW EVO-Wall Newsfeed, 1-Col and 3-Col on iPad and smaller devices. Then there's the issues with squeezing in all the top navigation menu items if one has many modules. If one uses a Full-Width-Column layout (One full-width block up top and 2 blocks side side-by-side below), there are slight alignment issues, but I've managed to get Palcom to display Full-Width-Colums layouts perfectly.

Check-Out these screenshots :)

Palcom also fits 2 columns of photos side by side inside the block on smart-phones in single-column mode utilizing real estate better :)

Still a few little css touch-ups to do, but I'm pretty dern impressed....FOR FREE! LOL

There really isn't much of anything I don't like about this design....yet X~)

Those responsive template just a headache !

Responsive templates are all I use now.

Not sure how much you have done research on "why to use" a responsive template but here are some interesting links and information.

http://vinaora.com/2014/08/do-modern-responsive-websites-benefits-google-ranking/

"The king of search engines, Google not only recommends responsive web designs as the best way to target mobile users, but also favors mobile-optimized websites when presenting results for searches made on a mobile device. Some benefits that are making responsive website design popular for SEO are as follows:"

http://www.sitepronews.com/2014/10/27/google-ready-penalize-non-mobile-friendly-sites/

October 27, 2014

Not convinced? Consider the following statistics related to mobile device usage.

• Mobile devices have been a driving factor in an increase in time spent online. In fact, since 2010, the time the average individual spends online has doubled.
• 91% of adults in the United States own a phone; 61% of those phones are smart phones.
• In 2012, marketers spent $4.4 billion on mobile advertising in the United States alone. By 2013, that number doubled to $8.5 million. By 2017, the figure is expected to fall around $31.1 billion. Search and PPC advertising accounts for nearly half of this budget.
• 25% of adults in the United States only use a mobile device to access the Internet. PCs have become tools of the past.
• Organic search results matter now more than ever before. In fact, one-third of all search clicks go to the top organic result; this means that the mobile icons Google is testing could play a larger role than you’d imagine going forward.

Ive tested a lot of responsive templates available, purchased several and tried the free ones also.

Have found there are a few places that most (if not all) do not give responsive by default as some things seem to be set outside the template folder.

tinymce nav bar for example, although it will be responsive, it will be fixed to a single row so will fall ourside the container on mobile screen.

Same for the 'write message' block

there are a few other bits ive found that are also not covered in most responsive template.

Have have to get them all 'fixed' on my site which Im happy to say is now as far as I know 100% responsive.

Having said all that, Im now wanting to create a separate mobile template that will load on mobile browsers instead as I need more control over 'what' displays, rather than just how it displays...

next project!...

Yeah yeah ! we know the score Man , but what i'm saying that you need to do a hardcore test to every responsive template in different devices before making the right purchase or you will end up like me and others lol.

This site come handy to check any responsive template before buying :)

http://responsivedesignchecker.com/

that links isn't really accurate though...

tested my site viewing on ipad and I get a different view to how it looks on 'ipad' setting on that site.

The site seems to check by screen size, whereas a responsive template will go by resolution.

1st and latest gen of ipad will display different to each other on some sites...!

fear enough then i have to pop up at the apple shop tomorrow and check my site on all Ipad's and see how things looks like ;)