custom zebra striping in tables

**GK User** Fri Apr 26, 2013 1:15 am Reply with quote Report this post

How do I enable auto striping in tables? I thought this template uses bootstrap, but when I use a standard boostrap class like

Code: Select all: class="table table-striped"

Nothing happens. I've also noticed that most of the base CSS classes provided in bootstrap do not work. Why does it not work because this template is supposed to be based on bootstrap?

I need to build some nice looking tables fast.

Any help would be greatly appreciated.

Thanks.
Andrew

**teitbite** Fri Apr 26, 2013 8:17 am Reply with quote Report this post

Hi

Our templates are not supporting bootstrap yet. At least I cannot find an information that it does anywhere. Can You please tell me where have You find such information so I'll know what to tell programmers.

**GK User** Wed May 01, 2013 10:17 pm Reply with quote Report this post

Here it is...

Meet Gavern is based upon a brand new version of the Gavern Framework which features built-in support for Bootstrap.

Meet Gavern is a free template which is available also on the Github repository. If you will need any help - please feel free to ask on the Github issues section for our help.

Currently the Meet Gavern template contains the most important features necessary for the proper work with Joomla! 3.0. We will implement constantly new features, also the ones suggested by our users.

Please remember that Joomla! 3.0 is recommended only for the early adopters and we can include big changes in the Meet Gavern template in the future. We have a lot of ideas and we also need your feedback - it will really help us in the template development.

**teitbite** Thu May 02, 2013 12:47 pm Reply with quote Report this post

Hi

Ok. But this information is about Meet Gavern and not StoreBox. Or did You just post Your question in a wrong forum by accident ?

**GK User** Thu May 02, 2013 4:01 pm Reply with quote Report this post

Well it says the and I quote "Gavern Framework which features built-in support for Bootstrap." Don't all the new templates use the new Gavern framework ?

**teitbite** Sat May 04, 2013 11:46 am Reply with quote Report this post

Hi

I'm going to ask programmers about this.

**teitbite** Sat May 04, 2013 3:06 pm Reply with quote Report this post

Yes meet gavern use bootstrap but other J!3.0 templates not, just jQuery library. Bootstrap library is not included to avoid loading unnecessary JS and styles.

So as I thought. It's only included in Meet Gavern, that's why it's mentioned only in it's description.

**GK User** Tue May 21, 2013 8:44 pm Reply with quote Report this post

teitbite wrote:
Yes meet gavern use bootstrap but other J!3.0 templates not, just jQuery library. Bootstrap library is not included to avoid loading unnecessary JS and styles.

So as I thought. It's only included in Meet Gavern, that's why it's mentioned only in it's description.

OK thanks. Since it doesn't support zebra striping natively, I would like to use my own code.

How do I use my own javascript and css for creating responsive tables?

The existing code in the template doesn't work very well for for 5 column tables when viewed on the iPhone or a mobile device.
http://www.digital-control.com/gavick/i ... s/f-series

I'd like to use the custom code and css like in this example:
http://www.digital-control.com/gavick/footable/

You will notice that preselected columns are collapsed when viewed on a phone or tablet.

Thanks in advanced.

Andrew

**teitbite** Wed May 22, 2013 10:26 pm Reply with quote Report this post

Hi

I would upload javascript and css file to template's /js and /css folders than add this files to website by adding the code to load this files directly inside <head></head>, to do this use file /layout/blocks/head.php . Add the code under the current content.

**GK User** Tue Jun 04, 2013 2:53 am Reply with quote Report this post

teitbite wrote:Hi

I would upload javascript and css file to template's /js and /css folders than add this files to website by adding the code to load this files directly inside <head></head>, to do this use file /layout/blocks/head.php . Add the code under the current content.

