This Document aims to be used internally & updated and ultimately, published to all external designers.

General

  • Themes should be W3 compliant. Both markup and styles
  • Javascript Libraries, Plug-ins (slideshows, lightboxes, etc) should always be keept updated. If possible on the latest stable release version.
  • Inline CSS should be avoided and passed to one or more css assets
  • Javascript and CSS should be deferred to the footer.

Theme Blocks

Layout Block

  • If only 1 language per store, language menu should not be displayed
  • Display at least 3 category levels (Category > Sub-category > Sub-sub-category)

Home Block

  • Feature products Slideshow should be limited to 3-5products otherwise it greatly increases the loading time of all imagery

Category Block

  • Avoid printing product.description for performance and CSS problems due to the HTML support of Product's Description.

Product Block

  • Display multiple Product images
  • Allow Customer to select a purchase quantity
  • Display Product Price, Stock and SKU
  • Display Product Custom Fields if available
  • Display Product Attachments if available (and Product isn't Virtugal)
  • Display Product Options if available
  • Display Product Discounts if available
  • Control Product status logic ( p.e. display 'add to cart' button only if status is available)

Cart Page

  • Taxes should be hidden if value is zero
  • Promotion should be hidden if value is zero

Checkout Block

  • Support Custom Checkout Fields

Review Order Block

  • The Ordered Products (product name, quantity ordered) and Order Totals (Order Subtotal, Order Discount, etc) should be displayed.
  • Updating Cart properties should be avoided (no product quantity update, product delete, etc).
  • Links to the Product Page should be avoided.
  • Shipping (if available) and Billing Information should be displayed. ###Success Block
  • A success or unsuccess message (p.e. 'Thanks for you purchase') should be displayed
  • The Order Number ``should be displayed.
  • The Shipping Information and Payment Information should be displayed.
  • If Customer Login is optional, the Customer Create Password form should be displayed. ###Page Block
  • Page should handle correctly p, ul, li, div, img, other usual HTML tags and embeded videos.
  • Page should handle correctly very width images.

Search Block

  • At the Search Results page, apart from a gallery of products, display: the search query, the number of results

Other

Theme Options

  • Prefer using complete URLs for Twitter/Facebook/etc and avoid creating a logic with usernames and account IDs.
  • If no Twitter/Facebook/Email etc URL given do not display the Theme Option.

Images

  • All images should be resized for a proper image size & load time. Including main product image
  • "Resize" should always be favoured to "Thumb"
  • All images should have both a ALT and Text tag
  • If no image, display a placeholder with instructions to upload images

Code

  • HTML code should be indented using our Editor shortcut keys: Select All (Ctrl + A) and Shift + Tab

Translations

  • Non ending text, like full stops (.) or colons (:) should be outside of translation strings. {% Sorty by %}:
  • Themes should be fully translated in our main languages before publish at https://jumpseller.com/translate/
  • Translations should be thought to benefit the final customer. e.g. no need to translate merchant help strings: "This product has no image"

SEO

  • At Home Page, Store's Name should be H1, Store Description should be H2 and Product's Names should be H3
  • At Category Page, Category's Name should be H1, Product's Name should be H2 and Product's Description should be H3.
  • At Product Page, Product's Name should be H1, Product's Description should be H2
  • Follow general SEO Web Design Guides like: http://webdesign.tutsplus.com/articles/seo-articles/seo-checklist/