WordPress.org

Forums

zAlive
[resolved] Alter height of the slider (7 posts)

  1. globaltrailblazer
    Member
    Posted 1 year ago #

    Hi

    My blog is at Tales from Over the Horizon

    I'm trying to set the height of the slider, but can't seem to make anything work. It keeps on jumping around in height depending on the size of the photos. I would like them to be automatically sized when inserted into the slider/ or to be able to size them myself.

    I added an extra picture to stop it jumping around, but these pictures are still too big. I still want to make the shorter.

    One place I found said to download PC Custom CSS

    and then paste

    .flexslider .slides img {
    height: 340px;
    width: auto;

    and change the height as you want.

    I tried to fix it doing that.

    To activate the PC Custom CSS plugin, it said to type the CSS into Custom CSS under Appearance. I did not know what to type. So I pasted the code written above. It did not work.

    What am I supposed to put in the Custom CSS place and where am I supposed to put the code above.

    OR if there is a different way of setting the slider height. Please tell me!

    Thank you for your time

  2. coreyscott
    Member
    Posted 1 year ago #

    Hi

    Try adding the code below to your custom css. Notice the closing brace that I added which closes the css declaration.

    .flexslider .slides img {
       height: 340px;
       width: auto;
    }
  3. globaltrailblazer
    Member
    Posted 1 year ago #

    Thanks for the suggestion, tried it, but when I went back to my Blog the photos were still as huge as they were before. They take up an entire page.

  4. coreyscott
    Member
    Posted 1 year ago #

    Okay try adding this to your css

    .carousel-inner img {
    
       height: 340px;
       width: auto;
    }
  5. globaltrailblazer
    Member
    Posted 1 year ago #

    Ok that did something. It has them at good height, but now they are far too small width wise. They look to be what the theme calls medium size. They take up somewhere between a third and a half of the bar width.

  6. coreyscott
    Member
    Posted 1 year ago #

    In order for the images to stay proportional change the last code you added to

    .carousel-inner img {
      height: auto;
      width: 100%;
    }

    Now when you upload your images for the slider crop them to your desired height but you have to make sure the image is large enough so it won't stretch.

    Let me know what happens.

  7. globaltrailblazer
    Member
    Posted 1 year ago #

    Yes, that works great. Thank you very much for working through all the computer language with me. I have no background in it.

    Thank you for all your help. I'd never have sorted it out otherwise.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic