0
Welcome Guest! Login
0 items Join Now

Tutorial - How to Add Custom CSS File

    • hotscotch's Avatar
    • hotscotch
    • Jr. Rocketeer
    • Posts: 39
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • Henning wrote:
      no wonder ... you have css compression on. Disable that to see the file ...
      Hi Henning,

      Thanks for you quick response! I'm not seeing that option under the Panacea Template. Do you know where else it might be?

      -scott
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29361
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • RokGZipper-plugin ... disable that.
    • hotscotch's Avatar
    • hotscotch
    • Jr. Rocketeer
    • Posts: 39
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • hotscotch wrote:
      Henning wrote:
      no wonder ... you have css compression on. Disable that to see the file ...
      Hi Henning,

      Thanks for you quick response! I'm not seeing that option under the Panacea Template. Do you know where else it might be?

      -scott
      Ok.. I found it. It's under the ADVANCED TAB and called GANTRY ZIPPER. :)

      I'll give it another try and see if I make any progress in changing the main body background.

      -scott :D
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29361
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • I can see it now :-)
      The the Gantry GZipper woud have been my next guess ...

      Use compression only when your site is 100% done ...
    • hotscotch's Avatar
    • hotscotch
    • Jr. Rocketeer
    • Posts: 39
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • Henning wrote:
      I can see it now :-)
      The the Gantry GZipper woud have been my next guess ...

      Use compression only when your site is 100% done ...
      I really like the Gantry system and am slowly getting used to it.

      I'm trying to change the #rt-body-bg2 (since there lies the #FFFFFF color) and have added the following code to the mycustomstyles.css:

      #rt-body-bg2 {background-image: url(..templates/rt-panacea/images/body/light/main_panel_01.png) no-repeat !important;}

      Nothing is happening.

      I also tried adding changing the syntax to:

      div#rt-body-bg2 {background-image: url(..templates/rt-panacea/images/body/light/main_panel_01.png) no-repeat !important;}

      Still nothing. This color is declared in the template as part of the Panacea Style Tab. Won't the mycustomstyles.css override it?

      -s
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29361
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • hotscotch's Avatar
    • hotscotch
    • Jr. Rocketeer
    • Posts: 39
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29361
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • hotscotch's Avatar
    • hotscotch
    • Jr. Rocketeer
    • Posts: 39
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 2 months ago
    • Thank you!

      Using Firebug, I wound up copying a whole block of code rather than just the #div and pasted it into mycustomstyles.css. I had to use an absolute path for the image, change some items to !important and it popped in.

      After this project is done I might even try to add a new Style Feature to the template's GUI, which would be really cool and make it a lot easier to make background changes.

      At least the hard part is done and I can now color some menu li and make the content more attractive.

      Thanks again for your help!

      Best,
      Scott
    • Dan Walker's Avatar
    • Dan Walker
    • Elite Rocketeer
    • Posts: 502
    • Thanks: 14
    • Designer/Developer

    Re: Tutorial - How to Add Custom CSS File

    Posted 8 years 1 month ago
    • One difficulty with this approach is that with the code, mycustomstyle.css is loaded before template.css, so if the selector is the same, template.css will override mycustomstyle.css. The solution is to replace the addstyle code in the mycustomstyle.php file with the following code:
      $gantry->addStyles(array('template.css','mycustomstyle.css'));
      It would be nice to add this as an integral feature of gantry and make sure that mycustomstyle.css is loaded last of all stylesheets.
    • Dan Walker - Web Designer & Developer @ Top Webs Network
      Custom Joomla & Wordpress Websites

Time to create page: 0.151 seconds