You choose the framework and extension for your new website project and actually all is set. The designer sends you some Photohop files with new design.

I tried to find online some instruction what are the best first steps to implement the design in Joomla, but i didn't find any.

How do you start your project? Do you first make a plain HTML site with all the features needed (with JS and CSS stuff) or do you start implementing the design directly to a Joomla template?


I like to use zurb foundation as my base, and as Joomla 3.X is coupled with bootstrap – this is my process:

  1. design homepage in photoshop/XD
  2. build a custom static html site using foundation (eg homepage). I prefer this approach as I don't need to think about php or entering content. I have started to use avocode to speed it up the XD to code conversion.
  3. Then I start to build the joomla template from scratch - I have studied or used as a base:

  4. Work out the module positions that you want in your template: http://docs.joomla.org/Module_positions - you could have module positions for example:

    • header
    • left
    • right
  5. Put the module positions in your .xml template file
  6. I use JS CSS Control plugin to ensure that bootstrap/jquery etc are removed: https://extensions.joomla.org/extension/js-css-control/ as some components force bootstrap inside
  7. Use Joomla overrides for components/modules in template: http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core
  8. Use a CCK - so the client doesn't have to worry about code. I like FLEXIcontent.

Not the answer you're looking for? Browse other questions tagged or ask your own question.