In the K2 plugin the code looks if in the Joomla Template css folder is a k2.css if not use the k2.css of com_k2

Line 69 of K2.php System Plugin :

if(JFile::exists(JPATH_SITE.DS.'templates'.DS.$mainframe->getTemplate().DS.'css'.DS.'k2.css'))
$document->addStyleSheet(JURI::root().'templates/'.$mainframe->getTemplate().'/css/k2.css');
else
$document->addStyleSheet(JURI::root().'components/com_k2/css/k2.css');

I need one css for every k2 template i have.

Olivier Nolbert posted a solution in this thread

But with this solution bothe css - k2 Standard and the modified is loaded.

Is it possible to merge both codes to get the right code ?

If no template is set = Use K2.css
If %template% is set = use %template%.css

I think this is a very important point.
If we are able to provide addition K2 micro themes with a view to being to style parts of a site as blog/magazine/community etc, then we need to have control of the CSS.

It makes no sense to that the micro theme has to share the the global css.

I second the the vote to add this as a feature.

You are right there is no reason to load many css files, bur I must repeat.
If you dont have a css for every template you are limited in design your subtemplate.
just a small example:
If I want to have a big Heading in Template A and a small in Template B I have to set a new class in one of them.
If K2 would ask which template is loaded and use the specified CSS the designer always can copy the template.php's and just have to edit the specified.css

There is a lot of "but's" in my mind regarding this as I am struggling a little with this already.

First of all -

We are already able to turn off the K2.css through a setting. But this rarely produce any desired effects as the template you are using almost certainly do not have styling for every part of K2. So you are left with a broken site that needs to be styled all over again.

In an ideal world, all template designers would jump for joy and make the suggested overrides. BUT - as the new overrides prohibits the normal K2.css from working, will we not get into the same trouble if they forget to add something or just leaves it out on purpose?

Here is what I would like to see:

A new configuration setting that turns off the part of the K2.css that is most likely covered by the main template. This would include all standard settings like H1, H2 and other font parameters etc. Let the normal template.css take care of this with just a checkmark in a setting. It already exist there, so why should I need to do anything else to get it to work?

I am not sure how this could be done, maybe by using two css files for K2 - K2basic.css and K2ext.css and then be able to not load K2basic.css.

My struggle right now is to use as much as possible of the styling from the main template to get K2 totally integrated while keeping the styling of the unique K2 features from the K2.css file. And doing it in such a way that these changes are intact when I upgrade K2 or the site template.

Not an easy task...

And I totally agree with Simon in that this is an important point. I think every effort should be made to make K2 as easy as possible to integrate.

JoomlaWorks said:First of all, even if we have a dozen sub-templates used in K2, we can still have 1 global K2 css file (or our joomla template CSS file). There is no reason to load many CSS files to cover the styling of multiple K2 sub-templates.
That is why I'm using strict CSS "specificity", so you can make a new menu item fetching K2 with a sub-template and you can give it a "page class suffix" to override or style differently that particular content. This is very clear and it's not subject to any changes.

Regarding CSS overrides in v2.2 (coming soon)...
What we've done in 2.2 is provide the ability to template designers to directly override K2's CSS without telling the user to go into K2's parameters and switching the K2 CSS off. The only thing template designers have to do is include 3 additional CSS files in their template's /css folder: k2.css, k2_ie6.css and k2_ie7.css
If they include these 3 files, then K2 will pick them up and ignore its default CSS files. If they don't exist, it will just include the default CSS files.

Hi,

I've made a k2 plugin that detects the use of a specific k2 template for a category and loads it. It's possible to disable the k2 generic css in the plugin settings.

No need to modify the k2 system plugin anymore.

Hope it will help Troponin and will not hurt Fotis :-)

Olivier Nolbert
www.jiliko.net

Hi Olivier,

I will test this at K2Joom.com and post an item for it.

Olivier Nolbert said:Hi,
I've made a k2 plugin that detects the use of a specific k2 template for a category and loads it. It's possible to disable the k2 generic css in the plugin settings.

No need to modify the k2 system plugin anymore.

Hope it will help Troponin and will not hurt Fotis :-)

Olivier Nolbert
www.jiliko.net

