Editing and finding various elements on X-Store?

Hello, @GTP,

Thank you for contacting us and for using XStore.

1) We appreciate your interest in achieving a unique and personalized look for your website.

To address your concerns, you can indeed modify the appearance of the Tabs section and reposition it on the left, bottom, or right side of the page. To implement these changes, please follow the steps outlined below:

-Modify Appearance:

a) Navigate to the WordPress dashboard.
b) Go to Static Block and create a new one using Elementor.
c) Integrate any products or customize the content to your preference.
Update the Static Block.

-Adjust Tabs Position:

a) Edit the page with Elementor.
b) Add the XStore Tabs widget >> in Content >> Items.
c) Select the content type as “Static Block” and choose the one you created in the previous step.

For a visual guide, please refer to the image provided at the following link:https://imgur.com/a/dW2VhVY

2) The optimal approach for creating these would be to import pre-built templates from XStore Studio and customize them according to your specific requirements. To initiate this process, kindly navigate to the WordPress dashboard and edit any page, post, or static block utilizing Elementor. Within the “Drag widget here” section, access XStore Studio and incorporate the pre-built template that aligns with your needs. Subsequently, proceed to customize the imported template as necessary.

For a visual guide, please refer to the image provided at the following link:
https://imgur.com/a/4flE5iD
https://imgur.com/a/j6JseCK

For your convenience, we have provided the link to the XStore Studio library below. Please explore the extensive range of pre-built templates available:https://xstore.8theme.com/studio/

Best Regards,
8Theme’s Team.

Hello, @GTP,

1) Thank you for reaching out. To customize the top section of the General tab in XStore, please follow these steps:

a) Navigate to the Configure XStore General Tabs Settings.

b) In the Content section >> General, you can customize the Layout and Horizontal style. Select your desired options, such as Style 4 or others.

c) In the Style section >> Tab, you can further refine the appearance. Here, you have the flexibility to set the typography for the tabs text. Additionally, within the Tab option, you can modify the background color and text color for various states, including Hover and Active.

By adjusting these settings, you should be able to achieve the desired look for the General tab top area. If you encounter any challenges or have specific requirements, feel free to reach out for further assistance.

For a visual reference, please consult:
https://imgur.com/a/NfB7ggE
https://imgur.com/a/YMGYw85

2) You can easily set the position of the XStore General Tabs. Please follow the steps below:

a) Navigate to the Configure XStore General Tabs Settings.

b) In the Content section >> General, you will find the option to set the position of the tabs. Select your desired position, such as Right Align or any other preference you may have.

For a visual reference, please consult: https://imgur.com/a/UfE9MOg

3) Copying content from another website or theme is not feasible due to the inherent dependency on the functionality of your specific theme. The ability to replicate sections is contingent upon the features and architecture implemented within your theme. Therefore, customization or extraction of elements from external sources may not align seamlessly with your theme’s functionality.

a) Our solution involves incorporating the XStore Ajax Product Tab element, which provides a dynamic and user-friendly interface for presenting tabbed content. This feature seamlessly integrates with your website and allows for an aesthetically pleasing and efficient display of information.

To implement this feature on your page or post using Elementor, kindly follow these steps:

b) Edit Any Page or Post with Elementor:
Navigate to the page or post where you intend to integrate the text slider. Utilize Elementor, a powerful tool for easy and seamless customization.

c) Add XStore Ajax Product Tab Widget:
Once within the Elementor editor, locate the XStore Ajax Product Tab widget. Drag and drop this widget onto the desired section of your page. Subsequently, configure the settings of the Ajax Product Tab through the options available on the left sidebar. For a visual reference, please consult the relevant documentation or support resources.

For a visual reference, please consult:https://imgur.com/a/cY922uG

4) However, I’d like to inform you that the XStore Ajax Product Tab widget is designed with a predefined structure that may not support the exact customization you are seeking.

To address your requirement for left, right, or bottom placement of tabs, I recommend utilizing the XStore General Tabs feature, which allows for more comprehensive layout customization. Here’s a step-by-step guide:

Add Products to Static Blocks:
Begin by adding your desired products to static blocks. These static blocks serve as containers for organizing and presenting your product information.

Add Static Block to XStore General Tabs:
Navigate to the XStore General Tabs settings and incorporate the static block containing your products. This will enable you to structure and organize your content as needed.

For a visual reference, please consult:https://imgur.com/a/FraufO7

Best Regards,
The 8Theme Team

Hello, @GTP,

1) Yes, you can add icons beside text, like placing a TV icon next to “electronics.” Watch our tutorial https://www.veed.io/view/1f9188d6-dbf0-4f03-84f6-19f85eb0690b?sharingWidget=true&panel=share.

2) Thank you for bringing your concern regarding the Ajax product tabs to our attention. I understand that the current configuration limitations on tab placement are causing inconvenience.

Upon reviewing your query, we appreciate your suggestion to utilize general tabs and connect them with a static block as a viable solution. We concur with your assessment, and it aligns with our initial recommendations.

Implementing general tabs and integrating them with a static block not only addresses the current constraint but also provides a flexible and effective solution to customize the tab location according to your preferences.

3/ Thank you for reaching out to us with your inquiry regarding the replication of a specific section from the XStore demo.

After carefully reviewing the provided demo link and screenshot, we regret to inform you that the live copy/paste feature for XStore is currently deactivated. Unfortunately, this means that an exact copy of the section cannot be achieved through this method.

