Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #5690

    I’m thinking of buying the AviaSlider for my Kriesi themes.

    1. Can the slideshow be placed in widget areas?

    2. Is it possible for the slidehow to NOT autostart?




    Ok – I went ahead and just bought the slider as i figure it must be possible to use the slider with Wordress.

    So i’ve uploaded the various files into my Newscast theme folder, then i’ve inserted the code below into a page (based on the Avia documentation). I’ve checked all the URL’s and they appear to be opening the revelent files. When i view the page my images appear to be stacked on top of each other with no slideshow. Where have I gone wrong?

    Link to slideshow page:

    <!– ########## CSS Files ########## –>

    <!– Screen CSS –>

    <link rel=”stylesheet” href=”” type=”text/css” media=”screen” />

    <!– lightbox CSS –>

    <link rel=”stylesheet” href=”” type=”text/css” media=”screen” />

    <!– ########## end css ########## –>


    <script type=’text/javascript’ src=’’></script>

    <script src=”” type=”text/javascript”></script>

    <!–this file includes the aviaslider: –>

    <script type=’text/javascript’ src=’’></script>

    <!–this file includes the activation call for the avia slider. You should edit here: –>

    <script type=’text/javascript’ src=’’></script>

    <ul class=”aviaslider” id=’slider1′>

  • $(‘#frontpage-slider’).aviaSlider({

    blockSize: {height: 80, width:80},

    transition: ‘slide’,

    display: ‘all’,




Ok – I made some changes since my previous post. I moved the Javascript code to header.php and included the CSS in my main style.css file.

Now in my WordPress page:

I just have this HTML:

<ul class=”aviaslider” id=’slider1′>

  • ….but still I just see the top image and no slideshow?


    Finally got it working in WordPress. If you want to use the slider in WordPress:

    1. Use FTP to copy the HTML (located within the purchased/downloaded zip) folder into the your wordpress theme folder and rename it to something like ‘avia’

    2. Copy the Javascript code found in the example index.html to header.php.

    3. Copy the css into your style.css file

    4. Copy the HTML for the images into a page (HTML mode). Use the code found in the example index.html file.

    5. Make sure you update all the URL’s to point to the correct files.

    * DO NOT use the example code given in the documentation – there are mistakes in there that will cost you hours of head scratching.


    OK, next issue. The slideshow displays and slides but there are no controls on the slider?


    Made a little more progress – i’ve got the slideshow in the sidebar which is actually where i want to use it and 4 little radio buttons have also appeared. If your using this slideshow make sure you update the URL’s that are included in the CSS file. I assumed there would’t be any URL’s here but I was wrong.

    The problem i have now is that the formatting is out of line. The 4 radio buttons appear vertical instead of horizontal and the slideshow is jumping around a bit. Any ideas?



    in the link you provided I don’t see any vertical buttons, could you link to your site where I can see the problem?


    When the slideshow is in the sidebar, 4 vertical buttons appear but for now I have the slideshow in a page where no buttons show. So I guess the question has become – how can I get the slideshow to display the navigation in a page?


    Viewing 8 posts - 1 through 8 (of 8 total)

    The topic ‘AviaSlider’ is closed to new replies.