Hi Oliver, I have done a review of your plugin, great work.
I notice that although styling changes per item in the category that has a template set, the items listed with in the category do not change.
My review contains example items and categories.
Finally, I have also setup a download section and added the plugin to it.

@Fotis, I would like to offer the manage the storage K2 downloads at K2Joom if you wish.


Simon Wells said:Hi Olivier,
I will test this at K2Joom.com and post an item for it.

Olivier Nolbert said:Hi, I've made a k2 plugin that detects the use of a specific k2 template for a category and loads it. It's possible to disable the k2 generic css in the plugin settings.

No need to modify the k2 system plugin anymore.

Hope it will help Troponin and will not hurt Fotis :-)

Olivier Nolbert
www.jiliko.net

Hi Olivier,

n1 work - this is exactly what I needed.
I wrote you an email - it is exactly what Simon says (Simon says,...;) ) Is it possible to load the custom css in the items in the category ?

I agree, if your are selecting a template for a category, then lets get that category styled too the same and not just the item.
There are still elements that use the default Joomla template which need to be over ridden.

Troponin said:Hi Olivier,
n1 work - this is exactly what I needed.
I wrote you an email - it is exactly what Simon says (Simon says,...;) ) Is it possible to load the custom css in the items in the category ?

@Troponin

I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used.

that's why, in the main category view, the k2 generic template is used without a specific one loaded.

When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.

@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

Hi Olivier,
The demo i have at k2joom, is set up as follows.
Main Category (K2Joom Dev), No Theme. No Inherit
Sub Category (K2 Theming), No Theme. No Inherit
Sub Sub Category 1 (CSS Style 1 Category (1) ), Theme 1. No Inherit (this is a css modified and renamed copy of the standard k2_style.css)
Sub Sub Category 2 (CSS Style 2 Category (1) ), Theme 2. No Inherit (this is a renamed copy of the standard k2_style.css)

I have 1 item in each of the Sub Sub Cats
When the items are displayed in Sub Category, 2 leading, 2 columns, they both look the same, this I expect as no theme is set for this sub category and, it figures it can not mix between the themes selected in the sub sub cat.

When item 1 is seen in its parent category, Sub Sub Category 1 it looks the same as item 2 in its parent category Sub Sub Category 2. In my opinion, these should look different as Sub Sub Category 1 is using a modified css file.

The difference is only seen when looking at the items in full.

I am still looking at overrides, but a lot seem to related to the Joomla template and not K2 template, such as H1, H2.

Olivier Nolbert said:@Troponin I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used.
that's why, in the main category view, the k2 generic template is used without a specific one loaded.

When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.

@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

To confirm this point a bit more, I am creating a new downloads area.

I created a Downloads Category and 4 Sub Categories all of these categories are using a new K2download_style.css which resides inside templates/ja_purity_ii/html/com_k2/templates/K2download

I wanted the sub categories to appear similar to the parent category.

The category image looks like:
div.itemListCategory img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}

The Sub Cat image had no style:
div.subCategory a.subCategoryImage img {}

so i copied the style content in to the sub cat but it does apply it
I made a change to the category.php that is inside this theme i using, to check and see that it is being called up.
I added and this is dispalyed in the sub cat list in the category so I know that the files for the theme is working, but just not looking at the css.

UPDATE: I just added:
div.subCategory a.subCategoryImage img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}
to components/com_k2/css/style.css, result, no change.
to /components/com_k2/css/k2.css, then sub cat image layout changes.

Any ideas?

Simon Wells said:Hi Olivier, The demo i have at k2joom, is set up as follows. Main Category (K2Joom Dev), No Theme. No Inherit
Sub Category (K2 Theming), No Theme. No Inherit
Sub Sub Category 1 (CSS Style 1 Category (1) ), Theme 1. No Inherit (this is a css modified and renamed copy of the standard k2_style.css)
Sub Sub Category 2 (CSS Style 2 Category (1) ), Theme 2. No Inherit (this is a renamed copy of the standard k2_style.css)

I have 1 item in each of the Sub Sub Cats
When the items are displayed in Sub Category, 2 leading, 2 columns, they both look the same, this I expect as no theme is set for this sub category and, it figures it can not mix between the themes selected in the sub sub cat.

When item 1 is seen in its parent category, Sub Sub Category 1 it looks the same as item 2 in its parent category Sub Sub Category 2. In my opinion, these should look different as Sub Sub Category 1 is using a modified css file.

