Search code examples
csswordpresssliderbanner

How do I customize banner width on this free theme?


Here's is the link to my client's site:

http://contentchilly.com/

I opened editor in Wordpress and found only one slider related PHP. I do not know PHP but have an idea. So I found this file named "tc_voila_slider.php" and found that it had 3 lines like :

 <img width="1170" height="500" src="<?php echo TC_BASE_URL ?>inc/img/colonnes.jpg" class="slide wp-post-image" alt="<?php _e( 'Create beautiful sliders','customizr') ?>">

In all three lines, I changed the width to 500 and height to 200, but it's not showing any change. How do I modify the widths and heights of my banner on slider? It's just stretching my banner images. Also I want to move the slider up a bit. There's a lot of space empty and below the sliders, there are 3 circles that I want to show users on home page so they don't have to scroll down. How do I get rid of extra spaces?

Edit

Also, I put this code in style.css after inspecting the images in firebug; it's no use either.

.slide .wp-post-image {
  width=200px;
  height=200px;
}

Solution

  • In customizr you can add some custom css in style.css, just edit it and modify the slider with adding the lines below :

    .carousel-image img {
      width: 200px;
      height: 200px;
    }
    

    This should works

    EDIT

    To change the position of the slider you have to modify the .carousel .item, reduce the height` will make it higher in your page for ex.

    To reduce the space between the slider and the 3 circles you can delete the margin-top instruciton in #main-wrapper.

    As you probably know, it's pretty hard to answer to this type of question whithout having the whole graphic layout. CSS can be pretty hard to configure, especially when you got many parameters as here.