0
Welcome Guest! Login
0 items Join Now

Tutorial - How to Add Custom CSS File

  • Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • I have found that I get my custom.css file loaded last NOT by doing the above. And, other Joomla extensions are after the custom css with the above solution. But by simply modifying the file:

      /libraries/joomla/document/html/renderer/head.php

      and adding right before the return statement the line as shown below, my custom css is always last (except for any inline css that is the only case that I need to use specificity to assert my custom css):

      $buffer .= '<link rel="stylesheet" href="/templates/rt_templatename/css/custom.css" type="text/css"/>'.$lnEnd;

      return $buffer;


      It is not an elegant solution, but my custom.css is last, right before the </head> end tag.
    • Steve Amerige, Server Science Incorporated
      Server Leasing | Web Software Development | User Experience & Graphic Design
      Managed Services, Website, Java, and Source-Code Hosting
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29362
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • you shouldn't hack the core and your css rules should not rely on loading order.
    • Peter V's Avatar
    • Peter V
    • Sr. Rocketeer
    • Posts: 137
    • Thanks: 0

    Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • I've followed everything and still my (zmycustomcss.css) is being override by the template.css, please see the image on the link for more information.

      www.mediafire.com/view/?mrq1j8fvfbf8vxl#

      Btw I'm using the latest template kirgami and everything is up-to-date, no available updates.

      Thanks
    • Behind every great web site, there's a bunch of numbers and letters.....and stuff.
  • Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • Hi Henning,
      you shouldn't hack the core and your css rules should not rely on loading order
      My solution has the advantage that I have nearly complete control of CSS via my custom.css file. The only things I might have to deal with (rarely) are inline css.

      So, I say to you: give me an alternative that does not rely on specificity or !important rules that also guarantees that my css rules are loaded last. If you can't suggest something that will get me what I need, then I will hack the core until there is a less hacky way to accomplish the same thing.

      There is no "should" or "shouldn't" about engineering. It is about problem solving and making choices. There are pros and cons about most engineering solutions. And, this solution has served me very well.
    • Steve Amerige, Server Science Incorporated
      Server Leasing | Web Software Development | User Experience & Graphic Design
      Managed Services, Website, Java, and Source-Code Hosting
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29362
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • ... use css specificity.
  • Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • I do understand that using specificity is your choice. It's not mine in my effort to workaround the Joomla shortcoming whereby one cannot place one's custom.css so that it is loaded last. Specificity is useful to know, but it is also true that:

      1. Specificity requires more work.
      2. Specificity is more complicated.
      3. With equal specificity, the latest rule wins.

      With CSS coming not just from RocketTheme, but also from other third-party extensions, I have seen many cases where updating an extension breaks existing CSS that doesn't break when custom css rules are loaded last. To write all custom CSS rules with Ultimate Specificity is just too much work and too complicated. My solution IS a hack, but it requires less work and is less complicated by far. I'll stick with it.

      Not all hacks are bad. There are many, many people who jailbreak iPhones! :)
    • Steve Amerige, Server Science Incorporated
      Server Leasing | Web Software Development | User Experience & Graphic Design
      Managed Services, Website, Java, and Source-Code Hosting
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29362
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • 1. Specificity requires more work.
      no ... and you will not loose changes with every J! update
      2. Specificity is more complicated.
      no ... and you will not loose changes with every J update
      3. with equal specificity, the latest rule wins.
      yes but harder to debug ... risk of getting issues with compression and css precompilers.
      ... gantry 4 will use LESS ... better be sure to know how to override that.

      seriously ... nobody should hack the core ... if you start hacking the core for simple things like that ... what comes next ...?

      It's OK for you perhaps but the official Rockettheme advice is: Don't hack the core: ... not the core of Joomla-framework ... Joomla-cms ... not the core of Gantry ...

      If you want to do that ... it's ok ... but for sure not a general good advice.
      Tell me what's complicated about css specificity?
  • Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • I found this. http://technosophos.com/content/php-arrays-are-not-arrays Apparently the array that loads custom.css from customcss.php is an ordered hash instead of an actual array. In order to get custom.css to display at the end the hash("array") will need to be sorted. Not sure exactly the execution but I would love to see a fix for this! It is the main issue I have been having on multiple sites running rockettheme templates. We do alot of custom CSS tweaks to every template we use and this is a MUST.
      Code Monkeys Attack(this problem)!
      Otherwise, love these templates!
    • Henning's Avatar
    • Henning
    • Preeminent Rocketeer
    • Posts: 29362
    • Thanks: 954
    • Volunteer

    Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • suggest that to Joomla not to us ... :-)
  • Re: Tutorial - How to Add Custom CSS File

    Posted 11 years 8 months ago
    • How is this done in Wordpress

Time to create page: 0.080 seconds