Support » Themes and Templates » Twenty Eleven shrinkage on iPad

  • I’m using the Twenty Eleven theme for http://www.craigglassonsmashrepairs.com.au.
    When you look at the site on micro-devices it is shrinking the site so that there is still a background. What do you change so that the “body” of the website fills up the whole screen on an ipad, and micro-devices when it opens.

    Also I am using “vSlider – Image slider plugin” on a number of pages and when I open the site on an ipad, vSlider is at 100%, but the Twenty Eleven template isn’t and the vSlider is shooting out to the right.

    Any help greatly appreciated?

    Thanks
    Waz

Viewing 7 replies - 1 through 7 (of 7 total)
  • esmi

    (@esmi)


    Forum Moderator


    Do not edit the Twenty Eleven theme. It is the default WordPress 3.2 theme and having access to an unedited version of the theme is vital when dealing with a range of site issues. Create a child theme for your changes. Or make your customised version in a new theme and re-upload a fresh copy of Twenty Eleven.
    http://wordpress.org/extend/themes/twentyeleven

    Hi Esmi
    I have now created a child theme and every thing is working fine on the child theme.

    Do you know the answer to my question?

    Thanks
    Warwick

    Mr. Vibe

    (@wpthemes)


    Hi Warwickhastle,

    This is because twentyelven wordpress theme is responsive whereas vslider is not. This is very important feedback and will try to include in vslider future upgrades.
    Thanks for pointing it out.

    ( v )

    Hi,

    is there a solution yet?

    Jan

    I seem to be able to resolve the problem with replacing the width “1000px” in the following code with “100%”.

    The problem is it only works temporarily in “FIREBUG”….as I cant find that line of code in the css / php files anywhere. Been searching and searching…but no success. 🙁

    Any hints on where to find that code?

    <div id=”header” style=”background-image: url(“http://www.travelocals.com/wp-content/plugins/vslider/timthumb.php?src=http%3A%2F%2Fwww.travelocals.com%2Fwp-content%2Fuploads%2FTRAVELOCALS-Inkscape_WORDPRESS_Header-Logo_klein.png&w=1000&h=288&zc=1&q=80″); width: 1000px (REPLACE THIS WITH WIDTH 100%); height: 288px; position: relative; background-position: left top;”>

    hey…came across a solution…

    March 2012 Freebie

    They seem to have created a temporary version of vSlider – called vFlexslider – which is responsive and can be used until they update the main vSlider plugin.

    vFlexslider is also touch-responsive on iPhones and iPads.

    Flexslider works just about the same way as does vSlider.

    One major difference (I noticed) is that you need to size the pictures you want to show to the exact size you want/need them as the program doesn’t crop them (vSlider does; vFlexslider does not!).

    Here is the code I am using which makes it possible to show different sliders on different pages / it needs to be placed into the header.php:

    <?php if(function_exists('vflexslider'))
         {
              if(is_front_page() )  {
                                              vflexslider('main');
             }else if(is_page( 'enter_wordpress_page_number' ) ){
                                            vflexslider('slider_name_1');
             }else if(is_page( 'enter_wordpress_page_numer' ) ){
                                            vflexslider('slider_name_2');
             }else if(is_page( 'enter_wordpress_page_numer' ) ){
                                            vflexslider('slider_name_3');
             }else if(is_page( 'enter_wordpress_page_numer' ) ){
                                            vflexslider('slider_name_X');
             }else {
                                              vflexslider('main');
                }
    
            } ?>

    [Moderator Note: Please post code or markup snippets between backticks or use the code button.]

    In brackets are the names of the sliders (created within the plugin).

    That exact same code can be used for vSlider when they have finished updating it. You just exchange ALL the references to ‘vflexslider’ for ‘vslider’ in the code. Done!

    Hope its of any use!

    Hi
    I am having problems with http://www.global-migrate.com/taimur/ looking different using mobile devices such as iPad and iPhone. The menu on the left goes to the bottom of the screen. Does anybody have any ideas?

    Regards

    Richard

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Twenty Eleven shrinkage on iPad’ is closed to new replies.