1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

General What am I missing here?

Discussion in 'General' started by fididdly, Sep 21, 2009.

  1. fididdly

    fididdly New Member

    I've been trying to upload a template-based web page. I managed to upload a really ugly basic site using Kompozer, but it was my own html code.

    There must be some basic/knucklehead/noob step I'm missing. I use a Mac OS 10.5.8. I've tried cutting and pasting the CSS code (the best ones seem to be in CSS) in both TextWrangler and TextEdit, then copying and pasting them into the text window where you put your own HTML code. It doesn't work in either Kompozer or Nvu, which I tried.

    Honest, ishkey, I've spent many hours on this, and I've gone over and over your tutorials and lots of others people's too!

    Can somebody clue me in? Pleeeze? Thanx.
     
    fididdly, Sep 21, 2009
    #1
  2. Mimoun

    Mimoun Administrator Staff Member Director Verified Member

    Which version of KompoZer are you using?
    Some versions of KompoZer on the Mac have problems with ftp publishing.
    Click -> Kompozer -> About Kompozer
     
    Mimoun, Sep 22, 2009
    #2
  3. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Hello fididdly and welcome to FWT.
    Hats off to you for uploading Your Own Code, there is no such thing as a really ugly basic site when you are starting out. The beauty lies in the code you created.

    I'm not a Mac user but suggest you stick with TextWrangler over TextEdit, it's not BBEdit but it's beyond BBEdit Lite, as it has remote FTP/SFTP, can perform Find Differences on pairs of files or folders, code writing, or Web site maintenance.
    Not bad for a freebe.

    Ok - let's slowdown for a few milliseconds... With all the excessive rain we have had here, it has impeded my xray vision, so I can not see your code or even your your website. :)

    Tried cut/pasting css code in text window where you put html code!!!
    Did you write your own css code?
    If you did - then in the html file it should look some thing like this (example code);

    Code:
    <html>
<head>
<style type="text/css"> 
<!--
body {
 font-family: "Courier New", Courier, monospace;
 color: #333;
}
a:link {
 color: #000;
}
a:visited {
 color: #F00;
}
a:hover {
 color: #00F;
}
-->
</style>
</head>
 <body>
 your code here
 more code here
</body>
</html>
    or are you tring to reference an external style sheet?
    All of us (there are several talented people here) need a little more info to help you out.
    Post a link or some of the code you are describing, so we can help you solve this.
     
    ishkey, Sep 22, 2009
    #3
  4. fididdly

    fididdly New Member

    I used Kompozer 0.7.10-mac.dmg. I also tried it with nvu-1.0-mac.dmg.

    I was referencing an external style sheet--specifically, the style.css file that opens up in TextWrangler or TextEdit. Actually I copied the html directly from the style.css file. Maybe that's my noob error, but I don't know how else you're supposed to do it.

    I tried it with two from www.oswd.org ("lovely" and "cash") and with "babytemplate" just posted on your web site. Tried the first two with all the different permutations of Kompozer/Nvu/TextWrangler/TextEdit.

    Learning lots of stuff, that's for sure. Thank you for your help!
     
    fididdly, Sep 22, 2009
    #4
  5. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    The rain has finally stopped after 9 days straight, cleaned up all the downed trees and my connection is less spotty, but still no email.
    Back to your problem - This makes no sense.
    All of the templates you downloaded came with;
    index.html - the file a browser reads which inside tells it "what to display" and it is the file you edit to put in your own words and pictures.
    This file is written in html code.
    styles.css - stands for Cascading Style Sheets. Styles define "how to display" HTML elements. Written in css code. For now you should just leave this alone...
    images directory - Is just a depository for the graphic files which make up the template and can also be a place for you to store your graphic files. Like the pictures in the gallery of the babytemplate. I make a seperate directory for my pics. This way if something needs changing I don't mess up my template. I use alot of directories, so I can group things. Another example is a directory for my java files, another one for my php files, the list goes on and on. (it's a smart way to program - organization)

    Next - this is in reference to the "babytemplate" but the other two templates will be the same execpt for the path in the example below.

    Open your editor and load index.html from the babytemplate.
    In your index.html file in the "<head> </head>" section, which is at the start of the file, is a line of text which tells the browser to go look in the root directory for a file called style.css. In it you will find all the rules to display the code that is written in the index.html file.
    Here is that line of code
    HTML:
    <link href="style.css" rel="stylesheet" type="text/css" />
    Lets break it down - look at your index.file in your editor. Look right after the <body> tag you will find the tag <div id="container">
    Next comes the tag we want to look at <div id="header"></div>
    As it is displayed, it doesen't look like much, does it!
    What it tells the browser is to display the header here. Now because of the link to the style.css and the <div id the browser knows to go look in the style.css file and find the formatting properties for this tag.

    Are you with me so far... Good

    Now open your style.css file look for the header id - #header
    Code:
    #header {
 background-image:url(images/header.jpg);
 width: 707px;
 height:300px;
 display:block;
 margin:0px;
 padding:0px;
}
    What does this tell the browser.
    Display a background image called header.jpg located in the images directory and use these parameters when displaying it.

    The css file is made up of Elements, IDs and Classes
    Each has it's function and all make up the css code or language.

    When you are not sure or just need to reference something look to w3schools.com

    I think this should clear things up for you.
    If not we are here.
    Let us know how it goes - make sure you put up a link so we can follow your work and stay active on the forum. People can always benefit from what you learn. We have forums for that.
     
    ishkey, Sep 22, 2009
    #5
  6. fididdly

    fididdly New Member

    Thanks, ishkey...will try it and then post.
     
    fididdly, Sep 22, 2009
    #6
  7. fididdly

    fididdly New Member

    Sorry for the delay--my host was down for a full day :(

    I've kinda sorta gotten a start here. The template doesn't look right (I tried to edit it) but all the text is up on the screen, and the text I input in the head is there where it's supposed to be. So now I can fumble-foot forward.

    THANK YOU ishkey and Mimoun. Things are looking up!
     
    fididdly, Sep 24, 2009
    #7
  8. fididdly

    fididdly New Member

    Okay, newbie confession: The problem apparently was that I didn't click the <>Source tab at the bottom of the text portion of the Nvu window.

    Miles to go.
     
    fididdly, Sep 24, 2009
    #8