Tabs on product page is too hidden

Entrada WP Theme
#1

Hi,

I have been getting a lot of feedback from people that are not aware of the tabs (overview, review etc.) on the single product page.

Is there any way to make it stand out to that the visitors discover the tabs?

#2

Hello Christian,

The tabs are designed to be out of the main view on tour detail pages. We do not have other layouts designed for tour detail pages but you can add your custom CSS and customize the layout to make it above fold, for example, adding the CSS below. Ofcourse you may need to customize CSS further depending on how you want to make it less / more obvious.

.tab-container {
top: -200px;
}

Thank you

#3

I did this on the modern theme. Using Woocommerce Bookings, this will pull the tabs above the “Book Now” button as well as create 200px worth of empty space between the content and the next block.

#4

Whey I say “above,” I mean that it covers the button completely.

#5

Hello Mitch,

We saw your tickets relating to this and glad you have resolved this. However, please let me try to explain further.

There is always a FIXED screen real estate on any device while viewing the page. So, when you add the calendar, you should avoid adding descriptions / short descriptions and other informations on the above fold area and only show title / prices etc and use the “Overview” tabs for those extra information. There are multiple options, like you can also show the compact version of WC Bookings calendar as opposed to the full calendar, if you want to show much of the textual information.

Hope that clarifies it for you.

Thank you

#6

Hi Sanjeev,

I understand the constraints and agree that the desktop layout is a challenge. Your original booking theme containing the “Review Block” is great at giving the user valuable data visually making it obvious that more verbose details will follow below.

Using Entrada out-of-the-box, with woocommerce bookings calendar expanded pushes the bottom of the booking form below the image slider.

I’ve successfully turned your “Review Block” code into a custom function and used hooks to insert it where I like it. When I’m done I’ll share on the appropriate thread.

On mobile, the natural flow is much better. Thanks for your help.