How to change product display to 1 instead of 2 ? On the account page when logged in ?

This topic has 17 replies, 3 voices, and was last updated 3 months ago ago by Luca Rossi

  • 16 Answers
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    August 10, 2024 at 05:32

    Hello, @Elhadj07,

    Thank you for contacting us and for using XStore.

    To address the issue you are experiencing, we kindly ask you to insert the following Custom CSS Code into your XStore theme. Please navigate to Theme Options > Theme Custom CSS > Mobile CSS and add the code below:

    .woocommerce-account .carousel-area .product-slide {
        width: 100% !important;
    }

    We trust this will resolve your concern effectively. Should you require any further assistance, please do not hesitate to contact us.

    Best Regards,
    The 8Theme Team

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 10, 2024 at 13:41

    Hi Tony,

    Thank you for your support. My question Is: it at Mobile CSS I have to add the code or At Global CSS, because I can’t see Mobile CSS there.

    Thanks very much!

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    August 10, 2024 at 13:50

    Hello, @Elhadj07,

    Thank you for your response.

    We kindly request that you remove the previous CSS code and implement the following custom CSS code. You can do this by navigating to Xstore > Theme Options > Theme Custom CSS > Global CSS. Please ensure to check the functionality on mobile devices after making this update.

    Here is the CSS code to be added:

    @media only screen and (max-width: 767px) {
        .woocommerce-account .carousel-area .product-slide {
            width: 100% !important;
        }
    }

    We trust this adjustment will enhance the mobile responsiveness of your site. Should you have any questions or require further assistance, please do not hesitate to contact us.

    Best regards,
    8Theme’s Team

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 10, 2024 at 15:12

    Hi Tony,

    I have added the last css code it did update to just one listing which is perfect, but it doesn’t look very smooth. The last last listing just show half and when you click on to the navigation you have to click twice for the full listing to show.

    At first it show half of the image then the second time it show the full listing.

    I have included a screenshot and a short video recording for your reference.

    Thanks very much for your support!

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 10, 2024 at 15:19

    Hi Tony,

    I have added the last css code it did update to just one listing which is perfect, but it doesn’t look very smooth. The last last listing just show half and when you click on to the navigation you have to click twice for the full listing to show.

    At first it show half of the image then the second time it show the full listing.

    I have included a screenshot and a short video recording for your reference.

    Thanks very much for your support!

    Files is visible for topic creator and
    support staff only.
    Avatar: Justin
    Luca Rossi
    Support staff
    August 12, 2024 at 04:39

    Hi @Elhadj07,

    Currently, there is no hooks to edit the number of proudct displays on mobile and you also didn’t install the XStore Child Theme also.

    In this case, you have to edit directly the template files in parent theme. First remove the provided custom CSS codes then please go to this file:

    /wp-content/themes/xstore/woocommerce/myaccount/dashboard.php around line 92-99

    – Change from this:

    
    $slider_args = array(
        'title' => esc_html__('You may also like...', 'xstore'),
        'large'            => 3,
        'notebook'         => 3,
        'slider_autoplay'  => false,
        'navigation_style' => 'style-4'
    );
    

    – To this:

    
    $slider_args = array(
        'title' => esc_html__('You may also like...', 'xstore'),
        'large'            => 3,
        'notebook'         => 3,
        'slider_autoplay'  => false,
        'navigation_style' => 'style-4',
        'mobile' => 1
    );
    

    Hope it helps!

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 12, 2024 at 19:51

    Hi Luca,

    Okay I would like to install the child theme and do it that way.

    Could you please explain how can I install the child theme without it changing my header configuration as you mentioned previously that I could change my header configuration?

    Thanks very much!

    Avatar: Justin
    Luca Rossi
    Support staff
    August 13, 2024 at 06:38

    Hi @Elhadj07,

    FYI: Before proceeding with the troubleshooting/install child theme or any updates, we strongly recommend taking a complete backup of your site to safeguard against any potential data loss.

    Please follow these steps:

    1. Navigate to XStore > Theme Options > Header Builder > Header Templates > Export/Import > then export the current header template of your website: https://prnt.sc/H3DUJXGscG0V

    2. Download the child theme archive from this page https://www.8theme.com/downloads/ and install the XStore Child Theme:
    https://prnt.sc/q94_C5zy4zpg
    https://developer.wordpress.org/themes/advanced-topics/child-themes/#install-and-activate-child-theme

    3. Please note that the child theme does not inherit the theme options of the parent theme, if you enable the child theme, you need to import options from the parent theme.
    Go to Theme Options (when the parent theme is activated) > Import/Export > download the export file. After that Activate the child theme (Appearance > Themes) > go to Theme Options > Import/Export > import your options and reload the page without saving! Save options only after reloading. Check your site after that, and use the child theme.”

    4. Import the header which you export from step 1 under XStore > Theme Options > Header Builder > Header Templates > Export/Import.

    Let us know how it goes!

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 13, 2024 at 20:13

    Hi Luca,

    Thanks for the instructions.

    I did as you instructed, exported the header template and installed the child theme and also did what you mentioned at 3.

    But when I activated the child theme many settings where messed up and I imported the header template but no header visible either.

    I have now deactivated the child theme again and activated the main theme and all look as was.

    Could you please have a look on that for me ASAP. Child theme already installed.

    Many thanks for the support!

    Avatar: Justin
    Luca Rossi
    Support staff
    August 14, 2024 at 06:08

    Dear @Elhadj07,

    We hope this message finds you well. Could you kindly initiate a backup of your website at your earliest convenience? Once completed, we will proceed with the necessary steps on our end.

    Thank you for your attention to this matter.

    Best Regards,
    8Theme’s Team

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 14, 2024 at 08:02

    Hi Luca,

    I already have a backup.

    Thanks very much!

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 14, 2024 at 11:44

    Login details

    Please contact administrator
    for this information.
    Avatar: Justin
    Luca Rossi
    Support staff
    August 14, 2024 at 12:05

    Dear @Elhadj07,

    We’ve switched to the XStore Child Theme for you.

    Could you please double check?

    To override this file by using child theme, follow these steps:

    1. Copy this file: /wp-content/themes/xstore/woocommerce/myaccount/dashboard.php from XStore parent theme
    2. To the child theme: /wp-content/themes/xstore-child/woocommerce/myaccount/dashboard.php
    3. After that, edit this file: /wp-content/themes/xstore-child/woocommerce/myaccount/dashboard.php around line 92-99
    4. Find this code:

    
    $slider_args = array(
        'title' => esc_html__('You may also like...', 'xstore'),
        'large'            => 3,
        'notebook'         => 3,
        'slider_autoplay'  => false,
        'navigation_style' => 'style-4'
    );
    

    5. Change to this code:

    
    $slider_args = array(
        'title' => esc_html__('You may also like...', 'xstore'),
        'large'            => 3,
        'notebook'         => 3,
        'slider_autoplay'  => false,
        'navigation_style' => 'style-4',
        'mobile' => 1
    );
    

    Hope it helps!

    Avatar: Elhadj07
    Elhadj07
    Participant
    August 14, 2024 at 14:26

    Hi Luca,

    On the child theme I don’t see this option: ( /woocommerce/myaccount/dashboard.php ).

    It is only available on the parent theme.

    I have shared screenshots could you please have a look and guide me on how to proceed now.

    On child theme there is only functions.php.

    Thanks very much for the support

    Files is visible for topic creator and
    support staff only.
    Avatar: Elhadj07
    Elhadj07
    Participant
    August 14, 2024 at 16:32

    Hi again Luca,

    On the child theme I created new folder for woocommerce and in woocommerce folder I created myaccount folder and uploaded the dashboard.php from the parent theme.

    This is my first time doing it so I just wanted to make that it’s the correct way.

    I changed the code at line 92 to 99 and used the new code you provided.

    I checked on mobile and now all working fine.

    Thanks very much for the awesome support!

    You guys at 8theme are the best when it comes to support, I am very happy and satisfied with the level of support I have been receiving from you.

    Avatar: Justin
    Luca Rossi
    Support staff
    August 15, 2024 at 05:16

    Dear @Elhadj07,

    In the spirit of gratitude, we want to express our appreciation for your trust in our products. As a valued customer, your experience matters greatly. Would you consider sharing it by giving our theme a deserving 5-star rating on ThemeForest?

    Click here to share your thoughts: https://themeforest.net/downloads

    Being part of our community means a lot, and your feedback contributes immensely.

    Best Regards,
    The 8Theme Team

  • Viewing 17 results - 1 through 17 (of 17 total)

The issue related to '‘How to change product display to 1 instead of 2 ? On the account page when logged in ?’' has been successfully resolved, and the topic is now closed for further responses

8theme customization service
We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.