Thank you for the suggestion. I have followed your advice and put the code in the recommended location.
However, it (http://digital-control.com/gavick/index ... s/f-series) still doesn't work properly like it does on this page: http://www.digital-control.com/gavick/footable/

I would really appreciate it if you could point out to me which css template is overriding the override, and what I need to do to make the responsive table work in the template.

Thanks in advance.
Andrew

**teitbite** Tue Jun 04, 2013 9:13 pm Reply with quote Report this post

Hi

Only responsive styles are loaded after override.css

Code: Select all: <link media="(max-width: 1200px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.desktop.css" rel="stylesheet"> <link media="(max-width: 1030px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/tablet.css" rel="stylesheet"> <link media="(max-width: 820px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.tablet.css" rel="stylesheet"> <link media="(max-width: 580px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/mobile.css" rel="stylesheet">

and couple of "in code" styles from modules.

Table cannot be turn responsive. That's a really old technology

I think all You can do is to reduce paddings in <th> and <td> to make it smaller and hopefully fit to mobile than.

Just put this to mobile.css:

Code: Select all: th, td { padding: 0; }

**GK User** Tue Jun 04, 2013 9:38 pm Reply with quote Report this post

Hi,

The table technology I'm using is responsive. Please see this:

http://www.digital-control.com/gavick/footable/

It is from the footable project.
http://themergency.com/footable/

Thanks for the response.
AW

teitbite wrote:Hi

Only responsive styles are loaded after override.css

Code: Select all
<link media="(max-width: 1200px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.desktop.css" rel="stylesheet"> <link media="(max-width: 1030px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/tablet.css" rel="stylesheet"> <link media="(max-width: 820px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.tablet.css" rel="stylesheet"> <link media="(max-width: 580px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/mobile.css" rel="stylesheet">

and couple of "in code" styles from modules.

Table cannot be turn responsive. That's a really old technology I think all You can do is to reduce paddings in <th> and <td> to make it smaller and hopefully fit to mobile than.

Just put this to mobile.css:

Code: Select all
th, td { padding: 0; }

**GK User** Tue Jun 04, 2013 10:18 pm Reply with quote Report this post

It seems to me the footable.js script isn't being used or something.

AW

andru wrote:Hi,

The table technology I'm using is responsive. Please see this:

http://www.digital-control.com/gavick/footable/

It is from the footable project.
http://themergency.com/footable/

Thanks for the response.
AW

teitbite wrote:Hi

Only responsive styles are loaded after override.css

Code: Select all
<link media="(max-width: 1200px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.desktop.css" rel="stylesheet"> <link media="(max-width: 1030px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/tablet.css" rel="stylesheet"> <link media="(max-width: 820px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/small.tablet.css" rel="stylesheet"> <link media="(max-width: 580px)" href="http://digital-control.com/gavick/templates/gk_storebox/css/mobile.css" rel="stylesheet">

and couple of "in code" styles from modules.

Table cannot be turn responsive. That's a really old technology I think all You can do is to reduce paddings in <th> and <td> to make it smaller and hopefully fit to mobile than.

Just put this to mobile.css:

Code: Select all
th, td { padding: 0; }

**teitbite** Tue Jun 04, 2013 10:50 pm Reply with quote Report this post

Hi

I can see that footable.js file is loaded and there is no conflicts visible in console with that so I'm afraid You need to ask FooTable developers for checking that.

**GK User** Wed Jun 05, 2013 12:23 am Reply with quote Report this post

Hi,

Thank you for trying.

I give up. I'm on a very tight deadline. I have to stop fighting this issue, and just live with the built-in stylesheet for now.

On another note, how do I assign K2 items or joomla articles to tabs in GKTabs 5? I used to be able to do that in GKTabs 2. Now in GKTabs 5 you can only assign modules. Is there some other way that is not explained in the documentation to link articles or K2 items to the tabs?

Thanks in advance,
Andrew

teitbite wrote:Hi

I can see that footable.js file is loaded and there is no conflicts visible in console with that so I'm afraid You need to ask FooTable developers for checking that.

**teitbite** Wed Jun 05, 2013 10:19 pm Reply with quote Report this post

Hi

With GK5 Tabs You can only assign modules but when You use for example NSP GK4 You can show an article inside it.

**GK User** Wed Jun 05, 2013 11:10 pm Reply with quote Report this post

Thanks for the info, so you're saying that the tabs component has lost some functionality during its transition into a module? And as I understand it, you are recommending NSP GK4 instead to replicate the tabbed article functionality?

Thanks in advance.

AW

teitbite wrote:Hi

With GK5 Tabs You can only assign modules but when You use for example NSP GK4 You can show an article inside it.

**teitbite** Wed Jun 05, 2013 11:37 pm Reply with quote Report this post

Hi

Exactly. NSP module is the one which is designed to show articles and has many options for that. So putting the same functionality into Tabs module is simply unnecessary duplication, since You can use any module You like.

**GK User** Thu Jun 20, 2013 9:47 pm Reply with quote Report this post

Thank you for the help.

teitbite wrote:Hi

Exactly. NSP module is the one which is designed to show articles and has many options for that. So putting the same functionality into Tabs module is simply unnecessary duplication, since You can use any module You like.

**teitbite** Fri Jun 21, 2013 8:45 pm Reply with quote Report this post

Hi

I'm glad I could help