Space for clicking on the product image bigger than the image

Home Forums SKT Black/White Theme Support Space for clicking on the product image bigger than the image

This topic contains 17 replies, has 2 voices, and was last updated by  Forum Moderator 2 years, 5 months ago.

Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • #67044

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    Hey Dave šŸ˜‰

    My last Problem…

    The space for clicking on the productimage (to get on the single-productpage) is bigger than the image it self… Is that fixable? Because the gab between the products is very big, just because of it.

    Would be awesome!
    Thanks

    #67064

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Again your website is in construction mode.

    #67065

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    I`m sorry!

    now its open again…

    #67068

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Hi,

    Add this code in Custom CSS Box:

    .woocommerce div.product div.images img { width:100% !important;}

    Regards,
    Dave

    #67070

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    thanks for the answer, but i need to have the images smaller than 100%… actually like 50%. And the rest of the 50% seems like to be the empty space between the products which i wanna get rid off šŸ™‚

    #67282

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Kindly go to AppearanceĀ»Theme OptionsĀ»Basic SettingsĀ»Custom CSS Box:

    Add this code there:

    .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images { width:24% !important;}
    .woocommerce div.product div.images img { width:100% !important;}
    .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary { width:68% !important;}

    Regards,
    Dave

    #67337

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    Thank you for the answer, but i doesn’t change anything :S

    #67430

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Hi Joshua,

    Can you send us screenshot? Upload your screenshot on imgur.com and paste the share URL here.

    Regards,
    Dave

    #67632

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    Hey,

    here we go:http://imgur.com/a/8kli3

    Regards

    #67751

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    What exactly you want? Can you draw instructions on the screenshot so that we can resolve the issue asap.

    Regards,
    Dave

    #67754

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    View post on imgur.com

    I want the images smaller, but close to each other.
    The codes you gave me just made them smaller but the gab got bigger..

    Thanks!

    #67758

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Hi,

    Remove this code from Custom CSS Box:

    .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images { width:24% !important;}
    .woocommerce div.product div.images img { width:100% !important;}
    .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary { width:68% !important;}

    We will provide you another CSS after removing this code.

    Regards,
    Dave

    #67762

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    I did šŸ™‚

    #67763

    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 21662
    • Total: 21662
    Member since: August 16, 2013

    Add this code in Custom CSS Box:

    .site-main { margin-left:0;}
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width:15% !important; margin-right:25px !important;}

    Regards,
    Dave

    #67904

    joshua
    Member
    • Topics: 5
    • Replies: 38
    • Total: 43
    Member since: March 24, 2017

    Thank You, know it Looks Perfect, but there are only 4 Products in a row and i cant Change it in more :s

    Kind Regards,

    Josh

Viewing 15 posts - 1 through 15 (of 18 total)

You must be logged in to reply to this topic.