templates - Post ID 106022

User 321908 Photo


Registered User
30 posts

I have never made a template so using a premade is no help to me because it doesn't look like what I want to do....*sigh* So here is the question...is there ANYONE that can tell me how to make a template from scratch in Coffeecup since that's the software I have...I do have a VERY OLD version of dreamweaver...but don't think that would be of any use.

I really need some help here.....please!!!!!
come to a place where magic lives....
User 562592 Photo


Registered User
2,038 posts

There are many people who can help on this forum, but its not entirely clear to me what exactly you are looking for. Are you creating a website or are you just creating templates for other people to use? A template is just a basic page that you can manipulate to look the way you want. It sounds like you are just trying to make a webpage? Is that true?
Maybe some clarity would help us. :D
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.

My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).

My Personal Website: http://www.EricSEnglish.com

User 321908 Photo


Registered User
30 posts

Eric, the template will be for a web site I am designing. I understand WHAT a template is, I've worked with it in the past but that one had already been created. I want to CREATE a template. As I stated, I've seen 'basic' templates but nothing that fits exactly what I have in mind.

I am going to attach what I quickly created to put up untill I got the site set up. I want to use the background and the title. I want the menu to go down the left side, there will probably be at least one sub menu, and of course our web hosting company in small text across the bottom. Hopefully this is a better explination of what I am looking for.

Also attaching just the background
Attachments:
come to a place where magic lives....
User 562592 Photo


Registered User
2,038 posts

First, if your not familiar with CSS files you should learn it, because it will be difficult to do your project without it.

To tile the background image insert this code into your head area:

<style>
body{background:url(FileLocation.gif);}
</style>

This will repeat your tile and tile the whole background.

For your title you just need a brief image markup. Put this as the first markup below your <body> tag:

<div align="center"><img src="FileLocation.gif" /></div>

This should place your title in the center at the top of your background.

For your menu (remember to style it you need CSS) include this markup after your image:

<div align="left">
<ul>
<li><a href="LinkLocation">Link 1</a></li>
<li><a href="LinkLocation">Link 2</a></li>
</ul>
</div>

Put as many links as you want. This should display a menu that appears on the left.

I think that covered everything.

Also, the html editor has a handy "new from layout" under the file menu option. It creates the frames for you to generate your own custom template.

Hope this helps.

Eric

The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.

My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).

My Personal Website: http://www.EricSEnglish.com

User 321908 Photo


Registered User
30 posts

Eric,

You are a godsend!!! I'm using CC's style creator and I LOVE IT!!! I do have one question. I don't want to tile the background...doesn't look well tiled (the attachment I sent you was about 25% of the original). I would prefer it fixed and everything else scroll, understand? So how would I write that? Oh and I will check out the CC html...I use that and my old dreamweaver to design my ideas. Dreamweaver so I can see it and CC to tweak. It works for me LOL

Also, I REALLY appreciate your quick responses :)

come to a place where magic lives....
User 562592 Photo


Registered User
2,038 posts

All you have to do is add "no-repeat" to the body in the style tag like this:

<style>
body{background:url(FileLocation.gif)no-repeat;}
</style>

Hope this helps. Need anything else let us know.

Eric
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.

My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).

My Personal Website: http://www.EricSEnglish.com

User 321908 Photo


Registered User
30 posts

AWESOME. As soon as I can get this together and up, I'll send you a link so you can see what all your hard work has done *GRIN*

come to a place where magic lives....
User 562592 Photo


Registered User
2,038 posts

Sounds good. Glad I could help.

:D
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.

My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).

My Personal Website: http://www.EricSEnglish.com

User 321908 Photo


Registered User
30 posts

hey Eric,

Have another question on the template, which is going pretty good thank you very much. :)

Is there a way to have two backgrounds? One that will fill the screen, no matter what size and one that a portion can be editable?

Here is an example

http://www.swflcouncilbsa.org/openroste … orgkey=347

See how the stars are the 'back' background and then there is the white editable region? Overall the Scout site is a bit 'busy' for me but the basic layout is pretty much what I am looking for. Menu on left, 'back' background, editable region centered. Well I would like mine really centered. I have checked their 'View Source' but that lost me. *GRIN* You see, I'm self taught as far as web sites go and mine is in the old html...ergo all my questions. I know what I want, I know it can be done, I've seen it. The help you gave me yesterday has been invaluble. So, once again, I look to you for some advise.

come to a place where magic lives....
User 562592 Photo


Registered User
2,038 posts

Mike, I am self taught as well so I understand the process it takes to get a good working knowledge of all of this. But these forums are a great way to start learning.

If I understand your question correctly, you want to create a background for your content and menu. At this point let me suggest what you should begin learning next, because many of the questions you have now (and those I am anticipating) are really CSS questions (cascading style sheets). These are how you style you html. In the meantime let me answer your question directly:

All you have to do is set the background attribute for each item you want a background for (like we did for the body). If you want to style your links (also called lists) then add this to your <style> tag in the head section

ul{background:url(ImageLocation.gif)no-repeat;

(Make sure the image is large enough to cover your whole link section. If its not then instead of "no-repeat" put "repeat-y" this will tile it vertically.)

For your content portion this is a little more difficult because you should really have CSS do this for you, but we will give it a try and see if it makes sense. Again in your head section put this:

#content{background:#ffffff;}

The #ffffff, is the color white. You can use any color you want to insert here. If you want to know the rest of the hex colors just type in Google "CSS hex colors".

Now in the body of your document put this code wherever your content is going to go.

<div id="content">
<p>CONTENT GOES HERE</p>
</div>

I hope this answered your question.

Eric
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.

My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).

My Personal Website: http://www.EricSEnglish.com


Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.