Cover 1 Copyright 3 Credits 4 About the Author 5 About the Reviewer 6 www.PacktPub.com 7 Table of Contents 8 Preface 12 Chapter 1: Joomla! Template System 18 What is Joomla! template? 19 Templates – download for free, buy, or build your own 20 Free templates 21 Premium templates 23 How to earn money per sale 25 Conclusion 25 Identifying templates 26 Investigating design solutions 28 Introducing the Joomla! Template Manager 28 Exploring the default templates 29 Installing a new template 29 Unload a package file 29 Typical errors during template installation 30 Changing your default template 33 Customizing the current template 33 Changing the template used for specific menu items 35 Removing unnecessary templates 37 Summary 38 Chapter 2: Joomla! Template Frameworks 40 Understanding template framework 40 Exploring reasons to use a framework 41 Useful framework features 43 Learning different frameworks 44 Exploring popular Joomla! Version 3 template frameworks 44 Expose framework 4 44 The Gantry framework 45 The Gavern framework 46 The HD framework 48 The S5 Vertex framework 48 The Shaper Helix II framework 50 The Sparky framework 50 The Strapped framework 52 The T3 framework 52 The Warp 6 framework 53 The Wright framework 54 The YJSG framework 55 The past and future of frameworks 55 Summary 57 Chapter 3: Building a Template from a Framework 58 Web-design trends 59 Back to basics – minimalistic designs 59 HTML5 and CSS3 60 Replacing Flash with HTML5 and JavaScript 60 Responsive web design (RWD) 61 One page and parallax effect 62 Fixed and scrolling header bars 62 Slideshows – responsive and touch-friendly 63 Swiss design style 63 Large photos as backgrounds 63 App-style web interfaces 64 Flat design and colors 64 Web and big fonts 66 UX direction 66 Social media integration 66 What the future will bring 66 Setting client expectations 67 If you can imagine it, you can wireframe it 69 Home page 72 Required tools 72 The basic elements of a Joomla! template 74 Building a template based on framework 78 Choosing a template framework 78 From zero to warp 79 Joomla! 3.x templates and LESS 80 Even comics have text content 80 Show me your badge – start with logo 81 Picture in background 81 Navigation 82 Layout and backgrounds 84 Social buttons 87 Slideshow 87 Modules on the left side 87 Modules on the right side 87 Modules at the bottom 89 Summary 91 Chapter 4: Advanced Template and Styling Tricks 92 Constructing a template 92 Overriding the default layout 92 Adding a custom stylesheet 95 Using custom CSS 96 Module variations 96 Icons in menu items 97 The fixed navigation bar 98 Adding and changing the favicon 99 Modules and plugins 100 Frontend news display 101 Tabs and accordions 102 Slideshow 103 The parallax content slider 104 Responsive maps 105 Shortcodes 105 Advance hover effects 105 Typography tips 106 Adding a custom font 107 Dingbats fonts 109 Font awesome 109 Colorful notice styles 110 CSS generated content 113 Listing bullets with images 114 Kerning 116 Appending ellipsis automatically 116 Reducing the number of images 117 Summary 118 Chapter 5: Selling Your Template 120 Are you ready to sell? 120 Validate, optimize, and test your templates before, not after 120 You are selling much more than a template 122 Images and graphics in a template 123 Support insert an en dash questions requires answers 123 Pricing your templates 124 How to hide the real price and earn more 124 Sale by piece or temporary access 125 The magic of prices that end with 99 125 Online template selling tips 126 Give one thing for free, and they will buy the rest 126 Designing to suit their needs 127 The web design that works 128 Template color variations 129 Localization and fonts 129 Potential buyers 130 Showing off technology 130 Support for extensions 130 Do not be greedy and do not lie 130 Sell twice 131 Where and how to sell it 131 Summary 132 Index 134 Create modern, professional templates using the template framework for Joomla! 3.x **Overview** * Improve the usability of Joomla! Template Manager by installing and enabling a downloaded template, changing the logo, and adding a slogan * Set up a workflow and development environment for Joomla! template design * Create custom templates for that unique website look **In Detail** Joomla! is a free and open source content management framework for publishing web content. A Joomla! template is a multifaceted Joomla! extension which is responsible for the layout, design, and structure of a Joomla! powered website. Modern Joomla! 3 frameworks use the responsive layout based on Twitter's Bootstrap framework and its collection of utility classes to provide a great degree of flexibility for responsive web design. This practical, hands-on guide will walk you through clear, step-by-step instructions to help you build your very own custom Joomla! template. Find out what steps you need to take to sell your template and learn some extra tips and tricks to make your templates stand out and improve the overall look of your website. This example-oriented tutorial will show you how to quickly and painlessly create websites on your own and give them a professional look. You will begin by developing an understanding of how Joomla! templates work, how to install new ones, and how to configure them. You will also master the Joomla! template framework, which can be used as a foundation for creating your own templates. Having gained this insight, you will then begin building your own template from scratch. Advanced styling tricks and tips that will give your websites a unique look are also covered. Finally, you will learn how to modify an existing template to meet your own needs and prepare your Joomla! template for sale. **What you will learn from this book** * Utilize the Joomla! Template Manager * Create custom templates based on the Joomla! template framework * Override the default layout * Prepare your Joomla! template for ease of sale * Modify an existing template * Add arresting CSS3 effects * Employ custom style sheets in templates * Present news and images using modules **Approach** Using this hands-on, step-by step tutorial filled with practical examples, the readers will be able to create beautiful templates and themes for your websites that will make them stand out from others. **Who this book is written for** This book is written for all of you who wish to create your own unique templates for Joomla! 3.x. This book can be used by Joomla! administrators or visual designers (with no programming experience) or those of you who are used to working with common web developer tools like HTML/CSS editors for coding purposes. You would need basic knowledge of Joomla! and some knowledge of CSS and HTML.
In Detail
Joomla! is a free and open source content management framework for publishing web content. A Joomla! template is a multifaceted Joomla! extension which is responsible for the layout, design, and structure of a Joomla! powered website. Modern Joomla! 3 frameworks use the responsive layout based on Twitter's Bootstrap framework and its collection of utility classes to provide a great degree of flexibility for responsive web design.
This practical, hands-on guide will walk you through clear, step-by-step instructions to help you build your very own custom Joomla! template. Find out what steps you need to take to sell your template and learn some extra tips and tricks to make your templates stand out and improve the overall look of your website.
This example-oriented tutorial will show you how to quickly and painlessly create websites on your own and give them a professional look. You will begin by developing an understanding of how Joomla! templates work, how to install new ones, and how to configure them. You will also master the Joomla! template framework, which can be used as a foundation for creating your own templates. Having gained this insight, you will then begin building your own template from scratch. Advanced styling tricks and tips that will give your websites a unique look are also covered. Finally, you will learn how to modify an existing template to meet your own needs and prepare your Joomla! template for sale.
Approach
Using this hands-on, step-by step tutorial filled with practical examples, the readers will be able to create beautiful templates and themes for your websites that will make them stand out from others.
Who this book is for
This book is written for all of you who wish to create your own unique templates for Joomla! 3.x. This book can be used by Joomla! administrators or visual designers (with no programming experience) or those of you who are used to working with common web developer tools like HTML/CSS editors for coding purposes. You would need basic knowledge of Joomla! and some knowledge of CSS and HTML.
