Your SlideShare is downloading. ×
Mobilize Joomla
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Mobilize Joomla

2,655
views

Published on

Check out the awesome options for making your Joomla site mobile optimized.

Check out the awesome options for making your Joomla site mobile optimized.

Published in: Technology

1 Comment
0 Likes
Statistics
Notes
  • Great information. Gonna try it and see what happens.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

No Downloads
Views
Total Views
2,655
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
25
Comments
1
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Mobilize your Joomla site
    Kyle Ledbetter
    eBay / Pixel Praise
    Image credit: NBC Productions, Inc.
  • 2. Raise your hand
    if you surf the web on a mobile device
  • 3. Which camp are you in?
    iPhone, Android, HP/Palm, Blackberry, Nokia, iPad
  • 4. Mobile Traffic is Growing
  • 5. What choices do you have?
    (lots, as always with Joomla)
    • Built-in mobile optimization
    • 6. Mobile components
    • 7. Specific mobile templates
    • 8. Custom mobile PHP & CSS
  • How is one to choose?
    What are your needs?
    Do you already have a template?
    Yes - Mobile Joomla, TapTheme or custom CSS
    No – Rockettheme, Morph, Yootheme, Shape5
  • 9. Mobile Optimized Club Templates
    Most popular Joomla clubs have built-in mobile optimization for their templates. If you’re going the stock route, this is very easy for you.
  • 10.
  • 11.
  • 12.
  • 13. Mobile Template Parameters
    Most club templates offer easy, but limited options for mobile optimization.
    (screenshot of Rockettheme Gantry mobile template params)
  • 14. Mobile Joomla
    Install a component, templates & plugins on your existing site, and you get automatic mobile versions for many mobile browsers.
  • 15.
  • 16.
  • 17.
  • 18. Settings
  • 19. Lots of settings
  • 20. Mobile Joomla Extensions
    1 component
    4 templates
    4 plugins
    6 module positions for each template
    (screens courtesy of OStraining)
  • 21. TapTheme
    Install mobile templates specifically designed for iPhone, iPad & Android, which are assigned by a template-switching plugin.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26. TapThemeSetup & Params
    17 color options for each template
    Assign template to each browser
    Create a control panel of icons
  • 27. Custom CSS & PHP
    Sometimes you don’t need an entirely different mobile template. With CSS & PHP you can adjust your template for browser width, version & OS.
  • 28. CSS Media Queries
    @media all and (max-width: 1024px) and (min-width: 768px) {  #absolute-div{    display: none;  }}@media all and (max-width: 480px) and (min-width: 320px) {  #mainnavul li{    float: none;    display: block;    width: 100%;  }}
  • 29. JFactory Brower Detection
    <?php
    jimport('joomla.environment.browser');$doc =& JFactory::getDocument();$browser = &JBrowser::getInstance();$browserType = $browser->getBrowser();$browserVersion = $browser->getMajor();if(($browserType == 'msie') && ($browserVersion < 7)){$doc->addStyleSheet( 'css/ie6.css' );}
    ?>
    <body class=“<?php print $browerType;?>”>
  • 30. Weigh Your Choices
    Easy
    Moderate
    Advanced
  • It’s really about content.
    The point of all these mobile themes and optimizations is content delivery on mobile devices, plain and simple.
    Is it easy to use and easy to read?
  • 40. How do you debug mobile extensions?
    It’s easier than you think!
  • 41. Safari Developer Tools
    (similar tools in Firefox and Chrome)
  • 42.
  • 43.
  • 44.
  • 45. Xcode
    $4.99 on the Apple App Store
  • 46. iOS Simulator
    Part of Xcode. Formerly named “iPhone Simulator”
  • 47. What about the admin?
    Yes, there’s mobile solutions for the admin also!
  • 48. Joomla Admin Mobile
    Native iPhone & iPad app for Joomla administrators.
    Currently supports core components.
  • 49.
  • 50.
  • 51. AdminPad from AdminPraise
    Joomla admin template that mimics a native iPad app. Same approach as TapThemeiPad, but on the admin side.
  • 52.
  • 53.
  • 54. Coming Soon: AdminPhone
    Built on the awesome open source jQuery Mobile project. Will work across many mobile form factors.
  • 55.
  • 56. What about the future?
    Tablets, media centers, TVs, and who knows what’s next?
  • 57. Begun, the tablet war has.
    Image credit: technobolt.com
  • 58. http://store.pixelpraise.com
    25% Coupon Code: jd11ne
  • 59. Back to you
    Questions anyone?
  • 60. Kyle Ledbetter
    kyle@pixelpraise.com
    @kyleledbetter
    www.adminpraise.com
    www.projectfork.net
    www.taptheme.com