Return to previous page

Product Slider – Remove Title, Price and Button

This topic has 11 replies, 4 voices, and was last updated 8 years, 6 months ago ago by Jack Richardson

rwlee33

Participant

October 8, 2015 at 11:11

Hi,

In the custom.css file was able to remove the title, price and “add to cart” button from the product slider, but I’ve run into some issues.

1. I leaves a big space underneath
2. Its different in desktop and mobile view. If I change the margin, or container size, it effects one or the other.

Basically, on the homepage, I want a product slider, but no titles, price or buttons. Just the image and the slider. I’d also like to make sure there is not a large space underneath and the scroll buttons are aligned on the sides.

Can you assist?

Please, contact administrator
for this information.

#92469 Copied

10 Answers

rwlee33

Participant

October 8, 2015 at 11:16

correction:

Hi,

In the custom.css file *I* was able to remove the title, price and “add to cart” button from the product slider, but I’ve run into some issues.

#92472 Copied
Brian Johnson

Member

October 8, 2015 at 11:19
Hello

Please add folowing code into the custom.css to remove white space underneath:
```
.slide-item .product .product-image-wrapper, .products-grid .product .product-image-wrapper{margin:0}
.slide-item .product .add-to-container, .products-grid .product .add-to-container{padding:0}
.items-slider.products-slider.-container.slider-7845{margin:0}
```
Please specify whta issues you are expiriencing. You may use this service to point us in the right direction: http://prntscr.com/.

Regards,
Brian Johnson
#92476 Copied
rwlee33

Participant

October 8, 2015 at 12:36

Hey Brian,

Much appreciated for the super fast reply! Thanks, that’s looking so much better. There’s still a small gap I’d like to reduce. Can you help make that a bit smaller?

Thanks!

Rob

#92500 Copied
Robert Hall

Support staff

October 8, 2015 at 12:41
Hello,

Try to add this code in custom.css
```
.items-slider {
margin-bottom: 20px;
} 
```
Regards,
Robert Hall.
#92503 Copied
rwlee33

Participant

October 8, 2015 at 23:55

Thanks Brian and Robert.

The first step helped, but the second step didn’t do anything. Instead of a margin of 20px I used -30px, but now something strange happens. Different size screens use a different size image, and there is a different size margin after the slider. Also, when the slider goes to the last image, the margin jumps up and the slider is above the text and section below it.

Not sure how to handle this, but it’s taken up a lot of time to fix.

If you have any more suggestions, I’m all ears.

Thanks!

#92635 Copied
Brian Johnson

Member

October 9, 2015 at 07:48
Hello

Please try to add following code into the custom.css:
```
.slider-container {margin-bottom:-40px }
@media (max-width: 979px) and (min-width: 768px){.slider-container {margin-bottom:-290px }}
@media (max-width: 768px) {.slider-container {margin-bottom:-150px }}
```
Regards,
Brian Johnson
#92682 Copied
rwlee33

Participant

October 9, 2015 at 13:14

looks good, but on mobile, when you swipe to the last item, the blocks below just up and get smooshed and covered up. Strange. Can you take a look at the main site on mobile? Thanks!

Please, contact administrator
for this information.

#92831 Copied
Brian Johnson

Member

October 9, 2015 at 14:03
Hello

Please try to add this code and adjust positive margin value:
```
@media (max-width: 767px) and (min-width: 481px){
.slider-container {margin-bottom:60px }}
```
Regards,
Brian Johnson
#92844 Copied
rwlee33

Participant

October 21, 2015 at 03:32

Things got a bit messy with the custom code, so I found another solution with another plugin. Thanks for the help, but the solutions above never really fixed the issue. Basically, I just wanted a slider of product images, but couldn’t without removing everything in the custom css, then it caused strange behavior and was more trouble than it was worth.

If you have a theme solution for product image slider, I’d love to hear it.

Thanks,
Rob

#95246 Copied

Jack Richardson

Support staff

October 21, 2015 at 08:13

Hello,

Could you please show a screenshot of your problem?

Thank you.

Best regards,
Jack Richardson.

#95267 Copied
Tagged: buttonless, priceless, product slider, themes, titeless, woocommerce, wordpress
Viewing 11 results - 1 through 11 (of 11 total)