WordPress.org

Ready to get started?Download WordPress

Forums

Jetpack by WordPress.com
[resolved] No Header/Background Images for Jetpack Mobile Theme (23 posts)

  1. rayjon
    Member
    Posted 1 year ago #

    I've just enabled the JetPack Mobile theme option at http://chestermcbug.com.

    However, when I view the theme using Safari on an iPhone (3GS and 4), I see no custom background or header. The documentation for JetPack Mobile states, "It uses the header image, background, and widgets from your current theme for a great custom look." I'm not sure why it's not working since I set my background and header using the theme options.

    I'm using the latest version of twentyeleven as a child theme.

    Thanks!

    http://wordpress.org/extend/plugins/jetpack/

  2. hankman2k
    Member
    Posted 1 year ago #

    Having the same issue and can't find any information about it. I use a child theme to set the Header image. Main theme is SubtleFlux.

  3. gruts
    Member
    Posted 1 year ago #

    Similar problem to hankman2k: I am using a TwentyEleven child theme with random customised header images. The JetPack mobile theme displays a header image I have never seen before, of what appears to be waves on rocks.

  4. Lisa {Sweet 2 Eat Baking}
    Member
    Posted 1 year ago #

    I'm having the exact same problem too. In the settings page there is nothing about the header, but my header is set in my theme options.

    Hoping for a fix to this.

  5. Chronicler
    Member
    Posted 1 year ago #

    This fix will probably require that you edit the files again after each update but you can edit the core mobile theme.

    DO THIS WITH EXTREME CAUTION AS CORE THEMES ARE TOUCHY FOR THE UNINITIATED.

    Theme folder to customize
    /wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven/

    Personally i think above should be linked to the primary theme folder so you can select and edit a separate mobile theme but hey maybe after 2.0 we will see some more changes

  6. Jeff
    Member
    Posted 1 year ago #

    I have a similar problem. It seems that Jetpack mobile ONLY takes the header and menu if you are using the TwentyTwelve theme.
    If I switch back to the TwentyTwelve theme I will lose a lot... I've tried it before.

    So how can I "backdoor" to upload a custom mobile header and make the mobile theme point to the right menu?

  7. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    @Jeff If you have specified an image under Appearance > Header in your dashboard, it will be used by Jetpack's Mobile Theme.

    I just tested it with Twenty Twelve, and it seems to work properly.

    If your theme doesn't use add_theme_support( 'custom-header' ); to add the Header image, it will not appear in the Mobile theme.

  8. llaughy
    Member
    Posted 1 year ago #

    Hi Jeremy -

    I have added theme support to my child theme by adding this code to the functions.php file:

    $args = array(
    	'flex-width'    => true,
    	'width'         => 800,
    	'flex-height'    => true,
    	'height'        => 200,
    	'default-image' => get_template_directory_uri() . '/images/header.jpg',
    );
    add_theme_support( 'custom-header', $args );

    This does establish the default header in my child theme, but fails to show up in the Jetpack Mobile theme. I have also tried this with get_stylesheet_directory_uri(); but that isn't working either. Any suggestions? Thanks!

  9. Jeff
    Member
    Posted 1 year ago #

    OK thanks Jeremy. I'll try that out.

  10. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    @llaughy What happens when you specify an image instead of the default header image, under Appearance > Header? Do you still experience issues?

    if so, could you post your site URL here so I can have a look?

  11. llaughy
    Member
    Posted 1 year ago #

    I tried restoring the original header and that didn't work. I tried using a previously uploaded image and that didn't work either, so I have removed the header image and uploaded a new header image named header.jpg and it still isn't showing up on the mobile site.

    Where does Jetpack look for the file exactly - I am wondering if this is an issue because of my child theme - is it maybe looking somewhere in the parent folder? Also, WordPress is uploading the header file in /wp-content/uploads/2013/01 and renaming the file as cropped-header.jpg, so maybe it is a file name issue?

    my mobile site is for http://library.sps.edu

    Thanks for any suggestions you have!

  12. Lisa {Sweet 2 Eat Baking}
    Member
    Posted 1 year ago #

    Jeremy, I'm using a Genesis child theme and have specified a custom header under Appearance > Header but it doesn't show my custom header, background, etc. on the mobile site.

    Some of the replies here are conflicting. Do I add the custom_theme_support string to the theme.php file or the functions.php file? On the page you linked to in reply #7 it states the theme file and shows what strings to add to add support for the background as well as the header too. Which I'm hoping will resolve the issues.

    Do you have any suggestions for my site to get this working for me?
    LINK: Sweet 2 Eat Baking

    Thanks in advance.
    - Lisa.

  13. llaughy
    Member
    Posted 1 year ago #

    Lisa - the functions.php file is located in your theme folder, there is no theme.php file.

    There is an explanation here in the codex for the functions.php file:

    http://codex.wordpress.org/Functions_File_Explained

    Also, a bit here introducing themes:

    http://codex.wordpress.org/Using_Themes

    This might help make sense of some of this.

  14. zoecorkhill
    Member
    Posted 1 year ago #

    I am having the same problem at http://mamageek.co.uk

    I've tried adding the add_theme_support( 'custom-header' ) to both my parent and child themes alternately, with no success - the same goes for custom backgrounds. I also tried overriding the code by uploading files in the admin and nothing worked.

    It's worth noting that I wasn't having any luck getting this feature working when I was running a child theme of twentyeleven as well.

    I would love for my mobile site to not be quite as bland as it is - has anyone had any luck getting this working?

  15. Jeff
    Member
    Posted 1 year ago #

    Jeremy - just wanted to tell you that this won't work for me since the themes I use don't have an Appearance > Header item in the menu. For Appearance, I only have Themes, Widgets, and Menus.

    My themes (from iThemes.com) allow for custom headers through a layout option.

    This is in a multisite environment. I suppose I could start them as Twenty-Eleven, add the header, and then switch to my theme, but I usually don't do the custom header artwork until later.

  16. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thank you all! I made a few tests over the weekend, and the Mobile Theme doesn't seem to handle Header images in Child Themes. We'll have a look into this issue, and I'll keep you updated!

  17. genegaudette
    Member
    Posted 1 year ago #

    Try this -- put your image (for the sake of this demo, we will call it "yourlogo.jpg") in the /wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven/inc directory. My logo is 240px wide by 45px high.

    Now, change the header section of /wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven/style.css (starting about 25% into the file) to read as follows /* AND TAKE NOTE OF MY COMMENTS so you can adjust various sizes to match your logo size*/. Remember, YMMV, so feel free to tweak away at your leisure :

    /* =Header
    ----------------------------------------------- */

    #branding hgroup {
    background-color:#fff;
    margin: 0 0 1.3em 0;
    padding:0;
    width: 100%;
    height: 95px; /* THIS IS IMAGE HEIGHT PLUS 50px */
    }

    #site-title,
    #site-description {
    clear: none;
    }

    #site-title {
    color: #111;
    text-indent: -9999px;
    width: 240px; /* THIS SHOULD MATCH LOGO WIDTH*/
    height: 45px; /* THIS SHOULD MATCH LOGO HEIGHT*/
    background: url(inc/yourlogo.jpg) no-repeat;

    }
    #site-title a {
    color: #111;
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.2em;
    }
    #site-description {
    color: #222;
    font-size: 0.923em;
    }

    /* Header Image */
    #header-img {
    text-align: center;
    }
    header img {
    max-width: 100%;
    height: auto;
    }

  18. djaccb
    Member
    Posted 1 year ago #

    Jeremy -

    I'd like to expand this issue to more than just not using the header image specified in the child theme.

    When I include a new header.php in the child theme, the plug-in still uses the header.php in the parent twenty twelve theme. The header.php in the child theme is ignored.

    Thanks,

    Dave

  19. thatgregdaniels
    Member
    Posted 1 year ago #

    Best way to make this work with a child theme that does not support this feature is to:

    1) Activate the parent theme
    2) Set the header in the parent theme to the image you want
    3) Reactivate the child theme
    4) ???
    5) Profit!

    Worked for me at least.

  20. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    We now fixed this issue. The fix will be included in the next Jetpack release.

  21. rayjon
    Member
    Posted 1 year ago #

    Sounds great Jeremy. Do you know the release date?

  22. djaccb
    Member
    Posted 1 year ago #

    I have also been waiting for this fix. Thanks for working on this particular issue.

    Dave

  23. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    @rayjon We're currently beta testing, and we'll release this new version soon, before WordPress 3.6 is released, so keep an eye on the Jetpack news blog. :)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic