JoomlaPraise: A template contest entry from Pixel Praise.
To all of those who waited for this thank you for your patience. Please see our tutorials section on what we updated and how to use the Front End Control Panel
A special thanks to Digital Gray for all of their help on the template!
Demo Site: http://joomlapraise.com
Download Template with Frontend Control Panel Here: http://joomlapraise.digital-gray.com/pp_joomlapraise.zip
Download Template without Frontend Control Panel Here: http://joomlapraise.digital-gray.com/pp_joomla.zip
Brief History and Template Parameters
Although the history of the template has been very short lived, it has gone through some extensive changes.
We are still devoted to keeping things truly simple for those who aren't extremely savvy using the Joomla! system, but we've added some features and answered some requests in this very strong update.
As some of you already know, we chose this specific layout based on our current layout of the Pixel Praise website. Many will ask why we chose to use the same layout as our business website. The answer is easy. We have had an overwhelming number of compliments and permission requests to use our design and layout so we wanted to give back to the Joomla! community.
Unlike the Pixel Praise template, the JoomlaPraise template has a few more features.
- Collapsible User Positions
- Ability to change the Header Styles
- Ability to change the Background Theme
- Custom color options
- Choice of showing and not showing the Large Top Banner
- Custom banner upload from the frontend
Some of you also already know the overall design of the JoomlaPraise template is a fairly simple one. Our idea was to make a template that wasn't too flashy and over-the-top. We came up with this lightweight design to ensure a number of websites could use this template without having to modify too many things or getting confused and overwhelmed with a large array of parameters. At Pixel Praise our motto has always been to keep things simple and that's exactly what we are trying to do.
Frontend Control Panel
The frontend control panel is a new addition that allows more usability for the template and is only present on the site when logged in as Super Administrator.
You can now customize:
- Parameters from the front end
- Custom banner images assigned to menu items
- Replacing the logo, bullet, and blockquote images
You'll notice on the backend that we now have fourteen parameters, as opposed to the four we had before.
- Template Foreground Color: This has two default options. White and Black for those who aren't confident enough for custom parameters.
- Background Theme: This controls the color of the background and the gradient image that reapeats.
- Header Styles: This controls the color of the H1/componentheadings and H3/moduletable headers.
- Template Width: This controls the width of your template. You have the choice of 760px 960px and a Fluid width.
- Show Component: This controls whether or not the mainbody is displayed.
- Show Banner: This controls whether or not the large banner image is displayed.
- Switch Layout: Choosing yes on this parameter with switch the layout of the site. Instead of the Menu Modules being on the right, you have the option to place them on the left in a more conventional layout.
- Custom Background Color: This field allows you to change the background color to whatever you wish. Make sure you don't type a # sign before your hexadecimal color.
- Custom Header Color: This field allows you to choose a custom heading color. This will change the color of the h1/componentheading/h3 classes.
- Custom Primary Color: This parameter allows you to change the foreground color of the template. There are two default options above in the Template Foreground Color.
- Custom Secondary Color: This field changes the color of the embelishments of the site. This is where the light gray areas are in the default install.
- Custom Font Color: This parameter allows you to change the font color of the site. In cases where your Custom Foreground Color is too dark you would use this field to lighten your font color.
- Custom Link Color: This field will function like the Custom Font Color parameter. You can choose a custom hexadecimal color here.
- Custom Link Hover Color: This controls the hover action on all links.
It's a lot to take in at first, but once you get the hang of it the parameters seem very useful if you want to create several sites using this template.
Why It's Better
Before we started making changes we looked through our comments and suggestions made on the Joomla! forums. After filtering through those we decided to make extreme changes to the template in order to accommodate the many suggestions without becoming over complicated.
Number One: We wanted to take advantage of the Joomla! over-ride features. Making the template more accessible means that the template could be more flexible and easier to use for some. We dove feet first into overriding some of the components and modules that featured a table. We also optimized for seo using h1 h2 and h4 headers. We hope that this will contribute to eventual table-less websites for future Joomla! releases.
Number Two: PNG Transparencies. This was a bugger of a problem when we received a post exclaiming that our transparent png files were a bit off in IE. Apart from writing a letter to Microsoft we decided it was best to fix this. We integrated a pngfix solution in /templates/joomlapraise/js/pngfix.js
Number Three: We found that more users needed a flexible layout system than the previous submission. Not only did the template have only one width, it also did not provide custom color options. We've fixed this in the parameters of the template. Now we allow for three variable widths. Custom foreground, background, banner, header, font, and link colors are available as well. You can see how to use these to your advantage in the tutorials section of this demo site.
Number Four: Custom Banner options. The banner implementation we used on the older template worked great for simple sites, but what about more complicated ones? How do you put a different banner on each page? After all not many sites use the Frontpage banner for every page. Some were asking about sub banner images. We've solved this by making a custom module that is integrated with the template from the frontend. You can now upload custom images and assign them to menu items...all from the frontend.
For more information on how to change these parameters, see our tutorials section.
