Jump to content


Photo
- - - - -

How can i override dynamic.css from a .css file?


  • Please log in to reply
24 replies to this topic

#1 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 06:17 AM

WordPress version 3.1.2 Theme: PlatformPro version: 1.3.2 Custom Child Theme. Summary of Problems: Making site narrower than 800 pixels (like 763). Making columns arbitrary widths (like the main content column 583). Dynamic.css gets loaded after base.css, so base.css cannot override dynamic.css items. @import directive in Custom CSS rules (in dynamic.css) won??™t import a .css file. Background: I want to make a site 763 pixels wide, with the main content area 583 and the single right sidebar 180. I cannot set the site that narrow in the Layout editor Also, I cannot set the content area to 583 (yes, to 582 or 584, but not 583). If I attempt to override such things in base.css, they don't have an effect, because dynamic.css is loaded after style.css (which loads base.css). I can add a bunch of style rules to the CSS Rules of the Custom Code in PlatformPro Settings, but that means having to maintain THOSE styles separately from the version control of my other .css and markup. I tried using an @import directive in those custom rules, to import a .css of mine to do final style changes, but the @import statement in dynamic.css doesn??™t load my file for reasons I cannot figure out. Questions: 1. Is there a hook that gets executed after dynamic.css gets loaded, where I can call a function to link my ???final??? .css file? 2. Is there a known reason why an apparently valid @import directive in dynamic.css won??™t work? 3. If neither of the above can provide a solution, what do other people do in a custom child theme to override settings in dynamic.css using a version-controlled custom .css file(s)?

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 01 May 2011 - 03:34 PM

Have you already tried adding the CSS to the base.css file? This file overrides other CSS, including dynamic.css.

#3 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 09:24 PM

Yes, i did try putting what I wanted to do in base.css. Unfortunately, as I mentioned above, dynamic.css actually gets loaded after base.css. if you look at the source of a generated page, you will find that the load order of .css is: 1. pro.css 2. style.css (in the child theme, which in turn loads 3. base.css) 4. dynamic.css So style rules in dynamic.css come AFTER base.css

#4 Simon_P

Simon_P

    Messer

  • Administrators
  • 8388607 posts
  • LocationDevon
  • Framework Version:2.0
  • Country: Country Flag

Posted 01 May 2011 - 09:27 PM

Put your new rules into the custom css box in the main settings, they get added to the bottom of dynamic.css and such is actually loaded last.

#5 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 09:31 PM

That works, but as I mentioned above it doesn't solve the problem of readily maintaining those style rules in version control with the rest of the .css files, nor of being able to deliver changes to the site via simply delivering a new collection of files via ftp. Instead it requires mixing that with manually uploading new rules via the custom rules area, the doing of which is prone to human error or omission.

#6 Simon_P

Simon_P

    Messer

  • Administrators
  • 8388607 posts
  • LocationDevon
  • Framework Version:2.0
  • Country: Country Flag

Posted 01 May 2011 - 09:51 PM

ok in that case add an action to your base functions file, like: ` add_action('wp_print_styles', 'add_my_stylesheet'); function add_my_stylesheet(){ wp_enqueue_style('my_styles', get_stylesheet_directory_uri() . '/my_style.css', 999 ); } `

#7 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 10:50 PM

add_action of wp_enqueue_stylesheet at the 'wp_print_styles' hook point still writes the stylesheet link statement before where the link to dynamic.css is written.

#8 Simon_P

Simon_P

    Messer

  • Administrators
  • 8388607 posts
  • LocationDevon
  • Framework Version:2.0
  • Country: Country Flag

Posted 01 May 2011 - 10:56 PM

Use `wp_head` then maybe? You will have to print your stylesheet info directly because it will be too late to use enqueue..

#9 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 11:11 PM

I found this in themes/platformpro/core/library/actions.site.php: ` /** * Do dynamic CSS last in the wp_head stack * * @since 4.0.0 */ add_action('wp_head', 'do_dynamic_css'); ` I used Simon's proposed code, but changed the hookpoint from wp_print_styles to wp_head, and the good news is that my add_action is getting called after the one in the platform, so my "final custom css" file is now loaded after the dynamic.css file. Thanks, all! Karma goes to Simon...

#10 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 01 May 2011 - 11:15 PM

