blog documentation FAQ followers forum marketplace services youtube

CSS and Stylesheets

The Jamroom Network » Forum » Design and Skin Customization » Page » CSS and Stylesheets
Rich (SP)
Rich (SP)
@rich-sp
10 years ago
8 posts
I was wondering if there is a place to put all custom css in one place in the backend?

I would imagine its natural home would be in the /core/skin_admin/style/skin=blahblah section but it's not there. I found the following article which suggests that the only way to do this is by uploading a custom style sheet and calling it last in the meta file ...

https://www.jamroom.net/the-jamroom-network/forum/suggestions/10868/customcss

Thanks
SP
updated by @rich-sp: 02/14/15 02:12:30PM
douglas
@douglas
10 years ago
2,804 posts
You can adjust the site CSS in the ACP > Skins > Styles tab and for the profile pages you can adjust the CSS for the module, which is in the same section, just use the drop down selection to find the CSS file you want to modify.

If your going to be making a few modifications to the skin, you may want to consider cloning your skin first.

https://www.jamroom.net/the-jamroom-network/documentation/skins/839/creating-your-own-skin

Hope this helps! :)


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos
Rich (SP)
Rich (SP)
@rich-sp
10 years ago
8 posts
Hi
Yes, I found this already. But my question really was is there one overall stylesheet that I can add my own css to without using this rather restrictive drop menu option for each area of the site?
For example, if you create a child theme in WordPress you would have various php templates etc and one style.css for custom css across the whole site that you can access in the WP admin area.
Thanks
SP
brian
@brian
10 years ago
10,149 posts
Rich (SP):
Hi
Yes, I found this already. But my question really was is there one overall stylesheet that I can add my own css to without using this rather restrictive drop menu option for each area of the site?
For example, if you create a child theme in WordPress you would have various php templates etc and one style.css for custom css across the whole site that you can access in the WP admin area.
Thanks
SP

In Jamroom the main CSS is really the product of a bunch of smaller CSS files that have been processed and grouped together.

If you want to add custom CSS classes, you can add them to the following file:

skins/YourCustomSkinDir/css/skin.css

and they will be added to the overall CSS after a cache reset.

Hope this helps!


--
Brian Johnson
Founder and Lead Developer - Jamroom
https://www.jamroom.net
Rich (SP)
Rich (SP)
@rich-sp
10 years ago
8 posts
OK, that helps, thank you.
Just to clarify, there is no where in the JR backend where this file is accessible?
I can live with ftp uploads and external editing but some users (i'm thinking less techy Ning refugees) are going to find this hard.
Thanks again
SP
brian
@brian
10 years ago
10,149 posts
Rich (SP):
OK, that helps, thank you.
Just to clarify, there is no where in the JR backend where this file is accessible?
I can live with ftp uploads and external editing but some users (i'm thinking less techy Ning refugees) are going to find this hard.

ALL the CSS classes are available in the ACP -> Skins -> (Select Skin) -> Style section where you can manually edit each class.

There is currently no way to upload or modify files directly within the ACP, so that's how you would have to go about modifying the style.

Let me know if that helps.

Thanks!


--
Brian Johnson
Founder and Lead Developer - Jamroom
https://www.jamroom.net
michael
@michael
10 years ago
7,797 posts
Quote: ...OK, that helps, thank you.
Just to clarify, there is no where in the JR backend where this file is accessible?
I can live with ftp uploads and external editing but some users (i'm thinking less techy Ning refugees) are going to find this hard...
The skin designer can make stuff available to less techy users by adding tags to their style sheet.

eg: In the jrElastic site.css file:
/skins/jrElastic/css/site.css
You will see doc block style headers:
/* @title Site Wrapper */
/* @help This is the wrapper for the Site Content */
#wrapper {
    margin:0 auto; /* @ignore */
    padding-top:72px; /* @ignore */
    background-color:#EEEEEE;
    padding-bottom: 12px;
}
Because those headers are there, then the admin user will be able to edit them in the STYLE tab of the skin.

The @help text will show as help. the @title will be the title. @ignore stuff will be ignored.
(screenshot)
So the designer can help out the non-techy users. All the CSS is available in the UNTAGGED tab even if the skin designer has not used that functionality.
updated by @michael: 01/13/15 05:53:35PM

Tags