However, we understand the importance of replicating the section you’re interested in, and we are committed to assisting you in achieving a similar outcome. To guide you through the process, we have created a comprehensive video tutorial that provides step-by-step instructions on how to recreate the section based on the screenshot you shared:https://www.veed.io/view/95ddb404-d726-45de-9828-6cd7062bfdca?sharingWidget=true&panel=share

Best regards,
The 8Theme Team

Hello, @GTP,

1) Regarding the Ajax product tabs and general tabs customization:

a) Yes, you can edit the text of the tabs in the “Items” section. Simply navigate to the General Tab >> Style section, and within the “Items” area, you can easily modify the text associated with each tab.

b) To change the background color of both the content and the tab, you can also find the appropriate settings in the General Tab >> Style section. Adjust the background color according to your preference.

c) Adding icons, specifically Lottie icons, beside the text is absolutely possible. You can include these icons in the tab by customizing the settings. However, for movable icons, the implementation would depend on the specific features available in your theme or customization options.

Visual reference:
https://imgur.com/a/JqCEnxK
https://imgur.com/a/6Rn9lzx
https://imgur.com/a/0gu2n9I

2)Thank you for reaching out. To achieve the specific style you desire for the Brand carousel on your site, please follow the steps below:

a)Edit the page, post, or static block using Elementor.
b)Add the ‘XStore Brand Carousel’ element to any section within the content.
c)You can display the brand logos in this section; note that the logo colors are unchangeable as they are images. However, you can modify the hover color.
d)For the border style of the Brand Carousel, like the Demo brand carousel it is controlled by Custom CSS. To apply your preferred border style, please follow these additional steps:

e)In the Advanced section of Elementor, navigate to ‘XStore Custom CSS.’
f)Insert the provided Custom CSS for the desired border style:

selector .brands-carousel.swiper-entry .swiper-slide img  {
    filter: grayscale(100%);
    opacity: 0.5;
}
selector .brands-carousel.swiper-entry .swiper-slide:hover img {
    filter: none;
    opacity: 1 !important;
}
selector .brands-carousel .swiper-slide .categories-mask {
    border: 1px solid #e1e1e1;
    transform: skewX(-10deg);
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}
selector .brands-carousel .swiper-slide .categories-mask img {
    transform: skewX(10deg);
}
selector .brands-carousel .swiper-slide .categories-mask:hover {
    border-color: #db2d2e;
}
selector .brands-carousel .swiper-container {
    padding: 0 10px;
}

For a detailed walkthrough, we have prepared a video tutorial. Please watch it by following the link provided: https://www.veed.io/view/cf84bf52-2394-447d-9723-e77201c104eb?sharingWidget=true&panel=share .

If you have any further questions or need assistance, feel free to reach out.

Warm regards,
The 8Theme Team

Hello, @GTP,

Thank you for reaching out with your queries regarding the visual aspects of your website. We understand your concerns, and we’re here to assist you. Let’s address each point you’ve raised:

1. Font and Color Changes:
a) Certainly! We’ve created a video tutorial to guide you through the process of changing the font. You can find it: https://www.veed.io/view/b4ed49bd-6b9b-407d-b4df-312bbb5635d3?sharingWidget=true&panel=share -This visual guide should make the process seamless for you.

b) Regarding the upper tabs section’s color, we’ve examined the screenshot you provided. The space behind the words “electronics – fashion – furniture – groceries” is controlled by specific CSS rules. To modify these colors, please follow the instructions outlined in the video tutorial we’ve prepared for you.

2. We are writing to inform you that we have replaced the Lottie animated icons with static images for the import. You can access the settings via this link: https://gyazo.com/772dc60cc86f9b103cd0ebdd55ee3f64

We recommend that you upload the .json file from WordPress media and subsequently utilize it in the element settings as a Lottie Icon.

For your convenience, Lottie Icons can also be found on Google and via this link: https://iconscout.com/

3. Logo Color Adjustment:
In response to your request to display the actual logo colors when hovered over, we want to clarify that the color change is achieved through filters on the image in the provided CSS, not by changing a specific color. Unfortunately, the theme settings do not offer an option to directly alter the logo color or its hover effect.
However, if you’re looking to replicate the real colors of your logo on hover, you may need to customize the CSS further. Please be aware that this might require some coding expertise.

We hope the video tutorial helps in addressing your concerns. Should you have any further questions or need additional assistance, feel free to reach out.

Kind Regards,
8theme team

Hello, @GTP,

1)Thank you for reaching out to us with your question. Yes, you can customize the font settings in XStore through the following steps:

a)Navigate to XStore >> Theme Settings.
b)Access the Typography settings.
c)Adjust the font settings according to your preferences.

For more detailed instructions and assistance, we recommend referring to the XStore documentation on setting up custom fonts. You can find a step-by-step guide at the following link: https://xstore.helpscoutdocs.com/article/157-how-to-setup-custom-fonts-with-xstore

2)You’re welcome! If you have any more questions or need further assistance in the future, feel free to reach out. Happy searching for the perfect icons, and have a great day!

3)Thank you for bringing the issue to our attention. We understand the importance of visual aids in resolving concerns effectively. To enhance your understanding and provide clearer guidance, we have taken the initiative to create a video specifically addressing the issues you raised.

We have included a video for your visual reference to assist you with your issue: https://www.veed.io/view/defffc64-494f-49e5-a630-6ac2b01e761c?sharingWidget=true&panel=share

Kind Regards,
8theme team.

Hello, @GTP,

You’re welcome! If you have any more questions or need further assistance in the future, feel free to reach out.

Have a nice weekend!

Warm regards,
The 8Theme Team