Simon, Thanks for all the help. 1. are you still surprised that it worked with enqueue when i hooked it at wp_head? it seems to work fine. If you still advise me to do so, I could change the action to write it directly. Thoughts? 2. What is the 999 in your proposed code? That third parameter is documented as an optional array of dependencies

#11 Simon_P

Simon_P

    Messer

  • Administrators
  • 8388607 posts
  • LocationDevon
  • Framework Version:2.0
  • Country: Country Flag

Posted 01 May 2011 - 11:34 PM

Im not supprised, enqueue_styles gets fired by wordpress during wp_head. ;) The third param is the priority default for all actions is 10 so by making it 999, it gets called very late. `` Glad you got it sorted!

#12 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 02 May 2011 - 12:07 AM

Thanks. But in your example, 999 isn't the third param of add_action, it is the 3rd parameter of wp_enqueue_style. Should i leave it there, or delete the 3rd param?

#13 Simon_P

Simon_P

    Messer

  • Administrators
  • 8388607 posts
  • LocationDevon
  • Framework Version:2.0
  • Country: Country Flag

Posted 02 May 2011 - 12:12 AM

Ahh right, see what you mean there ;) Yes its a typo alright! Sorry about that Should have been: ` add_action('wp_print_styles', 'add_my_stylesheet', 999); function add_my_stylesheet(){ wp_enqueue_style('my_styles', get_stylesheet_directory_uri() . '/my_style.css' ); } `

#14 mhelenek

mhelenek

    Newbie

  • Members
  • Pip
  • 8 posts
  • Country: Country Flag

Posted 02 May 2011 - 12:26 AM

and to make the custom "final" my_style.css get listed *after* dynamic.css, it would be: ` add_action('wp_head', 'add_my_stylesheet', 999); function add_my_stylesheet(){ wp_enqueue_style('my_styles', get_stylesheet_directory_uri() . '/my_style.css' ); } `

#15 sheloha

sheloha

    Newbie

  • Members
  • Pip
  • 6 posts

Posted 27 May 2011 - 06:16 AM

This is exactly what I need to do however I cannot get the function to call my css file. Just to check I am doing this correctly the add_action is placed in my platformbase functions.php the my_style.css is in the same directory as functions.php any help with this is appreciated

#16 [Deleted User]

[Deleted User]

    Super Member

  • Members
  • PipPipPipPip
  • 183 posts

Posted 27 May 2011 - 07:44 AM

Tried this: ` add_action('wp_print_styles', 'add_my_stylesheet', 999); function add_my_stylesheet(){ wp_enqueue_style('my_styles', STYLESHEETPATH . '/my_style.css' ); } ` That works.... my_styles resides in /platformbase/ (where I like it to be), but it gets inserted way to early... 'wp_head' hook does not seem to work... Regards, Jackey

#17 [Deleted User]

[Deleted User]

    Super Member

  • Members
  • PipPipPipPip
  • 183 posts

Posted 27 May 2011 - 08:04 PM

@Guy Shelton Hi Guy, Did you get this add_my_stylesheet function to actually work? Regards, Jackey

#18 sheloha

sheloha

    Newbie

  • Members
  • Pip
  • 6 posts

Posted 28 May 2011 - 01:48 AM

Unfortunately not. I have been keeping an eye on this thread hoping someone can help. I'm guessing you didn't have any luck?

#19 [Deleted User]

[Deleted User]

    Super Member

  • Members
  • PipPipPipPip
  • 183 posts

Posted 28 May 2011 - 07:50 AM

The wp_print_styles hook works perfect, but as I said, it injects the file way to early. I don't know why the wp_head hook does not work, it is probably out of scope. I really prefer a override.css file instead of the style.css (to early, can't override plugin css or dynamic.css) or custom css (to clumsy editor).. That way I can make the modifications online through FTP with BBEdit/Transmit, fast and easy. Also noticed that when I replace platformpro with a newer version, all kind of settings get lost. Must be because the dynamic.css file is overwritten. I'm surprised that that file does not reside in the platformbase directory. Even more easyer if pagelines Added a line of code that insterted a THEMEBASE . base.css if it exists just before the </head>.

#20 [Deleted User]

[Deleted User]

    Super Member

  • Members
  • PipPipPipPip
  • 183 posts

Posted 01 June 2011 - 07:57 PM

O.K. this works! ` add_action('wp_head', 'add_my_stylesheet' , 999 ); function add_my_stylesheet(){ ?>