Home › Forums › WoodMart support forum › SIZE GUIDE OR TABS

SIZE GUIDE OR TABS

Viewing 18 posts - 1 through 18 (of 18 total)
  • Author
    Posts
  • February 18, 2021 at 3:21 pm #267635

    Mandinga
    Participant

    Hello, I have a problem, see if you can help me.

    I want to use the size guide in a product tab and not as a popup, can I get a short code of the size guide that I have created? or use it as a block?

    Now I have pasted a table that I made myself in a custom tap, but it is not responsive, it looks good on the desktop but the scroll bar that is generated in the size guide in the mobile version does not appear.

    What solution can I have?

    I am attaching screenshots.

    Thanks.

    Attachments:
    You must be logged in to view attached files.
    February 18, 2021 at 11:12 pm #267726

    Elise Noromit
    Member

    Hello,

    Each product page has the option of the Additional tab: https://xtemos.com/docs/woodmart/product-page-options/#local_settings

    You can create an HTML block with a Size Guide element and add into this tab: https://xtemos.com/docs/woodmart/html-blocks-2/#custom_tab

    If you have any questions please feel free to contact us.

    Best Regards

    February 18, 2021 at 11:51 pm #267744

    Mandinga
    Participant

    I already know that, I also have a plugin that allows me to add and remove all the tabs I want …

    I don’t know how to convert a size guide into an html block, could you explain that to me please?

    Now I have copied the size guide and pasted it as html and it works very well for me on desktop, but it does not adapt on mobile, a scroll bar is not generated as the size guide does on mobile … I attach a screenshot, if you can convert to block the size guide problem solved, but I don’t know how to do it …

    Attachments:
    You must be logged in to view attached files.
    February 19, 2021 at 2:21 pm #267877

    Elise Noromit
    Member

    Hello,

    The size guide is created by means of the table in HTML structure. Tables are not responsive by their nature. Please provide a page URL that will provide CSS to add the scroll.

    Best Regards

    February 19, 2021 at 3:59 pm #267892

    Mandinga
    Participant

    http://www.tiendaspiscina.com.mialias.net/producto/piscina-elevada-playa/

    The table is inside the tab “MODELOS Y DIMENSIONES)

    The mobile behavior of the size guide, which is also on this page is perfect, what a pity that the size guide cannot be set as a block …

    PS: this code will also work for all the tables that I put in the other products?

    February 19, 2021 at 11:25 pm #267960

    Elise Noromit
    Member

    Hello,

    I cannot view your site https://prnt.sc/101dad5

    You can do the same with all the products, you can insert one and the same table or create different for different products.

    Best Regards

    February 19, 2021 at 11:58 pm #267974

    Mandinga
    Participant
    February 20, 2021 at 8:40 pm #268095

    Elise Noromit
    Member

    Hello,

    I still cannot view the product. Please provide the credentials to the product.

    Best Regards

    February 20, 2021 at 9:30 pm #268102

    Mandinga
    Participant

    I don’t understand, it’s the link I gave you before, don’t you see it in the conversation? # 267892

    Remember that I will have to have a table on all products.
    Will I have to do it one by one?

    February 21, 2021 at 2:35 pm #268163

    Elise Noromit
    Member

    Hello,

    When I click the link I see this https://gyazo.com/70ce5a45c5050b906e209a7e5afeef56

    The credentials you provided are not valid.

    Best Regards

    February 21, 2021 at 5:43 pm #268199

    Mandinga
    Participant

    I have already passed the keys to you for private content (# 267974) please follow the thread of the conversation. I’ll pass you all over again for private content, the test platform key and the wordpress key …

    February 22, 2021 at 12:00 am #268246

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body .woodmart-sizeguide-table{
min-width:740px;
overflow-x:auto;
}

    You will get this result on mobile: https://gyazo.com/4e21801ada9e5c218e26d7555daf84b0

    Best Regards

    February 22, 2021 at 8:12 pm #268490

    Mandinga
    Participant

    I think that you have not understand me…

    That function already comes by default in the template, did you not know it?

    Inside the MODELS AND DIMENSIONS tab is where I need the content to be scrolled only on the mobile.

    I attach a new screenshot to you.

    Thanks.

    Attachments:
    You must be logged in to view attached files.
    February 23, 2021 at 11:13 am #268644

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Mobile:

    .tabs-layout-accordion .woodmart-tab-wrapper .wc-tab {
    overflow: scroll;
}

    Best Regards

    February 24, 2021 at 7:24 pm #269033

    Mandinga
    Participant

    Sorry, but now I just saw that the scroll bar is generated on the entire page, not only on the models and dimensions tab.
    Attachment screenshot…

    Attachments:
    You must be logged in to view attached files.
    February 25, 2021 at 7:49 am #269133

    Bogdan Donovan
    Keymaster

    Hi,

    Please, remove previous custom code and then try to add the following code snippet to the Mobile Custom CSS area in Theme Settings.

    .tabs-layout-accordion .woocommerce-Tabs-panel--modelos-y-dimensiones {
	overflow-y: hidden;
}

    Regards

    February 25, 2021 at 11:08 am #269189

    Mandinga
    Participant

    Yes now, thank you!

    February 25, 2021 at 2:09 pm #269259

    Elise Noromit
    Member

    You are welcome! If you have any questions please feel free to contact us.

    Best Regards

  • Author
    Posts

Tagged: 

Viewing 18 posts - 1 through 18 (of 18 total)