Hi there, what are peoples views on the best way or approach to making a MODX website responsive? How have others done this? Have you started from scratch with a responsive template? Anyone used Foundation? Does anyone know of any plugins that could help with this?
Any thoughts, ideas or experiences much appreciated !
-
☆ A M B ☆
- 24,524 Posts
It's all in the template you select. You can roll your own responsive template, or use one of the available ones. My favorite is
HTML5 Kickstart, but it's getting a bit old and is very minimal. I also use Twitter Bootstrap. Basically I choose a Bootstrap theme that is close to what I want, then modify it.
Thanks Guys, the website in question is not currently based on any template - does that mean that i would essentially need to start from scratch and re-build on a different/new template?
-
☆ A M B ☆
- 24,524 Posts
It has to have an HTML template. It's possible to modify the existing template to work with something like Bootstrap. I did it here - or at least got started with it. You can "view source" to see the differences.
http://www.irco.org/
http://irco.sottwell.modxcloud.com/
Here's some information on
Bootstrap versus Foundation.
One important difference is that Foundation doesn't support IE below IE9 -- there are some solutions for that, but none of them look very good to me. Figures vary on how many people still use IE8. One site reports current IE8 usage as 16%. Another reports it at %1. The actual figure probably depends on the nature of your site and where your visitors live (IE8 usage is higher outside the USA).
A browser version report would be a nice MODX extra.
I love Bootstrap - which is jQuery. The MODX Extra is nice as it will install everything for you.
I make PHP PDO CRUD websites that takes data from a SQL Server or MySQL database and present it in
using tablesorter (
http://tablesorter.com/docs/ or
https://mottie.github.io/tablesorter/docs/) thanks to Bootstrap it's easy to make existing jQuery plugins responsive.
Than I use Ajaxify and History. Ajaxify (
https://github.com/browserstate/ajaxify) uses jQuery animations and
for big datasets it's easy to make jQuery show/hide loading icons (
http://ajaxload.info/)
For my latest MODX project I combined code from CodyHouse (
http://codyhouse.co/)
I went back to my favorite photo gallery of all time: Colorbox! (
https://twitter.com/hawproductions/status/597335403796901888)
Great resources for Responsive Design:
https://bradfrost.github.io/this-is-responsive/resources.html
[ed. note: mrhaw last edited this post 11 years, 4 months ago.]
