Noob Question... Putting Everything Together

Trones · 10-04-2012, 04:39 AM

OK so basically I am trying to figure out how everything goes together, or how I can tell it to go together, including like css, html, jquery, all that stuff.

I have a little bit of experience with programming, took a class on just basic a few years ago, but I am completely new to actually having and more specifically making my own website(s).

Eventually I will delegate all of this but for now my company cant afford it lol.

Anyway here's my basic issue.

I have a template website that I uploaded. Everythings good.
I purchased a slider that I want to replace the slider that is already there.

Now how do I tell the .html that i want the css and jquery and all the other files to apply to that .html and not one of the other ones?

Also for the image source files, does it matter where they go?

Finally, is there an easier way to check my work than uploading everything and refreshing the actual website?

I have Dreamweaver CS6, and Ive watched a few videos but still not much experience.

Thanks and I appreciate any and all help

TeenScripts · 10-14-2012, 06:51 PM

Alright this seems simple if i understand what you mean....

CSS=Design of the Webpage
JavaScript and JQuery= Alerts and Actions in a Webpage

You can actually add CSS, Javascript, JQuery... into your Html Page using the following tags :

For Javascript and JQuery:

Code:

<script>JS/JQ codes go in here</script>

as you can see we add the "<Script></Script>" tags before and after the Javascript/JQuery code

For CSS

Code:

<style>CSS codes go here</script>

as you can see we add the "<Style></Style>" tags before and after the CSS code

You can also Link them to your html page (in order to keep everything organized: 1page for all html, 1page for all JS, 1 page for all JQ, 1 page for all CSS...)

Code:

<a href="locationofyourfile.typeoffile"></a>

Example:

Code:

<a href="style.css"></a>

That way your computer automatically knows were to look and all the style and actions are applied to your page!

Good Luck!

VIPStephan · 10-15-2012, 10:07 AM

Sorry, I have to chime in because TeenScripts’ advice isn’t entirely correct.

Trones, in your current HTML files look for the document header (enclosed by <head> and </head> tags). In there you will usually find the references to all stylesheets and scripts. As TeenScripts wrote styles can be linked but these links look something like this: <link rel="stylesheet" type="text/css" href="styles.css" media="screen">. The stuff in the href attribute is the path to the CSS file. If you change that to your custom CSS file the document will take these styles. You can also just add a new <link> element if you wanna add new styles while keeping the old ones.

Likewise, the JavaScript references look something like <script type="text/javascript" src="functions.js"></script> and the text in the src attribute is the path to the JS file. Note that JS files don’t necessarily have to reside in the document head, some people prefer to put them somewhere at the end of the HTML file (before the closing body tag).

Now, when I hear “slider” I think of some kind of JS framework so there is probably more to it than just adding the new slider or just replacing the old references with the new ones. The best would be to show us your code so someone can explain you what extactly you have to replace and what should stay.