Hero Slider – not showing correctly

Support Area Forums Elite Hero Slider – not showing correctly

Viewing 13 posts - 1 through 13 (of 13 total)
URL to the page in question: http://www.destinationharrow.co.uk/
  • Author
    Posts
  • #28907
    glen hearnden
    Participant

    Hi,

    Hope a quick one for you. Have used the Elite theme successfully before for other sites, but this one has given me a headache. I think I am missing something obvious…

    Got Slides set up, got slide group set up, got page set up to use that group and slides, but…
    The slides just don’t display at all, just a blank space where they should be, between the top nav area and home1 section. If I put text into the slide hero title and hero caption fields, then the image displays, but all squashed up at top of screen, behind the nav bar and logo area.

    Any ideas what I am missing? Thanks in advance.

    Paul

    (Just as a side point – I scan the past forum questions if I have a problem, but as the list gets longer, its more difficult to find a query that might hold the answer. If you have a search facility in your forum, would it not save you a lot of duplicated responses? For instance I could have searched through for ‘slides not showing’, which might have found a previous response) Just an idea…

    #28908
    Bill Robbins
    Moderator

    Hey Paul,

    Sorry for the trouble there. I took a quick look at the home page and the slideshow came right up this time around. I’ve attached a screenshot to show what I’m seeing; hopefully what you’re intending to show. You might try clearing out your browser’s cache and refreshing the page and see what turns up then.

    We do have a search feature for the forum. It’s on the home page of our support site (https://support.organizedthemes.com) in the main content column. I believe I’ll add one in a widget as well so that it’ll be visible on each screen too.

    If the slider doesn’t come back for you, let me know.

    Thanks,
    Bill

    #28911
    glen hearnden
    Participant

    Well that is weird! I clear my cache and history, I close browser and restart, still the slides only show in band at top of screen, behind the menu nav area. See screen garb attached.

    Tried on PC and MAC and different browsers, so assume something not set correctly. I have removed slides and replaced and tried refreshing and saving just about all settings, can you see anything obvious I am missing?

    Odd how the image of the slide does not show at all, if I do not enter text into the Hero Title or Caption fields – whats that about..?

    Paul

    ( another site using Elite Theme shows a similar problem where the slide ‘sometimes’ overlaps and covers the home1 section texts.)

    #28913
    glen hearnden
    Participant

    Anything to do with screen size settings>>> when you shrink or stretch the browser window size it show more of the slide image, but still at small window size, it has a large blank area below, between slide and home1 section… thought it might give you a lead…
    It is like it just is not showing full slide image, oh and seems to be shifting it up the window to incorrect position…!

    Go on tell me something really obvious… 🙂

    Thanks in advance for your attention…

    #28914
    glen hearnden
    Participant

    (on the search issue – I meant within each themes forum, so able to search say the ‘Elite’ forum queries for solutions or mathcing problems, rather than ask you what might be a repetitive query.) Might not be possible or save you any time. Just always concerned about just asking something you have already solved for someone else.

    #28915
    Bill Robbins
    Moderator

    Paul,

    It looks like I created the trouble with the caption alignment in the last update. I’ll release another one this afternoon to put that back as it had been. Until then you can swap out the contents of the style.css file for the one at https://gist.github.com/billrobbins/c182b1ea65af3c429d21 and hopefully that will bring things back into line.

    Resizing the slideshow has always been a pain point. I did have a helper in the javascript at one point to force the slideshow to recalculate its height on resize, but sometimes that caused extra space to appear below the footer as the slideshow ran. It didn’t happen all the time, but it did affect some users.

    If you’d like to give it a try again, here’s what to do.

    1. Go to the Appearance section in your WordPress dashboard and choose Edit.
    2. From the list of files on your right, choose custom-js.php
    3. Look for this:
      
      // Slicknav	
      	jQuery('#primary-menu').slicknav({
      		prependTo:'#header-content',
      		label: ''
      	});
      

      and right above that add this:

      
      	// Resize flexslider's height with window resize
      		jQuery(window).resize(function() {
      			var ww = jQuery(window).height();
      			jQuery('#hero-section .flexslider ul li').each(function() {
      				jQuery('#hero-section .flexslider ul li').height(ww);
      			});
      		});
      
    4. Save your changes.

    If you do give that a try and it works well for you, let me know. I made a small change to that code and it might just keep the extra space at the footer from creeping in again. Fingers crossed.

    Thanks,
    Bill

    #28916
    Bill Robbins
    Moderator

    I will take a look at a individual forum search again. That would be of great benefit indeed.

    #28937
    glen hearnden
    Participant

    Hi Bill,

    Many thanks for the latest Elite theme update – resolved the issue raised yesterday about display of hero slides, being a bit wacky. Great news!

    Noticed another issue, which comes under same Hero Slider heading, so kept in this topic.

    This was raised by someone else in Elite forum, in Oct2014…
    The Hero image not adjusting ‘properly’ in different window sizes. If I have the site open in a not-maximized window, the Hero image fills the window ok. Then if I maximize or shrink it, it won’t display properly until I refresh the page. Same when viewing on different mobile devices and screens. Is there a way that the Hero slider can be set to respond to the window size automatically?

    Think you identified and fixed in an update at the time (Oct2014), but seeing the issue now with our site, so has something reverted in subsequent updates, or is there something more to be done? (sorry for the headache!)

    Thanks in advance.
    Paul

    #28944
    Bill Robbins
    Moderator

    This has been a troublesome issue on and off for some time. The solution that’s in the theme now was created before there were options for different sized hero sections. Because of that, it’s set to resize using the full window height. It looks like this page is using a shorter hero. Let’s make an edit and see if it won’t bring things into line:

    1. Go to the Appearance section in your WordPress dashboard and choose Edit.
    2. From the list of files on your right, choose custom-js.php
    3. Look for this section:
      
      
      jQuery(window).resize(function() {
      	var ww = jQuery(window).height();
      	jQuery('#hero-section .flexslider ul li').each(function() {
      		jQuery('#hero-section .flexslider ul li').height(ww);
      	});
      });
      

      and replace it with this:

      
      jQuery(window).resize(function() {
      	var ww = jQuery('#hero-section').height();
      	jQuery('#hero-section .flexslider ul li').each(function() {
      		jQuery('#hero-section .flexslider ul li').height(ww);
      	});
      });
      
    4. Save your changes.

    See if that doesn’t keep the resizing more in line.

    Bill

    #28945
    Bill Robbins
    Moderator

    One other thing. If you find extra space being added below the footer as the slideshow cycles, try doing this and see if it won’t keep that from happening:

    1. Go to your theme options page and choose the Advanced tab.
    2. Scroll down to the Custom CSS box and add this:
      
      #hero-section
      
    3. Update your settings.

    Thanks,
    Bill

    #28991
    glen hearnden
    Participant

    Thanks as usual Bill. I put a copy of the custom-js.php file in my child theme includes and edited that (not sure if needed), so hope that will avoid losing code change, if update to theme in future. The hero resizing seems to work in a fashion, but not sure all devices and screens looking their best. Will do some more testing.
    For info – The footer does have added space at bottom, but your code (#hero-section) snippet does not resolve that.

    #28995
    Bill Robbins
    Moderator

    Paul,

    Let’s try one more thing to see it will keep the space from appearing below the footer:

    1. Go to your theme options page and choose the Advanced tab.
    2. Scroll down to the Custom CSS box and add this:
      
      #hero-section { overflow: hidden; }
      
    3. Update your settings.

    Let me know what you turn up there.

    Thanks,
    Bill

    #28996
    glen hearnden
    Participant

    Bill, well done, you’ve done it! That seems to stop the extra space appearing under footer when window is resized. Will keep an eye on and test on other devices. But looks better.

    Thank you very much.

    Paul

Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Hero Slider – not showing correctly’ is closed to new replies.