WordPress.org

• Extending WordPress
• Plugins
• Themes
• Mobile
• Ideas
• Kvetch!

Idea: Separate CSS from Code

1. Rongo
   Member

   12345

   Each time a WordPress update is released, I have to manually edit core files to override the CCS that is forced into code output. It gets annoying rather quickly and, as a design point of view, should be in the theme's CSS file versus hardcoded as PHP output code.

   For example, wp-includes/media.php forces a defined CSS gallery styling output (i.e. $output = apply_filters('gallery_style', ") for margins, border colors, etc. Core files should focus on processing and leave the CSS styling to the actual theme file. Certainly define an "empty" gallery class in the code, but leaving the styling aspect as part of theme and not something that require a core file edit with each WordPress update.

   Posted: 3 years ago #

2. syncbox
   Member

   12345

   No offense, BUT you can avoid this issue easily... see the styles written there below your referenced code in the media.php file?

   Simply copy the style elements listed there into your style sheet and make whatever changes you want, marking the changes using !important after each property's value (where they differ, of course)

   Or, in the style.css file, prepend a containing div's ID or class, thus making the rule in the style.css file of higher specification... so, instead of:

   #gallery-1 OR #gallery-1 img (for example), use:

   body #gallery-1 or body .post #gallery-1 img

   Greater specificity or !important mean those values are used despite the "position" of the rule relative to external files (style.css or even a custom file) or embedded (typically, a plugin SHOULD write the style rules after the wp_head() function in the header.php file) or inline, as is currently being written by this media.php gallery function.

   So, you are correct -- this file SHOULD write the rule in the header on demand, not in the actual post content... but you CAN avoid it easily enough.

   I feel you on the overwriting of customizations in includes, such as this AND (for me, anyway) the quicktags.js file.

   Posted: 3 years ago #

3. Webstractions
   Member

   You can get rid of the inline styles that the Gallery Shortcode injects even easier than that, and without using !important.

   The shortcode function allows for a filter called 'gallery_style' that you can over-ride the style output with.

   In your functions.php file add the following:

   


   // Add our own filter with a higher priority than 10
   add_filter( 'gallery_style', 'my_gallery_style', 99 );
   
   function my_gallery_style() {
      return "<div class='gallery'>";
   }

   This will obliterate all of the inline styles and the comment that references the shortcode in media.php core file.

   Posted: 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.