It’s been a couple of months now that I’ve tried to find answers or instruction on how to install items like: ToolTips, buttons, sliders, tables using CSS (sets?) that I’ve downloaded. They come nicely packaged in a primary folder and include other folders: CSS, JS, Images, Fonts and some index.html documents…BUT, no instructions on how I would install them on my wordpressMU site’s pages.
I’ve watch videos, joined forums, etc. but as helpful as so many have been, I still do not have a clear idea on how to do this. I would really appreciate any advice on getting this to happen. Thanks!
You see, the HTML on your site is very likely to be different from that on other people’s site, since it is there to mark up your content. If a site has different content (or a different design), it will use different HTML. This is why you have to incorporate their code into your own site — it can’t often be done automatically.
If you linked to your HTML pages and the stuff you want to include, it might be possible to give more specific advice.
@Bizolly, If you’re still using the Child Theme, you’ll put the js in the `/js/` in your child theme, and any css in `/css/` in your child theme..then [enqueue the scripts](http://codex.wordpress.org/Function_Reference/wp_enqueue_script “”), and [the styles](http://codex.wordpress.org/Function_Reference/wp_enqueue_style “”), then edit any page templates to add classes and id’s that your plugins may be using..
Hi Everyone! Great of you to help me. I didn’t think I’d get an answer so quickly. And, Chris you are great to reiterate. The problem here is I’m an beginner. I don’t quite know how to: add classes and id’s to define these specific actions. These items come with documents inside folders that is the code.
My child theme CSS is blank. I can create a folder for the JS and one for all the Images. I assume all of these folders will reside in my Child Theme.
Now, I’ll have…lets say 5 of these items to install, each have their own set of folders (CSS, JS, Images, Fonts, Index.html documents) with content/code. Do I place ‘their’ folder inside my child theme folder(s) or do I place the documents from each of ‘their’ folders inside my child theme’s folders that I’ve created; i.e.: CSS, JS, Images, Font, etc.?
Then, I assume I add code to my wordpress theme, where? In the header for all pages? What code do I place there? I want to use items on specific pages, not on all pages of my wordpressMU site.
Andy, sorry I was vague…it isn’t a theme but: sliders, buttons, tooltips, tables, etc.
The site I’m working on is: http://www.corporate-headquarters.biz
@Bizolly, OK bear with me…
You have a childtheme..if it’s super bare bones, you’ll prob only have a functions.php and a style.css
Say, one of the plugins you want to install is some flashy buttons..right? So, this plugin comes with an index.html, flashy-buttons.css, flashy-buttons.js, and maybe some image files…
You’ll add an images directory to your child theme..so `/img/` for example..and you’ll put all those plugin files either a) directly in the img directory, or b) create a sub directory `/img/flashy-buttons/` and put them there..next, create a js directory in your child theme, and put flashy-buttons.js there, NEXT, for the sake of having one CSS file, copy and paste the contents of flashy-buttons.css to your style.css..
you MUST enqueue the script as I mentioned in the post above, so this is either already located in your childtheme functions.php, or you must write the enqueue yourself…
now, in the plugins index.html, it will show you how it’s used..using the classes and ID’s in the example, you can either go through your js, and css files FOR THE PLUGIN, and change them to id’s and classes that your theme is already using, OR, you can start taking template files (by template files I mean page.php, index.php, single.php, header.php, footer.php, etc) from the Parent Theme, editing them by adding those classes and ID’s in, and saving them in your child theme, so now wordpress will use those templates, with your updated classes and ID’s rather than the Parent Theme’s templates..
Go through the plugin’s css (now located in your style.css) and make sure any image references are going to the right location, and make sure your JS is being called properly, and you should be good to go..
Repeat for the 3-4 other plugins that you’re interested in using.
Thank you Chris, again. On a scale of 1 to 10, ten being a professional web developer and one being someone that doesn’t know anything about HTML, what skill level is this? The reason I ask is because I would rate my skill level in regards to experience/knowledge between a 4 or 5.
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".