Strip & WooCommerce Problem…

This topic has 13 replies, 3 voices, and was last updated 8 years, 6 months ago by Wes.

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

Author

Posts
June 21, 2016 at 5:43 pm #18394
Robert
Customer
I’m using this theme with WooCommerce and the Genesis Woocommerce Connector plugin. The problem is the icons for the credit cards with Stripe are massive and need to size into tiny icons. Any help you can provide would be great.

To see this go here…

https://www.stantonlanier.com/discounted-bundles-2/

Add any product to the cart and scroll down…you’ll see the credit card images.
June 21, 2016 at 7:25 pm #18396
Andykev
Customer
You have the max-width set to “100%” It is going to fill the space with that setting.

Use “11%” and it aligns the card images into a single line (at least on my screen size) so you may want to play with it to find what works for your desired look.
```
.woocommerce img, .woocommerce-page img {
    height: auto;
    max-width: 11%;
}
```
The above is the area to look for in the plugin settings/ .css
June 22, 2016 at 10:37 am #18405
Robert
Customer
Thanks…that does fix the credit card images BUT it also sizes down ALL images on the page, including what I have in my sidebar and in the these footer.
June 22, 2016 at 1:52 pm #18406
Andykev
Customer
I just viewed your SHOPPING CART page and the credit card logo images all look fine. I do not see any issue with your other images on that page, nor on your other web pages. Should not affect anything other than the images controlled by:

.woocommerce img, .woocommerce-page img

But it looks like you have dumped Woocommerce and are using a different shopping card.
June 24, 2016 at 10:31 pm #18436
Robert
Customer
I think you were looking at the wrong page…We are developing the Woocommerce behind the present public cart.

If you go to this page and add a product to the cart…

https://www.stantonlanier.com/31-days-of-december-peace-2/

…you’ll see the product icons in the cart are tiny. Also, scroll down to the very bottom of the page and in the middle footer there are images for social media; those are shrunken as well.

I have removed the sidebar I reference in my initial post. Basically, any images on the page, sidebar, and footers shrink now when on the WooCommerce cart and check out pages. I just want it to size appropriately the credit card images provided with the Stripe plugin.

Thanks for the help. I really appreciate it.
July 1, 2016 at 6:50 pm #18520
Robert
Customer
I removed the CSS provided above because it was shrinking ALL of the images on the page. I just need the credit card images resized.

I also put in a ticket with WooCommerce and they said…

“Yikes, I see what you mean! You’ll need to contact your theme developer for this one, as there is some theme-specific CSS missing that takes care of this.”

Wes, would you mind taking a look at this?
July 1, 2016 at 7:01 pm #18521
Robert
Customer
Here are some screenshots…

Here is the problem…the credit card images are HUGE!!!

https://www.stantonlanier.com/wp-content/uploads/2016/07/scrn1.jpg

When I apply the CSS fix suggested by Andy (above), it shrinks all the other images on pages in the WooCommerce cart and checkout sequence (see images for items in cart, and the social images in the footer)…

https://www.stantonlanier.com/wp-content/uploads/2016/07/scrn2.jpg
July 1, 2016 at 7:39 pm #18522
Andykev
Customer
July 1, 2016 at 7:40 pm #18523
Andykev
Customer
OK I am stumped. I did not see your footer and was focused on the VISA image.

I tried it on my website as well and it did the same thing. Gonna have to play with this some more.
July 2, 2016 at 1:54 am #18525
Robert
Customer
Yay! Well seeing the problem is the first step in finding a solution. 🙂
July 2, 2016 at 3:35 pm #18529
Wes
Moderator
Just now seeing this. I’m getting ready to release the new updated version of Epik, so I’ll test it out to see if this issue comes up. The new version already has WooCommerce support (with CSS) so I’ll let you know once I test it.
July 6, 2016 at 11:07 am #18584
Robert
Customer
Wes,

When will that fix be available? This site is supposed to launch today using WooCommerce.
July 6, 2016 at 11:10 am #18585
Robert
Customer
Also…for the Epik theme, I purchased this one over on studiopress.com so a fix here OR a quick push to that site for the update would be appreciated.

Thanks
July 6, 2016 at 12:06 pm #18588
Wes
Moderator
If you go to line 379 in your CSS and remove width: auto it instantly fixes it –
```
img {
	height: auto;
	width: auto;   <---- Try Removing This
}
```
I loaded that exact page on a local install/demo and here’s how it looks – http://i.imgur.com/9QmsPnB.png

This is how it looks without customizing any code, it shows up like this right out of the box.

Also, you’ll notice I got rid of the White Background for the content areas….as well as the shadows. This can always be added back if users want it.
Author

Posts

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

You must be logged in to reply to this topic.