Basic Dreamweaver template prepping question

[bredlo]

Hi guys - I'm new, and I've got troubles. Here's the quick version:
I wanted to build out my new ShopSite store to look like the rest of my simple, 8 page site.

I decided to follow the "Quick and Easy ShopSite Templates" tutorial, here:
http://www.shopsite.com/templates/cookbook/quick-easy-templates.shtml

I immediately ran into a hiccup when I realized I don't have an existing template for my site, or a "main cell" in which to insert ShopSite's code. I built the site in Dreamweaver CS3, and have never needed to learn templates. I understand the importance and convenience of them now, though.

So I'm wondering if someone can help me find a SIMPLE tutorial that'll allow me to turn my site's existing graphical menu bar into a header, footer and main content section template... just so I can just get to the next step in the "Quick and Easy" instructions.

Here's the site for a sample of how basic the pages are already.
http://www.yarnlady.com

Thanks in advance!

[tdsrob]

The main cell to paste the information in should be all the white space underneath your header image. For example your "main cell" in your home page would be the table containing the information starting with "happy new year" to "A message from Yarn Lady owner Ginger Hess". You should just have to paste the shopsite information from the quick and easy tutorial into that table space. I am still learning this aswell and just completed the quick and easy tutorial. I hope this helps....

[bredlo]

Hey tdsrob,

Right, I got where it's supposed to go. My problem is I don't know how to differentiate the header, body and footer when building the page in the first place. I'm self taught, and obviously I've taught myself the wrong way.

So I probably need to head over to the Adobe forums since this is more a Dreamweaver question - just thought somebody here might know of a good spot to find a tutorial for setting up the template in which to put the ShopSite code.

Thanks, and good luck to you too!

[Jim]

What information do you have at the top of the page? That would be the header section. Just copy the source for that section from Dreamweaver and put it in the Preferencs > Header (or Preferences > Layout Settings) header section. And put the tag [-- header --] in your dreamweaver file in its place.


Same goes for the footer only use the [-- footer --] template tag.

The main body part of your page would then be replace by the code from the quick and easy template example so your page text and products can be put on the page.

[bredlo]

Hey Jim,

Thx for the reply. I guess I could do that - is the fact that it's all in one table going to be a problem though? Perhaps not - I don't want to assume there'll be trouble where there is none.

I follow that first part, but am lost when it comes to where I put header and footer tags - seemingly randomly into the source code.

I'll play around a bit and see if I can do this, I don't want to be quite so helpless. It sounds as if your steps would replace the need to specifically add "editable regions" to the document, which I'm guessing I'll still be re-saving as a template at some point.

Thanks!

[BFChris]

The idea is this:

You take whatever part of your Dreamweaver code that makes up the "header" (ie. whatever is always at the top of every page) and copy it in the "Header" field in the Shopsite backoffice. Then, in your Dreamweaver page, you remove that section of code and replace it with the [ --header --] template tag. When you copy this code into a Shopsite template and publish the page, Shopsite replaces the tag with the content of that field from the backoffice. In this way, you can update the contents of these sections via the Shopsite backoffice without having to even mess with the templates themselves in the future.

Same process applies for the footer.

[bredlo]

I think I'm gettin' it now! So as I understand it: I'm still building a template in dreamweaver that i'll ultimately have to upload, but it will be pulling header and footer code from within shopsite, that came from my regular html pages that currently make up the site.

Thx for the clarification - you wouldn't believe how smart I am about everything else in life.

[Jim]

We'll take your word for it.

[bredlo]

Not working, sadly. I got the header image placeholders and footer text (I know I didn't upload the graphics in the right place so that's why htere are questions marks) but nothing is going to behave or line up correctly without the table I originally had them contained in.

Back to square one, I guess.

[BFChris]

You can include the table. Just make sure you don't lose any of your table tags when copying and pasting into different Shopsite fields.

For example, if you're using a giant table to contain all the content of the page, you may need to put the opening <table> tag in the header field and the closing </table> tag in the footer field.

[bredlo]

I give up.

Anybody willing at this point to work-for-hire on this? My original html pages have a table, in which all the header graphics, etc. are designed to perfectly line up.

Any attempts to transform this into a template are beyond me and skew all the graphics (mostly menu buttons).

So any freelance guys out there, name your price. I need this done tonight, and I don't imagine it'll take more than 15 minutes for somebody who knows what the hell they're doing. Because I surely don't.

Thanks,
Brad

[BFChris]

What Shopsite template are you using? It's possible things already in the template are interfering with the layout of your table.

[BFChris]

Another thought to consider...

There are some decisions that need to be made in the beginning regarding how it is best to separate code between Shopsite back office fields and actual code in the templates. For example, do tables and cell tags get included within the template itself or in the Shopsite fields? It may seem "easier" at first to include the table framework directly in a back office field and not edit the template directly. However, this can make the page more prone to accidental mis-formatting during later editing (by accidentally deleting a tag that is critical to the layout)... and it can also become confusing to keep track when you have elements spanning multiple Shopsite fields (for example, a layout table which makes the framework for an entire page, which, as previously mentioned, may need to be opened in the header field and closed in the footer field).

These decisions will make a lot of difference down the road with regard to how easy things are to edit via the back office versus having to work directly with the templates.

[bredlo]

It's ShopSite Manager 10 r7, courtesy of Verio hosting.

I haven't even gotten to the point of uploading anything to ShopSite, so I know I couldn't have messed up anything just yet.

I simply need this:
www.yarnlady.com/store/index.html

to look exactly like this:
www.yarnlady.com

But with everything from the "welcome" graphic to the message from the owner replaced with the store. I can't seem to wrap my brain around all these different terms like back office fields, product templates vs. page templates, etc.

That's why I really need to get this portion done for me by someone who understands how all these things relate. The "quick and easy" steps are just vague enough that I'm completely lost. If anybody could step in, I'd be thrilled to subcontract you, give you access to the files, etc.

[BFChris]

I can do this for you. Please contact me off the forum (either by private forum message or through my website in the link below) and I'll be happy to assist further.