Container customization

Forums    Joomla Templates Club    JA Brisk    Container customization
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • gribblej Friend
    July 11, 2013 at 5:39 pm #188876

    Very cool design but I want to pimp it a little more. Where in the new T3 can I install a background container image (instead of just changing the color)? This is something Joomlart has done with several demos. The documentation gives some hints but doesn’t speak directly to this common need. It would help to know the location of the core T3 CSS sheet containing all the div names. Still getting used to all the differences with the new responsive layout system.
    Thanks,
    -JG

    Saguaros Moderator
    July 12, 2013 at 8:49 am #498822

    Hi JG,

    Thanks for your kind words for this template. Basically, if you want to customize this template, with css, it’s recommended to add into ‘/templates/ja_template/css/custom.css’ file

    To add a background image, if you use an editor like Firebug, you can see the <body> tag and simply add:


    body {
    background: url("/ja_brisk/templates/ja_brisk/images/body_bg.jpg");
    }

    into custom.css file <change above image path to your own>

    Regards

    gribblej Friend
    July 12, 2013 at 3:49 pm #498861

    Thanks, this confirms what I thought was the answer. The “custom” file overrides all other style sheets. Now, however, let’s say I want to apply the background image just to the homepage. This used to be fairly simple to do by applying a theme to my “home” click and then customizing the css there. Is that still possible? If so how? Corporate customers really want this cabability so that the homepage is totally unique and focused on corporate image.
    Also, I do use Firebug but would still like to know the name and location of the file with all the core div tags. This used to be located in the T3 plugin files and was called template.css. Does it still exist or has everything changed because of Bootsrap/LESS?
    -JG

    Saguaros Moderator
    July 15, 2013 at 3:40 am #498980

    Hi

    <blockquote>This used to be fairly simple to do by applying a theme to my “home” click and then customizing the css there. Is that still possible?</blockquote>
    << Yes, it’s possible, you can create another theme (or use existing theme) > edit it and assign to home page.

    Pls check out this documentation page of our T3 framework for more info: http://t3-framework.org/documentation/customization.html#custom-css

    gribblej Friend
    July 15, 2013 at 6:48 pm #499092

    Thanks. I already had read through the documentation. And I already applied different themes to the homepage and the inside pages. I renamed these for my convenience. When the changes were saved, it seems to have generated two new stylesheets in the “T3 Assets” folder. Are they what I should be working on? It appears so, based on my front-end edits with Firebug. Just wonder whether my work will be lost because of “compile to LESS.”
    Am I right that this new system is very different from the old one, in which you simply went into the theme folder and then edited “template.css”?
    -JG

    gribblej Friend
    July 16, 2013 at 2:18 am #499114

    Update: When I did my editing in the template.css file in the theme folder, it worked. Except, when I compiled to LESS I found that all changes were lost and the css reverted to default. This was a bummer because I needed to give my logo extra width and height. Those custom params got lost along with the link to the logo image. To restore them was easy but I’d like to understand why it happened to begin with. If I can’t compile to LESS, won’t that cripple the responsive layout?
    Please give more detailed instructions on how to style themes and apply them to pages selectively in order to create distinct site sections. This was pretty easy with the old T3, but now it appears to be a lot more involved. Which I do accept because this new layout is mobile-responsive. I realize I’m more ambitious than a lot of users in that I want complete control of customization at the stylesheet level.
    Thanks again,
    -JG

    pb66 Friend
    July 16, 2013 at 2:27 am #499115

    As Saguaros said you need to put your customisations in the custom.css file then they won’t get overwritten when you do an update.

    To solve your compiling problem you should modify the .less files – this should be easier as you only have to make changes once then it will write all these values to the css files for you.

    Regards,

    gribblej Friend
    July 16, 2013 at 2:48 am #499117

    Thanks, I understand about the custom.css file. All well and good. But those changes will propagate throughout the site. Recently I did a project which combined four sites into one, which required the creation of related but distinct sections. No problem, because this was Joomla 2.59. For finer control of that nature, you seem to be pointing me at the LESS files. Does each theme have a corresponding LESS file, and where do I find it? I gather that LESS has replaced the old T3 core with its default template.css file from which all the themes cascaded..
    Thanks a bunch.
    -JG

    Saguaros Moderator
    July 16, 2013 at 3:36 am #499124

    Hi

    Yes, our new T3 is built like the way of Less & Bootstrap and it’s so different from the old one.

    When you compile Less to Css, all rule defined in Less file will be generated to css file so that your changes in css file will be lost. If you are not familiar with Less, I recommend you to change in css

    Another thread discussing about the benefit of Less: http://www.joomlart.com/forums/topic/which-one-is-better-for-customization/#post-498727

    You can tell me more details of how you want to achieve: how you want to change? which theme you’re using? I will try to check for you.

    gribblej Friend
    July 16, 2013 at 3:57 am #499127

    I want to use this site to learn about LESS and regain my status as a T3 ninja. It’s imperative, because with Joomla 3 we’ve turned a big corner in basic website design. I now understand that everything flows from LESS; in many ways like everything used to flow from the T3 CSS core.
    Let’s say I have a theme called Inside-Pages. And I applied it to all pages except Home. I want it to have a completely different header and maybe a different body background color also. I used to know exactly where that stylesheet was located. Where will I find the LESS file for “Inside-Pages.” Will it be one of the big long stylesheets I see in the T3 Assets folder? That’s what Firebug seems to be telling me. Or should I be looking somewhere else?
    -JG

    gribblej Friend
    July 17, 2013 at 8:01 pm #499343

    Using the custom.css file does work great! You can see the results here. http://belong-membersites.com/ But, I hope I can still get some guidance about how to apply individualized styling to themes in such a way that they don’t get wiped out when I turn on Compile to LESS.
    -JG

    gribblej Friend
    July 17, 2013 at 8:18 pm #499347

    I did notice one puzzling difference in the rendering of the page in Explorer versus Chrome. IE picks up a white background behind the menu titles. I believe this is inherited from the body styling. In that div I kept the color as white. Chrome, however, does not see it. The only background behind the menu titles is the custom header background image. Either way it looks fine to me; in fact I kind of like the Chrome version better. But is there a way to resolve the inconsistency?
    -JG

    1. header-in-Explorer
    2. header-in-Chrome
    Saguaros Moderator
    July 24, 2013 at 8:39 am #500002

    Hi

    I tried to open your site in both Chrome and IE10 and it looks the same like the 2nd attached image.

    If you want to make change in Less file, you can go to individual theme folder in template folder: templatesja_your_default_templatelessthemesgreen, make your desired changes and then when you compile Less to Css, the equivalent css files will be generated with associated less file: templatesja_your_default_templatecssthemesgreen

    This is a good reference to learn about LESS

    Hope it makes senses.

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)

This topic contains 13 replies, has 3 voices, and was last updated by  Saguaros 11 years, 4 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories