- Posts: 2
COMMUNITY FORUM
Template override css file not loading
- SandSol
-
Topic Author
- Offline
- New Member
Less
More
8 years 11 months ago #143710
by SandSol
Template override css file not loading was created by SandSol
Hi,
I am sorry if this question was posted before, but I really can't find any answer to my question. I am fearly new to website management so maybe it is just some detail I don't know about.
I installed K2 on my website, but I want to change the default k2 stylesheet. I followed the instructions to create a sub-template by copying the "default" folder and register.php, profile.php, generic_search.php and generic.php files into a templates/geotop/html/com_k2 folder: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#3 (geotop is the name of my template)
I then made a copy of the default folder and renamed it "chercheurs". Inside this folder, I created a chercheurs.css file to create a new stylesheet: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#0
The "chercheurs" layout is now available in my k2 layout menu when I modify a category: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#2
The css file however is not loading, only the k2.css stylesheet appears in the head of my source code: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#1 (on line 15)
I just don't understand what I am doing wrong.
Thank you for your help,
Sandrine
I am sorry if this question was posted before, but I really can't find any answer to my question. I am fearly new to website management so maybe it is just some detail I don't know about.
I installed K2 on my website, but I want to change the default k2 stylesheet. I followed the instructions to create a sub-template by copying the "default" folder and register.php, profile.php, generic_search.php and generic.php files into a templates/geotop/html/com_k2 folder: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#3 (geotop is the name of my template)
I then made a copy of the default folder and renamed it "chercheurs". Inside this folder, I created a chercheurs.css file to create a new stylesheet: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#0
The "chercheurs" layout is now available in my k2 layout menu when I modify a category: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#2
The css file however is not loading, only the k2.css stylesheet appears in the head of my source code: imgur.com/jYQRpGM,wO5bGVu,bvHmCFi,hhb0cCb#1 (on line 15)
I just don't understand what I am doing wrong.
Thank you for your help,
Sandrine
Please Log in or Create an account to join the conversation.
- Franz Wohlkönig
-
- Offline
- Platinum Member
Less
More
- Posts: 529
8 years 11 months ago #143713
by Franz Wohlkönig
Replied by Franz Wohlkönig on topic Template override css file not loading
Hi,
rename css-File in chercheurs_style.css. Theres also Videos which helped me starting on Overrides: getk2.org/documentation/k2class2012/865-k2-template-and-overrides.
Regards
rename css-File in chercheurs_style.css. Theres also Videos which helped me starting on Overrides: getk2.org/documentation/k2class2012/865-k2-template-and-overrides.
Regards
Please Log in or Create an account to join the conversation.
- Joe Campbell
-
- Offline
- Platinum Member
Less
More
- Posts: 438
8 years 11 months ago - 8 years 11 months ago #143716
by Joe Campbell
Replied by Joe Campbell on topic Template override css file not loading
Hi SandSol,
1) Add and activate the template override for the desired category.
2) Modify the class names for each element you want styled different for the category. For example you can append the category name to the end of the class (div.itemHeader h2.itemTitleBlog). Your template override CSS file would then only need to be comprised of these CSS styles unique to this category. Make sure you change the class name for both the template override file (e.g. item, category, tag) and the CSS file.
3) Add the following code to each template override file that would require it (e.g. item.php, category_item.php, tag.php)
<?php $doc->addCustomTag('<link rel="stylesheet" href="/templates/TEMPLATE-NAME/html/com_k2/OVERRIDE-FOLDER-NAME/CSS-FILENAME.css" type="text/css" />'); ?>
Place the code after...
How the code works: it adds the CSS link to the page <head> for the file (you specified) located in the template override path (you provided).
This solution was inspired by:
y-designs.com/support/tutorials/how-to-inject-css-prior-to-the-css4k2-system.html#comment-1539215230
I hope this helps,
Joe Campbell
1) Add and activate the template override for the desired category.
2) Modify the class names for each element you want styled different for the category. For example you can append the category name to the end of the class (div.itemHeader h2.itemTitleBlog). Your template override CSS file would then only need to be comprised of these CSS styles unique to this category. Make sure you change the class name for both the template override file (e.g. item, category, tag) and the CSS file.
3) Add the following code to each template override file that would require it (e.g. item.php, category_item.php, tag.php)
<?php $doc->addCustomTag('<link rel="stylesheet" href="/templates/TEMPLATE-NAME/html/com_k2/OVERRIDE-FOLDER-NAME/CSS-FILENAME.css" type="text/css" />'); ?>
Place the code after...
defined('_JEXEC') or die;
?>How the code works: it adds the CSS link to the page <head> for the file (you specified) located in the template override path (you provided).
This solution was inspired by:
y-designs.com/support/tutorials/how-to-inject-css-prior-to-the-css4k2-system.html#comment-1539215230
I hope this helps,
Joe Campbell
Last edit: 8 years 11 months ago by Joe Campbell.
Please Log in or Create an account to join the conversation.
- Krikor Boghossian
-
- Offline
- Platinum Member
Less
More
- Posts: 15920
8 years 11 months ago #143733
by Krikor Boghossian
JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)
Replied by Krikor Boghossian on topic Template override css file not loading
No need to rename the file.
Simply copy the k2.css file in your template's css folder.
Simply copy the k2.css file in your template's css folder.
JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)
Please Log in or Create an account to join the conversation.
- SandSol
-
- Offline
- New Member
Less
More
- Posts: 2
8 years 11 months ago #143751
by SandSol
Replied by SandSol on topic Template override css file not loading
Hi everyone,
I copied the k2.css and chercheurs.css files in my template's css folder, but they still weren't loading. Then I realized that the original website developper had created a .css file that imports and loads all the other css files in the folder, so I just added 2 lines of code to import k2.css and chercheurs.css as well. It works perfectly now.
Thank you all so much for your help, and thank you Joe for your detailed explanation, I might not have used it today but it definitely helps me understand better how k2 works.
I copied the k2.css and chercheurs.css files in my template's css folder, but they still weren't loading. Then I realized that the original website developper had created a .css file that imports and loads all the other css files in the folder, so I just added 2 lines of code to import k2.css and chercheurs.css as well. It works perfectly now.
Thank you all so much for your help, and thank you Joe for your detailed explanation, I might not have used it today but it definitely helps me understand better how k2 works.
Please Log in or Create an account to join the conversation.
- Krikor Boghossian
-
- Offline
- Platinum Member
Less
More
- Posts: 15920
8 years 11 months ago #143756
by Krikor Boghossian
JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)
Replied by Krikor Boghossian on topic Template override css file not loading
You 're welcome SandSol.
JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)
Please Log in or Create an account to join the conversation.