Return to previous page

Using Tabs on X-Store and how to customize them

This topic has 6 replies, 2 voices, and was last updated 1 years ago ago by Tony Rodriguez

GTP

Participant

December 12, 2023 at 05:39

Hello 8theme team,

We understand that X-Store was built for ecommerce websites, but we have been using it for our other websites as well such as the ones which provide a service.

We are in need of tabs and came across the page on elements;

https://xstore.8theme.com/elementor/demos/minimal-fashion02/general-tabs-element/

1) Are these the basic tabs which come with X-Store?

2) If we want to “join” these tabs onto an element or section such as the one seen on the PCA, is that possible?

3) Can we edit the information that appears on the tabs (General tabs elements) via Elementor? Editing blocks/section on Elementor lets us edit the blocks/sections with more customization versus the standard text editor.

4) Can we add things such as filters on the tabs?

Thanks for your help!

Please, contact administrator
for this information.

#376357 Copied Theme version: 9.2.5

5 Answers

Tony Rodriguez

Support staff

December 13, 2023 at 12:04

Hello, @GTP,

Thank you for using our theme and for contacting us.

1 & 2) Yes, you have the flexibility to add the “General Tab” to any page. Simply edit the page using Elementor and incorporate the “XStore General Tab” widget. Place it anywhere on the page according to your preference. In the Content section >> General, you can configure the layout and style of the tabs.

3) Certainly! You can customize the information within the tabs to suit your needs. Under Content >> Items, you can modify tab details, such as title and content type, to align with your preferences.
For a visual reference, please consult the image provided at the following link: https://imgur.com/a/sRngOTV

2) Absolutely! To achieve this, start by navigating to the WordPress dashboard >> Static Block. Create a Static Block (using Elementor) and integrate any XStore filter you desire or add anything that you want to display on the Tabs. Update the Static Block and then proceed to Tabs >> Content >> Items. Select the content type as “Static Block” and choose the one you created.
For a visual reference, please consult the image provided at the following link: https://imgur.com/a/JrDaMqE

These steps should allow you to effectively manage and customize the tabs as per your requirements. If you encounter any challenges or have further questions, please feel free to reach out for assistance.

Best Regards,
Team 8Theme

#376526 Copied

GTP

Participant

December 13, 2023 at 13:54

Hi Tony,

Hope you are doing well and thanks for your response.

1) Thanks for confirming that these are the basic tabs.

2) We are trying to make the tabs appear/become something similar to as seen on the websites we have added on the PCA.

Would this be possible with the tabs provided via Elementor/X-Store or would we need a 3rd party plugin/option OR/AND customization/Custom CSS?

3) Thank you! Might have misinterpreted the first time;

When we go on/click the tabs we can edit them and the content with a basic text editor, which just allows us to enter “plain” text.

We are wondering that if we can edit the content section using the actual Elementor builder. For example if we want to build the layout of a page, we can use elementor.

Is it possible to use the Elementor builder (which has the X-Store elements/live copy) on the tab content, or can we only use the basic Text editor to input information (text) etc.?

For example; https://imgur.com/a/sRngOTV

Second image on the screenshot page, Under the tab content – is that the only way to edit/add the details we want?

4) Thanks for the screenshot!

And for example, if we wanted more custom and advance filters, would it be possible via the Elementor tabs? Or would we need something more customized developed/plugin/CSS to achieve this?

Like something similar to the website on the PCA.
The filters look very advanced and have tons of choices etc.

And in regards to the screenshot of the filters you shared, is that for the products on the website? And can we have it for something else other than products? Not sure where to find the filters section or how to add/edit them on the X-Store theme. Can you please share a screenshot for this?

5) Just some advise from your side; If we need more custom tabs and the functions they provide, would it be best to find a 3rd party plugin/ask this on the customization services panel?

Thanks for your help!

Please contact administrator
for this information.

#376548 Copied

Tony Rodriguez

Support staff

December 14, 2023 at 11:55

Hello, @GTP,

1)
You’re welcome, glad to confirm the tabs for you.

2)
A)In XStore, the available tab styles are limited to 1 to 7 in horizontal orientation. Unfortunately, the specific tab designs you’re looking for aren’t available. We recommend exploring the existing styles within XStore, and we’re unable to suggest additional plugins or custom CSS for your request. We apologize for any inconvenience.

