Importing a website designed externally

  1. Create an ordinary website space.
  2. Delete any prexisting wizard generated pages that you won't be needing. Keep any shopping pages if you need them.
  3. Copy across existing website files
    1. Ask support to enable your FTP aka (status WIP - KEEN or higher)
    2. Look under manage files in the left menu, for your FTP details
    3. Upload your images and other binary files (excluding your css and html pages)
  4. Copy your css and javascript into the appropriate area in the advanced template desiger area. Remember to fix any image urls in the CSS to include a preceding /
  5. Create your templates from one of the existing pages. Refer to the help section on setting up templates.
  6. Try to pick the best deliniation point to separate your template from your content. Try to avoid including any wrapper tables around your content in the content area. Try to avoid using any repetitive columns/footers in your content that could have been put in a template. You can create more than 1 template.
  7. While in HTML mode, quickly look for any images/links that assume root relative paths, eg src="/images/" and change to src="/images" and same for HREF
  8. Now create your pages 1 by 1
    1. Add new page, single design page (or enquiry form if its a form) or submenus if required.
    2. If you want, set a page title here and then delete it from the content. Using the database driven title is best for SEO. If the original design didnt use H1 titles, then you will need to create a CSS for H1
    3. Set the filename at page creation time, use exactly the same filename and suffix as the original file, as this will make internal links easier to fix (or if they then even need fixing)... don't do this for the home page.
    4. Once in the editor window, change to HTML mode, and copy and paste the HTML content from the original file. Avoid copying any wrapper tables. Put any common wrapper tables into the templates as per the earlier steps. (You could do this in design mode, but if you do, you will probably need to clean up alot of surpurfluous html code).
    5. While in HTML mode, carefully look for any images or links that assume root relative paths, eg src="photo.jpg" and change to src="/images/photo.jpg" and same for HREFs
    6. Repeat for each page as above, including hidden pages
  9. Now publish your website
  10. View the website
  11. Click down each menu button of the website. All content on all pages should look correct, eg with the page title and content nicely aligned.
  12. If any content or titles are not aligned, then look in the content for unrequired tables that may including padding or css style classes.
  13. Do not use CSS to position/pad the H1 or the content elements individually. If you need to position these collectively, then put a table or div class into the template... Avoid making assumptions about the content of your existing pages, because when a customer adds a new page, then it may not have the appropriate classes that you were expecting... So to repeat... Keep your content clean.
  14. If any of your pages have broken images or bad links, then you will need to go and fix em... typically look for images with really weird looking paths or ones with no preceeding slash /. If the path looks weird, remove everything up to the images/ part and then replace with /images/

Index Previous Next