Designer Guide

preview.jpg file: Once your design is complete, you can create the
preview image file. Take a screen shot, then resize it to 180px width in
order to use it instead of the default preview.jpg file. You can either used
the screenshot tool provided by your OS (Windows' Snipping Tool, OS X's
Cmd+Shift+4 key combo), or install a browser extension, such as
Firefox's FireShot or Screengrab.
Integration: where the hooks and modules are
One of the key point of integrating content within a PrestaShop theme is
to know where said content is displayed, and therefore where the various
hooks and modules are located.
Here is a graphical representation of where they are, for each page. You
will find:
 The name of the block.
 The block's id, in order to target it with CSS.
 The block's folder or template file, if you need to make changes to
it.