• Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Register
  • Login
Bagisto Forum

Bagisto

  • Register
  • Login
  • Search
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups

Product Card redesign

General Discussion
2
5
365
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • H
    haseebkamboh last edited by 19 May 2024, 06:09

    Hi everyone,

    I'm currently working on redesigning the product card layout for the mobile view of our website. I want to display two product cards side by side on the front page, ensuring that the design remains clean, user-friendly, and visually appealing.

    Screenshot 2024-05-19 at 10.14.51 AM.png

    Screenshot 2024-05-19 at 10.39.27 AM.png

    1 Reply Last reply Reply Quote 0
    • Rishabh-Webkul
      Rishabh-Webkul last edited by 20 May 2024, 05:17

      Hello @haseebkamboh

      Greetings of the day..!!

      If you want to show 2 products in mobile view kindly go to packages >> Webkul >> Shop >> src >> Resources >> views >> components >> products >> carousel.blade.php this file and make your changes set minimum width and height accordingly.

      Frontend

      modileDesign.png

      Thanks & Regards..!!

      H 1 Reply Last reply 20 May 2024, 07:50 Reply Quote 0
      • H
        haseebkamboh @Rishabh-Webkul last edited by 20 May 2024, 07:50

        @Rishabh-Webkul
        I've been working on customizing the product card layout for the mobile view in Bagisto. My goal is to display two product cards side by side on smaller screens while maintaining an appropriate size for desktop screens.

        I attempted to adjust the minimum width of the product cards by changing the class from min-w-[291px] to min-w-[281px]. However, this change affected the card sizes for both desktop and mobile views in unexpected ways, causing layout issues and making the design cluttered and difficult to manage.

        Despite following the recommended approach of modifying the file located at packages/Webkul/Shop/src/Resources/views/components/products/carousel.blade.php, the adjustments did not yield the desired results.

        I'm finding it challenging to customize the layout effectively within Bagisto’s structure. Could anyone provide guidance on why these changes might be causing such issues and suggest a more reliable method to achieve the desired responsive design? Additionally, any tips on simplifying the customization process within Bagisto would be greatly appreciated.

        Thank you!

        Screenshot 2024-05-20 at 12.43.56 PM.png

        Screenshot 2024-05-20 at 12.41.43 PM.png

        H 1 Reply Last reply 22 May 2024, 07:17 Reply Quote 0
        • H
          haseebkamboh @haseebkamboh last edited by 22 May 2024, 07:17

          @Rishabh-Webkul
          Waiting for your response. thanks

          1 Reply Last reply Reply Quote 0
          • Rishabh-Webkul
            Rishabh-Webkul last edited by 22 May 2024, 12:10

            Hello @haseebkamboh

            Greetings of the day..!!

            To make it compatible and responsive with the mobile and desktop view then for this, you have to write media query in this file.

            Thanks & Regards..!!

            1 Reply Last reply Reply Quote 0
            1 out of 5
            • First post
              1/5
              Last post