B)Yes, you can achieve this by following these steps:

a)Edit the desired page using Elementor.
b)Add a new container to the page.
c)In the container settings, navigate to Style and set the background color as per your preference.
d)Add the XStore General Tab widget to the container.
e)Customize the widget’s style settings to align with your design preferences.
f)In the Advanced section, go to Layout and adjust the Bottom Padding as desired.
g)You also have the flexibility to edit the overall layout of the container to suit your needs.
For a visual reference, please consult the image provided at the following link:
https://imgur.com/a/PtKWheo
https://imgur.com/a/sl0rHvz

These steps should enable you to create a visually appealing page with the specified background color and layout adjustments.

3)
Thank you for your question and clarification. I understand now that you are seeking to use the Elementor builder for more advanced customization within the tab content.
If you observe that the Content Type “content” seems to be more straightforward, please note that there is no separate way to edit the content. For more advanced customization, consider using the Content Type “Template” or “Static Block.” This allows for a more intricate and tailored design using Elementor.

4)
XStore offers a comprehensive range of built-in filters for diverse customization needs. Before considering additional plugins or custom CSS, explore the extensive options within XStore’s Elementor tabs.
In the Elementor search bar, enter the element query, such as ‘filters,’ to access a comprehensive list that includes options from both XStore and the default set. Choose the filter that suits your needs and easily implement it by dragging and dropping it into your design
For a visual reference, please consult the image provided at the following link:
https://imgur.com/a/pNh7AwJ

5)
Yes, exploring third-party plugins is a viable option for additional custom tabs and functions. However, it’s important to note that we primarily provide customer service and are responsible for recommending theme-supported plugins.

Best Regards,
Team 8Theme

#376653 Copied

GTP

Participant

December 15, 2023 at 07:43

Hi Tony,

Thanks for your reply!

2 a) No problem, thanks for confirming – we will see what we can do with plugins/getting customization from the customization panel.

b) Thank you for the detailed steps!

3) Yes, using the Elementor builder always allows for more customization versus the standard text editors.

Just wondering if we can use “TEMPLATES” / “STATIC BLOCKS” on the tabs?

4) Thanks for pointing that out Tony. I think that most or all filters are just for products at the moment. We will see what we can do and try to implement that.

5) Thanks for confirming and providing your input 🙂
We see lots of plugins and methods and will try using those when needed.

Appreciate the help on this topic Tony.
We were able to clear many things related to Tabs and have a clear way going forward. ??

If we need any help with Tabs on X-Store we will come back on this thread for help.

#376738 Copied

Tony Rodriguez

Support staff

December 15, 2023 at 12:16

Hello, @GTP,

2,a) We would like to emphasize the importance of adhering to the plugins specified in our documentation. We urge you to exercise caution when considering the use of third-party plugins that have not been endorsed by us. For your reference, we have provided detailed documentation on the plugins that accompany the XStore theme, which can be found at: https://www.8theme.com/documentation/xstore/plugins/included-plugins/

2,b) You are most welcome! Should you have any additional inquiries or require further support, please do not hesitate to contact us. Our team is at your service and ready to assist.

3) Indeed, utilizing the Elementor builder offers an extensive array of customization possibilities, which greatly exceed those of standard text editors. As previously communicated, you have the ability to employ “TEMPLATES” and “STATIC BLOCKS” within the tabs to suit your specific needs.

For a visual guide, kindly refer to the image available at the following URL:
https://imgur.com/a/AzjcoAq

4) It is a pleasure to learn of your interest in exploring product filters, and we commend your initiative towards their implementation.

5) We are delighted to know that you found the provided information valuable and that it has offered you clear guidance for managing Tabs on X-Store. Please feel free to revisit this conversation or contact us should you have any further questions or require additional assistance in the future.

Best Regards,
Team 8Theme

#376763 Copied
Tagged: customizing x-store, using tabs woocommerce, woocommerce templates, woocommerce x-store customization, wordpress x-store guide, x-store tabs, x-store woocommerce tutorial
Viewing 6 results - 1 through 6 (of 6 total)