The difference is only seen when looking at the items in full.

I am still looking at overrides, but a lot seem to related to the Joomla template and not K2 template, such as H1, H2.

Olivier Nolbert said:@Troponin I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used. that's why, in the main category view, the k2 generic template is used without a specific one loaded.
When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.

@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

Hi Simon,

I check that and make a feedback.

Olivier

Simon Wells said:To confirm this point a bit more, ... UPDATE: I just added:
div.subCategory a.subCategoryImage img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}
to components/com_k2/css/style.css, result, no change.
to /components/com_k2/css/k2.css, then sub cat image layout changes.

Any ideas?



Correct me if i'm wrong:

I thought the custom should be placed in %Joomlatemplate%/html/com_k2/templates/%k2template%/%k2template%_style.css

@Troponin : You're right, the specific css must be placed in 'templates/JOOMLATEMPLATE/html/com_k2/templates/K2TEMPLATE/' and must be called 'K2TEMPLATE_style.css' where :

JOOMLATEMPLATE is the folder of the joomla template used
K2TEMPLATE is the folder of the k2 sub-template used by the category.

Olivier

Troponin said:Simon Wells said:To confirm this point a bit more, ... UPDATE: I just added: div.subCategory a.subCategoryImage img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}
to components/com_k2/css/style.css, result, no change.
to /components/com_k2/css/k2.css, then sub cat image layout changes.

Any ideas?



Correct me if i'm wrong:

I thought the custom should be placed in %Joomlatemplate%/html/com_k2/templates/%k2template%/%k2template%_style.css

Hi Simon,

The items look the same in their category view because the css in the 2 css sub-template css files are the same (at least for the article title element : div.catItemHeader h3.catItemTitle)

If you check the head of the document in each category view, you'll see that k2.css file is loaded and after it, the k2 sub-template css file, so it should work.

Olivier

Simon Wells said:Hi Olivier, The demo i have at k2joom, is set up as follows.
Main Category (K2Joom Dev), No Theme. No Inherit
Sub Category (K2 Theming), No Theme. No Inherit
Sub Sub Category 1 (CSS Style 1 Category (1) ), Theme 1. No Inherit (this is a css modified and renamed copy of the standard k2_style.css)
Sub Sub Category 2 (CSS Style 2 Category (1) ), Theme 2. No Inherit (this is a renamed copy of the standard k2_style.css)

I have 1 item in each of the Sub Sub Cats
When the items are displayed in Sub Category, 2 leading, 2 columns, they both look the same, this I expect as no theme is set for this sub category and, it figures it can not mix between the themes selected in the sub sub cat.

When item 1 is seen in its parent category, Sub Sub Category 1 it looks the same as item 2 in its parent category Sub Sub Category 2. In my opinion, these should look different as Sub Sub Category 1 is using a modified css file.

The difference is only seen when looking at the items in full.

I am still looking at overrides, but a lot seem to related to the Joomla template and not K2 template, such as H1, H2.

Olivier Nolbert said:@Troponin I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used. that's why, in the main category view, the k2 generic template is used without a specific one loaded.

When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.

@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

Simon,

Do you have a link for these categories i can check ?

Olivier

Simon Wells said:To confirm this point a bit more, I am creating a new downloads area.
I created a Downloads Category and 4 Sub Categories all of these categories are using a new K2download_style.css which resides inside templates/ja_purity_ii/html/com_k2/templates/K2download

I wanted the sub categories to appear similar to the parent category.

The category image looks like:
div.itemListCategory img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}

The Sub Cat image had no style:
div.subCategory a.subCategoryImage img {}

so i copied the style content in to the sub cat but it does apply it
I made a change to the category.php that is inside this theme i using, to check and see that it is being called up.
I added and this is dispalyed in the sub cat list in the category so I know that the files for the theme is working, but just not looking at the css.

UPDATE: I just added:
div.subCategory a.subCategoryImage img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}
to components/com_k2/css/style.css, result, no change.
to /components/com_k2/css/k2.css, then sub cat image layout changes.

Any ideas?

