How to Develop Themes
This article is about developing PayPlans Themes. If you wish to learn more about how to developing Themes, review Using Themes. This topic differs from Using Themes because it discusses the technical aspects of writing code to build your own Themes rather than how to activate Themes or where to obtain new Themes.
Theme Stylesheet
A theme is a structured template, written in a markup language called Cascading Style Sheets (CSS), that controls the appearance and graphical layout of a page. If you make your own Theme, create theme directory in components/com_payplans/media/themes or components/com_payplans/media/premium_themes (exist if you use premium payplans kit) directory, they are default location of payplans themes. You can use any direct from these for creating own themes. First you create .css file, that have same name which you given to directory and create theme.xml for theme descccription and detail of theme. payplans load your theme using theme.xml so ensure the file is correct, For getting some idea you can refer other theme xml.
Writing theme stylesheet
Befor start writing css you should know basics which is followed by PayPlans, PayPlans themes contain only color properties for different templates. PayPlans theme use hierarchical structure for applying css properties on templates elements.Payplans have two color properties primary and secondary. for example you want to change your heading color so you change primary color like:
div#payplans .pp-primary.pp-color {
color: #ef723b;
}
This use for font color if you want to change border color and background color so you can use the same procedure for both. for example you want to create primary color so can use this procedure:
div#payplans .pp-primary.pp-color {
color: #ef723b;
}
div#payplans .pp-primary.pp-border {
border-color: #ef723b;
}
div#payplans .pp-primary.pp-background {
background: transparent;
}
