Support » Themes and Templates » Sliding Door Theme

  • ATTENTION WAYNE CONNOR – This is the second time I’ve sent this email and hope WAYNE CONNOR will have a chance to respond soon.

    Hi. I have a website in which I use the Sliding Door Template on my main homepage and subsequent pages. I have done some marketing research that indicates that viewers on my site do not know to click on one of the Sliding Doors to get to the categories of information. Please see my website to see how I am currently using the Sliding Door Template.

    My question is “… is there any way to animate the Sliding Doors, such as having one at a time open and close, as they do when the mouse is placed on them currently? What I need is to have them moving in some way so viewers will recognize this section as “hot” and click on them, which I am told will cut down on my Bounce rate.”

    After you’ve had a chance to look at my site at, will someone please get back to me and let me know if we can work together, and how much it will costs, to work on getting this important function on my main homepage animated in some way?

    Thank you very much!

    [ Signature and phone number redacted, please do not post those here. ]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hi there Cindy, try this:

    Go to Appearance – Editor and on the menu right, select footer.php (I assume your theme includes it).

    Right above </body>, add this:

    <script>jQuery( window ).load( function() {
    jQuery( '#menu-sliding-door li' ).first().children( 'a' ).animate({ width: '310px' }).end().siblings().children( 'a' ).animate({ width: '77px' });

    That should animate your menu when the page loads, and will work normally once user hovers (places a mouse over) one of the items.

    Hi. Thanks for writing back. I tried the code you sent, and the only thing that happened was the first sliding door opened up and stayed open, until I hover over the other sliding doors … then they become animated.

    What I was wanting was constant slow moving activity (not only when a door is hovered over), where one sliding door at a time would slide open, then after a few seconds another sliding door would slide open.

    My marketing research indicated that viewers to my website may not know to click on the sliding doors to open up a category. I thought if I could animate them and make them move constantly on the main home page, that would draw the viewers eye to click on one.

    Can you help me, please?
    [ Signature and phone number redacted, please do not post those here. ]

    Hi, ok, I believe this code should do it then:

    <script>jQuery( window ).load( function() {
    var cInterval,
    doors = jQuery( '#menu-sliding-door li' ),
    current = 0;
    cInterval = setInterval( function() {
    if ( current == doors.length ) current = 0;
    jQuery( '#menu-sliding-door li' ).eq( current ).children( 'a' ).animate({ width: '310px' }).end().siblings().children( 'a' ).animate({ width: '77px' });
    }, 2000 );
    jQuery( '#menu-sliding-door' ).on( 'mouseenter', function() { clearInterval( cInterval ); });

    In the code, you will see number 2000, change that to adjust the interval between showing different panels (in milliseconds).

    It’s perfect!!! Exactly what I was looking for!

    Please check it out on my website, and see what you think.
    I simply cannot thank you enough for your help!

    [ Signature moderated. ]

    Hello, I have a blog using Sliding doors and it was working perfectly until the last update, the doors stopped animating, now it is static and its not working anymore. Is there anything I can do?

    My website is

    Thank you very much,



    Forum Moderator

    If you require assistance then, as per the Forum Welcome, please post your own topic instead of tagging onto someone else’s topic.

    I am now closing this 6 month old topic as it references an older version of WordPress and (probably) the theme.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Sliding Door Theme’ is closed to new replies.