Full Site Readme

4
Instructions are provided by http://www.template-help.com Page 1 APPENDIX 1. Unzipping the template package 2. General Information about template structure and its content 3. Editing Flash version (static header) a) editing .html files b) editing Photoshop (.psd) files 4. Editing HTML version (flash animated header) a) editing .html files b) editing Flash (.fla) files c) editing Photoshop (.psd) files 5. Uploading template NOTE: The instructions in the 2 nd paragraph are complied for “Full Site Flash” and “CSS Full Site Flash” types of templates. If you have “CSS Static Full Site” or “JS Animated Full Site”, then skip the 4 th paragraph. Also, the folder structure of the last 2 templates is a bit different; they do not have such folders: /site_flash and /sources/flash

Transcript of Full Site Readme

Page 1: Full Site Readme

Instructions are provided by http://www.template-help.com Page 1

APPENDIX

1. Unzipping the template package 2. General Information about template structure and its content

3. Editing Flash version (static header)

a) editing .html files b) editing Photoshop (.psd) files

4. Editing HTML version (flash animated header) a) editing .html files b) editing Flash (.fla) files

c) editing Photoshop (.psd) files

5. Uploading template NOTE: The instructions in the 2nd paragraph are complied for “Full Site Flash” and “CSS Full Site Flash” types of templates. If you have “CSS Static Full Site” or “JS Animated Full Site”, then skip the 4th paragraph. Also, the folder structure of the last 2 templates is a bit different; they do not have such folders: /site_flash and /sources/flash

Page 2: Full Site Readme

Instructions are provided by http://www.template-help.com Page 2

1. Unzipping Template Package

After unzipping the template package you will find 3 folders: “screenshots”, “site”, “site_flash” and another zip archive called “sources_############.zip” which you are to unzip. You may also check the video tutorial below on how to unzip the template package http://info.template-help.com/after_sale_support/Demo_movies_database/Unzipping/

While unzipping “sources_############.zip” archive you will be prompted to enter a password, which you

can find at your Product Download Page (open the link in the email you received from our company). You should now have 4 folders in total: “screenshots”, “site”, “site_flash”, “sources”

2. General Information and Template Structure

Your type of template includes 2 versions of the same design: one with a Flash (animated) header, and the other – with HTML (static) header. Refer to the corresponding section of the instructions below depending which version of the template you would like to use:

1) HTML version (non-animated header) 2) Flash version (animated header)

screenshots/ – contains screenshots of the template. No editable files here

site/ – contains .HTML and .CSS files for the non-animated version of the template images – contains all the images used in .HTML files

site_flash/ – contains .HTML and .CSS files for the animated version of the template flash – contains .SWF flash movie(s) used in .HTML file images – contains all the images used in .HTML files

sources/ – contains source files clipart_library – bonus materials not related to the template design flash – contains Flash .FLA source file(s) psd – contains Adobe Photoshop .PSD file(s)

3. Editing HTML version of the template

Software Required: You can download trial (30 days free) versions by the following links Adobe Dreamweaver (or Microsoft Expression Web) http://www.adobe.com/products/dreamweaver/ http://www.microsoft.com/expression/products/Web_Overview.aspx Adobe Photoshop http://www.adobe.com/products/photoshop/photoshop/

a) Editing HTML page content All the editable HTML files are located in “site” folder of the template package (index.html, index-1.html, index-2.html, etc.) Each index-#.html file represents one page. To open .html file with Adobe Dreamweaver software, you should right mouse click on the file, and in the context menu select Open with -> Adobe Dreamweaver. The file is opened and you can start editing it. Please, check this link for general instructions on how to work with Adobe Dreamweaver and .html files http://info.template-help.com/after_sale_support/working_with_html/

Page 3: Full Site Readme

Instructions are provided by http://www.template-help.com Page 3

b) Photoshop files Photoshop files are located in “sources/psd” folder and required for editing some text titles in the template, that were created using non-standard fonts. Example below will show you how to determine if such fonts are used in your template. Please, look at the 2 example screenshots below

The first screenshot shows a complete web template layout, while the second is what you see when open “site/index.html” file with your web browser. All those “missing” elements on the second screenshot (top menu titles, banner titles) should be edited/updated via .psd files Please, check the video tutorial by this link on how to work and save content from .psd file into your web page http://info.template-help.com/after_sale_support/Demo_movies_database/Photoshop/article5.html Also, please pay attention to this video tutorial concerning saving slice that are overlapped by other slices, and big slices such as backgrounds http://info.template-help.com/after_sale_support/Demo_movies_database/Photoshop/article5.html

If the HTML layout of your template looks complete and doesn’t have any missing title, then your template is using Cufon technology which allows embedding non-standard fonts using JavaScript, so all the text can be edited directly in .html files. By default template fonts support only Latin characters, embedding special characters (Latin with acute, Greeks, Cyrilic, etc.) requires recompiling javascript font provided with the template. Please, check the following tutorial on how to do that http://info.template-help.com/after_sale_support/Demo_movies_database/Html/article6.html

4. Editing Flash version of the template Software Required: You can download trial (30 days free) versions by the following links Adobe Dreamweaver (or Microsoft Expression Web) http://www.adobe.com/products/dreamweaver/ http://www.microsoft.com/expression/products/Web_Overview.aspx Adobe Photoshop http://www.adobe.com/products/photoshop/photoshop/ Adobe Flash Professional http://www.adobe.com/products/flash/

Page 4: Full Site Readme

Instructions are provided by http://www.template-help.com Page 4

a) Editing Flash header Editable flash file (.fla) is located inside “sources/flash” folder of the template package. Prior to opening the file with Adobe Flash software, you need to install all the fonts used in the template. Open “sources/fonts” folder and press CTRL+A (to select all the files) and then CTRL+C (to copy selected files). Now you should navigate to your system fonts folder (e.g. C:\Windows\Fonts) and paste all the fonts there (CTRL+V). Now you can open .fla file with Adobe Flash software and start customizing it to your needs. If you don’t have experience with Flash, please check the links below for general guidelines and video tutorials http://info.template-help.com/after_sale_support/Working_with_Flash/ http://info.template-help.com/eoc/flash/

b) Editing HTML page content Please, refer to 3.a paragraph of the current document. NB: HTML files for the animated version of the template are located in “site_flash” folder (not “site”)

c) Photoshop files Please, refer to 3.b paragraph of the current document

5. Uploading template

In order to make your site “live”, you need to upload specific template files from your local computer to your hosting server.

Depending on the version of the template you selected (Flash or HTML) you should upload content of the corresponding folder:

- If you customized HTML (static) version of the template upload all the content of “site” folder - If you customized Flash (animated) version of the template upload all the content of “site_flash” folder

This video tutorial will show you how you can upload files to your host using free FTP software software FileZilla (you may use any other software you like, or upload directly via Hosting Cpanel) http://info.template-help.com/after_sale_support/Uploading_files_to_a_server/article8.html