Forum Replies Created

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hi @stuartduff:

    Thanks. I made it display 4 products in a single row even if it is on a small handheld device (mobile phone). But after a while I did not touch the website, now it only shows 1 product per row on my phone. I need to put the phone horizontal to display 4 product per row. On computer monitor it is 4. Is there any automatic update recently? Not sure why they did that. It drives me crazy.

    BTW, the payment method on the checkout page was set to paid by check, but today it become not available for no reason. Luckily I successfully set it back to pay at pick up. Before that I received 4-5 messages from customers asking why they could not select the payment method and therefore could not place a order. These updates are killing me. I simply want it to work, I do not need it to be updated and fancy.

    http://www.sweetriceking.com

    Thanks.

    Hi @stuartduff:

    Thanks. I made it display 4 products in a single row even if it is on a small handheld device (mobile phone). But after a while I did not touch the website, now it only shows 1 product per row on my phone. I need to put the phone horizontal to display 4 product per row. On computer monitor it is 4. Is there any automatic update recently? Not sure why they did that. I drives me crazy.

    BTW, the payment method on the checkout page was set to paid by check, but today it become not available for no reason. Luckily I successfully set it back to pay at pick up. Before that I received 4-5 messages from customers asking why they could not select the payment method and therefore could not place a order. These updates are killing me. I simply want it to work, I do not need it to be updated and fancy.

    http://www.sweetriceking.com

    Thanks.

    Thread Starter andywk

    (@andywk)

    Figured the single product page issue. Thought it might help the other beginners who might be in the same situation:

    @media (max-width: 767px) {
    .storefront-full-width-content.single-product div.product .summary {
    margin-left:10%;
    width: 80%;
    }

    .storefront-full-width-content.single-product div.product
    .woocommerce-product-gallery {
    margin-left:10%;
    width: 80%;
    }

    .single-product
    .woocommerce-breadcrumb {
    margin-left: 0px;
    }
    }

    Thread Starter andywk

    (@andywk)

    This is what worked to present multi columns on mobile:

    @media (max-width: 767px) {
    ul.products li.product {
    width: 25%;
    float: left;
    clear: both;
    }

    ul.products li.product:nth-child(1n) {
    clear: none;
    float: left;
    }
    }

    I still have the single product page not showing correctly. I tried to Inspect the element and add a left margin of 15px and it looks fine. But I have no idea how to determine if it is a mobile device or desktop (resolution of 768?), and how to write the code for the additional margin. Anyone helps, please?

    Take this page for an example (showing on mobile):

    http://www.sweetriceking.com/product/sweet-rice-original-flavor/

    Many thanks!

    • This reply was modified 8 years, 6 months ago by andywk.
    Thread Starter andywk

    (@andywk)

    @mikeyarce

    Some background – I was trying to create a child theme based on storefront, however, the header background turned to black and no matter what I tried it stayed black. That is why I reverted back to storefront with using the child theme.

    I have tried copying your code to the end of the style.css file under domain/wp-content/themes/storefront, it did not work. Also I copied your code to Customizing Additional CSS under dashboard, it did not work either. I am not sure if I did anything wrong. Editing CSS never worked for me, not sure if I have to use child theme to make it work.

    I hate to say I am new but I have been working really hard these days (day and night) to get the simple website to work. Can you please give me another hint how exactly I should incorporate your code? Greatly appreciated!

    -Andy

    Thread Starter andywk

    (@andywk)

    @mikeyarce Thank you Sir. Let me try. Cheers!

Viewing 7 replies - 1 through 7 (of 7 total)