concrete5 iPhone Theme Tutorial + Download

Permalink
Hey everyone. I've recently relaunched a personal blog/publishing site (shameless plug) and, as part of it, I wanted it to have a nice reading interface when accessed via the iPhone.

http://andrewembler.com

So I modified WPTouch and put together an article on the site about how I did it, complete with the theme itself available for download, and instructions for choosing which theme to display, and even some information about scaling images, etc...

http://andrewembler.com/concrete5/optimizing-your-concrete5-website...

This information is also available in the concrete5 documentation section. (Note: ALL tutorials I write for my own site will also go up on concrete5.org, because a new year's resolution is more and better documentation!)

http://www.concrete5.org/help/building_with_concrete5/developers/th...

I'd love to hear feedback in comments anywhere you'd like to post'em. One of my goals with these tutorials spreading just how well concrete5 can solve common web-related problems like this.

andrew
 
synlag replied on at Permalink Reply
synlag
yeah andrew, sounds great!
have to check it out.
chunksmurray replied on at Permalink Reply
chunksmurray
Thanks for the tutorial andrew! Had a read over it and it seems simple enough. Will be giving it a try this week.
ijessup replied on at Permalink Reply
ijessup
Would be really cool to have a theme system integrated into c5 where you can "Add Devices" and activate themes per "Device"

Or rather than being based on the device, select the theme based on the browser being used.

I think I may start working on this.
12345j replied on at Permalink Reply
12345j
that would be sweet!
Smittie replied on at Permalink Reply
Smittie
I'm getting ready to do this very thing. In fact, I'm getting ready to do my very first Concrete5 based project on which I want to include essentially, what you've suggested here.

However, when I load andrewembler.com/ on my iPhone it appears exactly the same as it does on my Mac. It is suppose to be working??

Smittie
12345j replied on at Permalink Reply
12345j
do you have a user agent faker on?
Smittie replied on at Permalink Reply
Smittie
No. Not on my iPhone or my Mac. Both are practicing truth in advertising.

Smittie
12345j replied on at Permalink Reply
12345j
tryhttp://12345j.co.cc/
i use a similar feature.
Smittie replied on at Permalink Reply
Smittie
Similar to what?
12345j replied on at Permalink Reply
12345j
andrewembler.com
Smittie replied on at Permalink Reply
Smittie
Does the one you're using work? andrewembler.com currently appears the same on iPhone, Mac OSx (Safari and Firefox), and Ubuntu. I would like to affect a different layout (probably via a platform specific style sheet) on the iPhone.

Smittie
12345j replied on at Permalink Reply
12345j
yeah, i don't know why his doesn't work, but ive used it and his method works
Smittie replied on at Permalink Reply
Smittie
Yeah,http://12345j.co.cc works. Interesting though, that this page pulls side to side on the iPhone. The iPhone implementation I did on this page, <http://resume.smittie.com/pm/>, the page doesn't move side to side. Only up and down.

Smittie
12345j replied on at Permalink Reply
12345j
prob just my css
andrew replied on at Permalink Reply
andrew
Sorry - this is an incompatibility in the approach taken in that tutorial
with full page caching, which I had enabled on the home page of my site. I
have just now removed it.
Smittie replied on at Permalink Reply
Smittie
Hum. No change when reloaded on my iPhone. Should there be?

Question, can an iPhone layout be implement simply through a style sheet?

Smittie
andrew replied on at Permalink Reply
andrew
Try again - I forgot I disabled the mobile theme on the site.
Smittie replied on at Permalink Reply
Smittie
Works. Looks nice. I'll be stealing it this weekend. Thanks, Andrew.

Smittie
12345j replied on at Permalink Reply
12345j
yes you can implement an iphone layout only through stylesheets.