Custom CSS and JS
The Custom CSS and JS plugin allows you to add stylesheets and JavaScript to any individual post by adding custom fields. Both CSS and JavaScript can be either internal or external. Since this is a plugin, the custom CSS and JavaScript are available to any theme used to display the post.
Installation
- Unpack the download package.
- Upload folder include all files to the “/wp-content/plugins/” directory
- Activate the plugin through the “Plugins” menu in WordPress
Using the Plugin
To use the plugin, add any combination of the following custom fields to your post.Custom Fields
- custom_css
- Add an external stylesheet by adding a custom field with the name custom_css. The value of the field should be the path to your css file.
- custom_css_code
- Add an internal stylesheet by adding a custom field with the name custom_css_code. Include your CSS code as the value. (Do not include the
styletags.) - custom_js
- Add an external JavaScript by adding a custom field with the name custom_js. The value of the field should be the path to your script.
- custom_js_code
- Add an internal JavaScript by adding a custom field with the name custom_js_code. Include your JavaScript code as the value. (Do not include the
scripttags.)
Order
The external styles and scripts are included before the internal ones. If you include multiple entries for a given field, the entries will be included in order.Okay, but what if I don’t like those tags?
Just editcustom-css-js.php and change the constants defined near the top of the file.
Thank you. Working perfectly.
Great plugin. I was looking for something like this all day. It is very useful.
Thank you
~ Tom
I don’t understand how to use this plugin. Where can I fina an example on how to do.
I’m stuck at “Add an external stylesheet with the key as the src.”
Can you give me an example of how I would do that? what does “with the key as the src” mean?
AshDigital, sorry for the delay, and thanks for pointing out my atrocious directions. I updated the instructions on the page to something that should make more sense now. What I had there before must have been a copy/paste goof or something.
Say you want to include the file /my-style.css
What you’d want to do is make add a custom field to your post. Use “custom_css” for the field’s name and “/my-style.css” for the value.
Hope that makes more sense!
I’ve been trying to edit the background of a table with this but i can’t figure it out. The site is stueartandstueartlawfirm.com the table is the one at the bottom of each page. with office listings. I’ve tried adding
.wp-table-reloaded-id-5 .row-1 td {
background-color: #FF0000!important;
} to this new plugin but the site overrides it. Do i have to post something on another page first?
Debbie, If the table is on every page of the site, you’re probably better off editing the stylesheets for the theme. This plugin is more for if you need styles or JavaScript for just one specific post. Hope that helps!
I really love the custom_css_code part, it make me very easy to make a demo in the articles to explain css.
Thansk a lot!
Any chance of an example. So i upload a custom css file? and then i link it to my post somehow?
man i’m stupid. field is an option in the post. sheesh. maybe a screenshot will filter the noob questions. sorry my fault.
Thank you very much for your extension, which is exactly
what I’ve been looking for for days :D. Works perfectly on
3.0.3.
Great plugin! The only thing that bugged me is that it only
worked on individual posts and single pages. My blog is set to show
the latest post on the homepage, so I needed to make a tweak to see
this… …and I did, and I love it. :D If anyone else has their
WordPress set to show only the latest article on the homepage, and
want to see their custom css for that post on the homepage, simply
edit the plugin where the code says…
if (is_single() or…and change it to…is_page())
ifWorked great(is_single() or is_page() or is_home())
for my site! Thanks!!
how to use it…a simple example can kill many problem……..
How to add this plugin function to my theme (functions.php)?
The idea with this plugin is that you can add a stylesheet or javascript to a specific post. If you want to add a stylesheet or javascript to your theme, you’re better off just modifying the theme.
Unfortunately, this plug-in doesn’t work in case of multi-site (WordPress ver. 3.2.1).
Plug-in works well only in the parent site, although doesn’t in child sites.
Thank you in future.
i realy don’t know how to use it…
wish you could show some example to us! that may lead much help.