Format of product tabs

Yes, you can do that with simple CSS. Just spread the UL to the full width and float the tabs with some width attached to them. Then style as you want.

Thank you very much for that – however, you’re assuming I know how to do what you’re suggesting, which I’m afraid I don’t!
I’m ignorant of all things coding, & need plugins or snippets to do anything like that; it just seemed odd that so many screenshots showed them in that format that I assumed it was the default, or at least an option that could be chosen.
But thanks again – maybe I should be asking in the Storefront forum?

• This reply was modified 7 years, 1 month ago by petebm.

Please post the url to a relevant page.

Sorry – it’s not supposed to be public – but this is what the tabs looks like at present – https://imgur.com/a/htlRA; hope that’ll do

Thanks

Here is simple css to make them horizontal, the way you saw it: https://gist.github.com/vanbo/c05e9b9512bd53e3680c82e1c6e4e6a3

But please understand that saying that you are creating a store, want to modify it and need help, then saying that you are ignorant of all things coding, kinda doesn’t help you cause. It’s like saying, just do everything for me, I don’t want to learn.

Thank you.

I appreciate your comments, but can I just say in my defence that I am a volunteer helping the old car club he belongs to try to set up an online shop for spares; my main qualification for the job (apart from a passing knowledge of IT) is that I stuck my hand up when no-one else did. Maybe I shouldn’t have. I have tried to do everything using the options built into the software, and my question about the product tabs was based on the fact that I’ve seen so many instances of them arranged horizontally that I assumed it must be a standard option that I had missed somewhere along the line.

Having said all that – I hope it doesn’t sound too self-pitying – I’m not sure I can now point out that when I add your code I get an error in line 1 ‘syntax error, unexpected ‘.’‘. I’ve tried changing it various ways, but just get different errors.

Pete

You should add the code to the theme style.css file, possibly at the bottom.

Thank you – that does indeed do the job – though I’ve had to ignore the instruction ‘do not edit this file’!

So are all the images I’ve seen of horizontal tabs either own css amendments or different themes? I thought they were standard Storefront.

• This reply was modified 7 years, 1 month ago by petebm.

Well, you should really use a child theme as you will loss the css on update, plus you can modify things without worrying when it comes time to update the theme.

Different themes prefer the tabs structured in different ways.

OK, thanks again – I’ve started reading up on child themes, & will create one when I know what I’m doing; until now I’ve used code snippets, which is what I was trying to do when I got the error message with your modification.

Hi,

We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.