Custom mobile layout - just for iphones?

326 views
Skip to first unread message

pouretrebelle

unread,
Jul 27, 2012, 10:24:07 AM7/27/12
to tumblr...@googlegroups.com
I know you can override the default iphone layout of your blog by making a page /iphone-theme
Does anyone know if that then works on all mobile browsers or only on iphones?

I'm thinking of making a mobile theme because imo the default has some shortcomings..

Sean Zhu

unread,
Jul 27, 2012, 6:11:59 PM7/27/12
to tumblr...@googlegroups.com
Does it work if you make it /mobile or /mobile-theme? I've been meaning to try this but haven't gotten to it.

On Chrome, you can go to settings inside the developer tools to set the user agent to a mobile one. You can use that to test.

Generally, I'd advise against making custom mobile themes. Aim to make a theme with variable width that would look great on any browser. Then go to Customize and turn off mobile themes.

Yoga Sukma

unread,
Jul 28, 2012, 6:19:09 AM7/28/12
to tumblr...@googlegroups.com
In some article says, it work for any mobile browser. Why dont you just try it.. :)

Alternative, you can make responsive themes like mine http://iam.ysupr.net

pouretrebelle

unread,
Jul 29, 2012, 11:19:28 AM7/29/12
to tumblr...@googlegroups.com
@Sean thanks for the user agent tip, it turns out /iphone-theme applies to all mobile browsers, tumblr's just a bunch of applephiles :)

My theme is responsive, I meant making a new standard mobile theme that's available to the public with a few more features for people that don't want to bother about finding a theme that will work well on mobile as well.

dcyt...@gmail.com

unread,
Aug 2, 2012, 7:26:15 PM8/2/12
to tumblr...@googlegroups.com
You can do it, but there are so many screen sizes for all types of mobile devices these days. 

IF you wanted to make one for iPhone, you need to learn about media queries. 

http://webdesignerwall.com/tutorials/css3-media-queries 

If you make a custom navigation menu for you iPhone theme, be sure to turn it off for larger screen sizes
Example: 
@media screen and (min-width: 641px) {
.mobilenav{display: none; }
}


Hope this helps! I hope it helped a little. I am just getting my feet wet in all this CSS mumbo-jumbo myself so I may not be perfect. 

pouretrebelle

unread,
Aug 3, 2012, 4:51:07 PM8/3/12
to tumblr...@googlegroups.com
Ugh I totally lied about it working on all mobile browsers - I only checked iphone and android, just got hold of a WP7 and not even the standard mobile version loads on it, and I think Blackberry gets the same treatment.

So that ruins everything I've been working on today, still going to finish it though. follow progress on the mobile version of this..
Reply all
Reply to author
Forward
0 new messages