Support » Theme: Twenty Fourteen » Slider in header

  • Resolved adeb

    (@adeb)


    Hi
    Is there a way to insert a slider in the header? Like the Meta Slider Pro?
    Thanks
    //Per

Viewing 15 replies - 1 through 15 (of 19 total)
  • I hope one of the cleaver people that monitor this topic can help us out with this. I have found tutorials for 2011 and 2013 but nothing for twenty fourteen.

    The content slider is OK but for the sake of simplicity a slider plugin as a header image would be a great addition to the theme.

    Many thanks in advance.

    Nobody inspired by this topic so far.

    Not a simple fix for this problem but I think a lot of people would appreciate the effort of whom ever makes it happen.

    Should be a widget out there to do the trick no? I might be doing something similar, so Ill let you know If I come up with something before a guru beats me to it.

    Hey guys, I found an already answered question that sounds like what you are looking for. Adding Slider to Header. Hope it helps, if you have any trouble with this or have more questions, feel free to ask.

    -Wolfy and Brain.

    I don’t want you to have to try all of the methods listed so heres a tutorial from that forum topic that I recommend you watch. Video is way more fun than reading tutorials anyways. Meteor Slides Setup. It starts talking about making it into a header slideshow at 8:30.

    -Wolfy and Brain

    That is the general idea but the instructions in the video are specific to the 2010 theme. If you look at the code for 2014 it is completely different.

    I did ask the question on the meteor plugin’s support page. http://wordpress.org/support/topic/wordpress-twenty-fourteen?replies=1
    Maybe Josh has the answer.

    Jas999

    (@jas999)

    Hi, it looks like the site http://www.dimitricarpet.com managed to incorporate Soliloquy Lite as a slider in the header of Twenty Fourteen theme…

    Thread Starter adeb

    (@adeb)

    Hi
    I have finally managed to add the Meta Slider Pro in the header, above the menu bar! http://www.pocketogram.se. Thanks to great help from Tom at http://www.metaslider.com that helped me write som php that fixed the problems I got with my menu bar! Many thanks! Now I just need to create som great content to put there! But thats my problem:-)

    Regards
    Per

    matchalabs

    (@matchalabs)

    Hi Per – you’re welcome!

    TwentyFourteen is a really tricky theme to get a slideshow into.

    The navigation bar that ‘sticks’ to the top of the page as you scroll down won’t work if the header image has been removed from the theme settings. And if you remove the header image then classes go missing from the <body> tag.

    We got it all sorted though, and I’ve written up instructions here. It boils down to something quite simple.

    http://www.metaslider.com/documentation/theme-integration/

    Regards,
    Tom.

    Bob Varaleau

    (@bob-varaleau)

    Thanks Tom. I think you have made a few people happy with this, maybe many people.

    I take it by your comments that the header slide show will appear on all pages. Is that right?

    Is it possible to have it so it only appears on the home page and a static image appears on the rest of the site?

    I am looking forward to giving this a try. The Meta slider has such smooth actions.

    Thanks again Tom.

    matchalabs

    (@matchalabs)

    Hi Bob,

    Yes, the instructions will put the slideshow onto all pages.

    It might be a bit trickier to get a slideshow on the homepage, and the standard header image on the others. It should be really simple, but the sticky menu bar complicates things a lot.

    Could you let me know if the current instructions work for you (no rush!)? If they do I’ll feel a bit more confident about adding the functionality you’re looking for.

    Regards,
    Tom.

    Jas999

    (@jas999)

    Hi Bob, check in Ridizain support:
    https://wordpress.org/support/topic/insert-a-slider-above-top-primary-menu=possible?
    In the case of Twenty Fourteen theme, it may be the header.php file that has to be modified, not the masthead.php. Give it a try and let me know if it works for you.
    Jas

    Jas999

    (@jas999)

    IT WORKS: I just tried it, it works. In my Twenty Fourteen child theme, I copied the Twenty Fourteen header.php file and added after <div class=”header-main”> (around line 46) the following code (since I am using Soliloquy Lite, it is the function code provided by Soliloquy for this specific slider):

    <?php if ( is_front_page() ) : ?>
        <?php if ( function_exists( 'soliloquy_slider' ) ) soliloquy_slider( '344' ); ?>
    <?php endif; ?>

    This solution seems a little less complicated to implement than the one above for metaslider.
    And it shows the slider only on home page. And slider as well as menu still ‘stick’ to the top when scrolling.
    I hope it may help someone in the community!

    Bob Varaleau

    (@bob-varaleau)

    Hi Bob,

    Yes, the instructions will put the slideshow onto all pages.

    It might be a bit trickier to get a slideshow on the homepage, and the standard header image on the others. It should be really simple, but the sticky menu bar complicates things a lot.

    Could you let me know if the current instructions work for you (no rush!)? If they do I’ll feel a bit more confident about adding the functionality you’re looking for.

    Regards,
    Tom.

    Hi Tom
    I don’t think I have ever had any wordpress instrutions work as well as yours. The slideshow is there and plays as it should on all pages as you designed it. I have three comments.

    1) The slideshow spans the entire width of my screen rather than the width of my site. I think I would prefer it to span the width of the site. I did minimize my page and the image was responsive which is great. I would like to optimize this site for mobile at some point.

    2) As we spoke about before I would prefer that the slideshow appear only on the home page and that the other pages would have either nothing or the ususal header image.

    3) In your instructions you advised us to set the image size to 1080×200 and then turn on the stretch option. To get the best resolution I would prefer to edit my images to the size I want and see that image in the header slide show. Could you enlighten us on this issue please.

    http://blackdog.freshbreezeinn.com/

    Just so you know I have made a simple change in the header.php which eliminates the navigation from the top of the site. That being resolved, it has created another problem which I have solved but it is a little bit hay wire. If you scroll down on the page, just as the header is about to leave the page you will see there is a space that toggles on. I want to get rid of that. What I have done that works is to delete a block of code which I think eliminates the “mast head”

    Thanks again for your efforts on this.

    Bob

    Thread Starter adeb

    (@adeb)

    Bob! You can set the image size to what you want! I use the recommended size for header image 1260×240 and it works great! I also unchecked the “Stretch – 100% wide output” button resulting in a perfect width following my site!

    //Per

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘Slider in header’ is closed to new replies.