How to build a Scribo website

How an Aida/Web site was built?

Basically in three steps:

  1. web designer first built a mockup of the page in a Photoshop (see mockup)
  2. HTML/CSS meister then cut the mockup in appropriate HTML, CSS and image files (see them on our ftp)
  3. Aida developer then build a style class and components in Smalltalk

How the last step is done:

  1. create a separate package: Aida-Site
  2. create subclasses for site content and pages:
    • AidaWebContent as subclass of SiteContent
    • AidaWebContentApp as subclass of SiteContentApp
    • AidaWebPage as subclass of SitePage
    • AidaWebPageApp as subclass of SitePageApp
  3. create a style class AidaWebStyle as subclass of ScriboStyle
  4. register site content and page classes in your AidaWebStyle class by overriding two methods:
    • #siteContentClass ^AidaWebSiteContent
    • #sitePageClass ^AidaWebPage
  5. import images from files into a style class, one by one, using a naming convention:
    • hover-nav.gif in method named hoverNavGif
    • image is imported by pasting into this method the inspect of:
      • '/home/me/images/hover-nav.gif' asFilename contentAsMethod
    • see DefaultWebStyle imgs* for examples
  6. put CSS into method cssAll, in method category styles-screen
    • implement also method addSuperStyles to return false, to prevent CSS from superstyles to be added to our one
  7. change image links to point to imported images, using a naming convention:
    • for ../images/hover-nav.gif change to /img/hoverNavGif.gif
  8. prepare a layout of the page by cutting the page into nested subelements
    • implement methods like headerElement, footerElement, columnsElements etc.
  9. override #pageFrameWith:wide:title: so taht Aida admin tools will work on this webpage too
  10. register your style class for your site:
    • (AIDASite named: 'mysite) styleClass: 'AidaWebStyle'
  11. register first page of your site on relative URL '/':
    • (AIDASite named: 'mysite') urlResolver defaultURL: '/' forObject: (AIDASite named: 'mysite') siteContent firstPage
  12. Open your site to public by setup access rights to allow Guest users view access to both App classes:
    • go to security settings of your website by manually entering URL: http://www.aidaweb.si/security.html
    • go to Users, click Guest and Access rights
    • find and click AidaWebContentApp and click all views YES
    • find and click AidaWebPageApp and click all views YES