Setup Guide V1 (last updated January 4th, 2007)

Designed for the Gen7 Series Templates and Modules

Logo / Branding Basic Tutorials

• order free text logo
• replace logo with text
• remove logo, don't replace
• move or re-located on page

Logo / Branding intermediate tutorials

• modify 'Website Name' graphic using Macromedia Fireworks
• replace 'Website Name' graphic with your own
• replace 'Website Name' graphic with 'stylized' text

Order the free text LOGO

The following instructions will show you how you can order your free text logo image, and import it from your desktop, directly into the 'logo' folder of your website. This action will replace the default logo with your new logo. You will not need to edit the include/logo.htm page, unless you have specific need to, or the designer has sent NEW instructions specifically for your logo replacement.

This is a two step process, ordering your logo, then downloading and installing the new graphic

INSTRUCTIONS: Ordering your FREE text logo

• logo into your members page at www.luckymarble.com/members

• locate your Template:

• click on Customize button

review the process information and click on Continue

Review the terms of service, check the boxes, and click continue

Confirm your contact details:

Specify the details of your request

Your request will be submitted, and within 3 business days you will receive a message in your email with instructions asking you to log into your account and download your logo:

Once you LOGO is ready, you can download it from your members main page and look in your "My Customizations Request" area:

Click on the Review button

On the following page, you'll viewing your "Project Summary" page.

Under the "Project Deliverables" you'll find the 'downloadable' logo files under the 'Description' header.

Remove the logo do not replace

INSTRUCTIONS:

• open your web site

• open the 'includes' folder - [FP] 'Library' folder - [DW]

• open the 'logo.' page

• delete the 'Website Name' graphic

• save

Move or re-locate on page

You can move the logo to any location on your web page, by selecting the 'div' container, and dragging it into place, or using your keyboard arrow keys to move it around the page.

• open the DWT / or web page
  
• click on the 'Website Name' or your logo graphic
  
• with the 'Website Name' highlighted, grab with your mouse and move, or use the arrow keys on your keyboard to re-position

Logo / Branding intermediate tutorials

• modify 'Website Name' graphic using Macromedia Fireworks
• replace 'Website Name' graphic with your own
• replace 'Website Name' graphic with 'stylized' text

Please review the tutorials on CSS font (types, size, color) if you plan on replacing the logo with Stylized Text.

Modify the Website Name graphic with Fireworks

 You can modify the 'Website Name' graphic using Macromedia Fireworks MX 2004 or 8 as this graphic is also an editable source file.

 ** these instructions are for Macromedia Fireworks MX / 2004 or 8 *

 INSTRUCTIONS:

• open your website

• open the 'includes' folder - [FP] 'Library' folder - [DW]

• open the 'logo.' page

• right click on the 'Website Name' graphic

• move your mouse over the 'Open with' menu

• select Fireworks MX 2004 or Fireworks 8 from the list of available programs

this will open the editable 'Website Name' graphic in Fireworks.

Being the crafty people that we are, we've designed the logo and the logo include page in such a manner that you can resize the image in Fireworks if you like, and when you save, it will update the image size displayed on the logo include page.

• make changes to the image in Fireworks

• when you have completed your edits, click on the file menu in Fireworks, and click SAVE

this action will save the PNG, and update the existing image in your website to reflect the changes you made to it in Fireworks

Replace the Website Name with your own Graphic

This is really quite easy. Most folks run into trouble is when it comes to replacing the default logo graphic with their own graphic, due to various sizing issues, or image quality. The 'Website Name' graphic we use in the template, is a 'transparent' PNG image, created in Macromedia Fireworks. The logo.png uses a high quality 24 bit setting. Few of our members are graphic designers, and most will not even own a graphic editor such as Macromedia Fireworks, or Adobe Photoshop so this terminology will be new territory. But not territory that you need cross into.

To replace the default logo, I would suggest an image with a square or rectangle outline if you are using a JPG or GIF.
If you're logo uses any 'rounded off' or transparent areas, then I suggest that you only use a PNG format. You may have several versions or file types of the logo graphic, such as an Adobe Illustrator (.ai) file type, or a transparent (EPS) or Adobe Photoshop (PSD) file type. Any of these file types can be converted for use on the web, or saved as a transparent 24bit PNG file type.

If you have a logo graphic that was created by a professional design company, you should have been provided a set of logo graphic files. Even if you don't have the originals, you may have a 'transparent' image in the works somewhere. Convert your logo image to transparent PNG format for best results.

INSTRUCTIONS:

• open your web site
• open the 'includes' folder - [FP] 'Library' folder - [DW]
• open the 'logo' page
• remove the 'Website Name' graphic from the page
• drag and drop your replacement image onto the page
• save and preview your index.htm page

(** IMPORTANT** do not position the graphic on the page. Your replacement graphic should be aligned top left on the page. Positioning of the graphic is managed by the stylesheet. For details on positioning, review the 'Case Study video, or contact our design team for details )