Simon Wells said:Hi Olivier, The demo i have at k2joom, is set up as follows. Main Category (K2Joom Dev), No Theme. No Inherit Sub Category (K2 Theming), No Theme. No Inherit
Sub Sub Category 1 (CSS Style 1 Category (1) ), Theme 1. No Inherit (this is a css modified and renamed copy of the standard k2_style.css)
Sub Sub Category 2 (CSS Style 2 Category (1) ), Theme 2. No Inherit (this is a renamed copy of the standard k2_style.css)

I have 1 item in each of the Sub Sub Cats
When the items are displayed in Sub Category, 2 leading, 2 columns, they both look the same, this I expect as no theme is set for this sub category and, it figures it can not mix between the themes selected in the sub sub cat.

When item 1 is seen in its parent category, Sub Sub Category 1 it looks the same as item 2 in its parent category Sub Sub Category 2. In my opinion, these should look different as Sub Sub Category 1 is using a modified css file.

The difference is only seen when looking at the items in full.

I am still looking at overrides, but a lot seem to related to the Joomla template and not K2 template, such as H1, H2.

Olivier Nolbert said:@Troponin I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used. that's why, in the main category view, the k2 generic template is used without a specific one loaded. When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.

@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

Category Tutorials under Templatename "standard" - k2.css is loaded (standard_style.css should ?)
Item View in the Tutorials Categoy - standard_style.css is loaded (works)
Subcat Showcase under Templatename "modify" - k2.css is loaded (modify_style.css should ?)
Item in subcat "Showcase" - modify_style.css is loaded (also the template files -> you see there is no text (deleted in template modify))


Olivier Nolbert said:Simon,
Do you have a link for these categories i can check ?

Olivier

Simon Wells said:To confirm this point a bit more, I am creating a new downloads area. I created a Downloads Category and 4 Sub Categories all of these categories are using a new K2download_style.css which resides inside templates/ja_purity_ii/html/com_k2/templates/K2download

I wanted the sub categories to appear similar to the parent category.

The category image looks like:
div.itemListCategory img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}

The Sub Cat image had no style:
div.subCategory a.subCategoryImage img {}

so i copied the style content in to the sub cat but it does apply it
I made a change to the category.php that is inside this theme i using, to check and see that it is being called up.
I added and this is dispalyed in the sub cat list in the category so I know that the files for the theme is working, but just not looking at the css.

UPDATE: I just added:
div.subCategory a.subCategoryImage img {float:left;display:block;background:#fff;padding:4px;border:1px solid #ddd;margin:0 8px 0 0;}
to components/com_k2/css/style.css, result, no change.
to /components/com_k2/css/k2.css, then sub cat image layout changes.

Any ideas?

Simon Wells said:Hi Olivier, The demo i have at k2joom, is set up as follows. Main Category (K2Joom Dev), No Theme. No Inherit Sub Category (K2 Theming), No Theme. No Inherit Sub Sub Category 1 (CSS Style 1 Category (1) ), Theme 1. No Inherit (this is a css modified and renamed copy of the standard k2_style.css)
Sub Sub Category 2 (CSS Style 2 Category (1) ), Theme 2. No Inherit (this is a renamed copy of the standard k2_style.css)

I have 1 item in each of the Sub Sub Cats
When the items are displayed in Sub Category, 2 leading, 2 columns, they both look the same, this I expect as no theme is set for this sub category and, it figures it can not mix between the themes selected in the sub sub cat.

When item 1 is seen in its parent category, Sub Sub Category 1 it looks the same as item 2 in its parent category Sub Sub Category 2. In my opinion, these should look different as Sub Sub Category 1 is using a modified css file.

The difference is only seen when looking at the items in full.

I am still looking at overrides, but a lot seem to related to the Joomla template and not K2 template, such as H1, H2.

Olivier Nolbert said:@Troponin I wrote you an email too. When You're in the main category view (view=itemlist&layout=category), you can have subcategories displayed and many featured items from different categories. Without testing, all the css files from all the categories and items k2 subtemplates would be loaded and the last one would be used. that's why, in the main category view, the k2 generic template is used without a specific one loaded. When you're in a sub-category (view=itemlist) with a template affected, the job is done for the category and for the items.
@simon

Could you telle me which elements need to be over ridden ?

Thx for the review on k2joom.com

Olivier

@troponin

could you send me the real joomla link for the category tutorials page (not the sef one) ?

The last 2 links return a 403 error

Olivier