1. Steps to create a new color style in SA Template
Example: you can create a new color style such as Black
*** For yt framework j25
a) go to "templates\yt_framework\templateDetails.xml", finding:
<field name="sitestyle" type="list" default="blue" label="SITE_STYLE_LABEL" description="SITE_STYLE_DESC">
<option value="purple">Purple</option>
<option value="blue">Blue</option>
<option value="green">Green</option>
<option value="red">Red</option>
</field>
=>
<field name="sitestyle" type="list" default="blue" label="SITE_STYLE_LABEL" description="SITE_STYLE_DESC">
<option value="purple">Purple</option>
<option value="blue">Blue</option>
<option value="green">Green</option>
<option value="red">Red</option>
<option value="black">Black</option>
</field>
b) go to "templates\yt_framework\css\color\color.xml", finding:
<sitestyle>
<blue>
<filestyle>blue</filestyle>
</blue>
<red>
<filestyle>red</filestyle>
</red>
<green>
<filestyle>green</filestyle>
</green>
<purple>
<filestyle>purple</filestyle>
</purple>
</sitestyle>
=>
<sitestyle>
<blue>
<filestyle>blue</filestyle>
</blue>
<red>
<filestyle>red</filestyle>
</red>
<green>
<filestyle>green</filestyle>
</green>
<purple>
<filestyle>purple</filestyle>
</purple>
<black>
<filestyle>black</filestyle>
</black>
</sitestyle>
c) go to "templates\yt_framework\css\color" folder, copy an existing color file and rename it to black.css
d) change the content of black.css file according to your mean
e) you can choose the color style in the cpanel on fronend or Style Settings in the template configuration.
*** For Sj Joomla3 template
a) go to "templates\sj_joomla3\templateDetails.xml", finding:
<field name="sitestyle" type="list" default="blue" label="SITE_STYLE_LABEL" description="SITE_STYLE_LABEL">
<option value="blue">Blue</option>
<option value="red">Red</option>
<option value="green">Green</option>
<option value="gray">Gray</option>
</field>
=>
<field name="sitestyle" type="list" default="blue" label="SITE_STYLE_LABEL" description="SITE_STYLE_LABEL">
<option value="blue">Blue</option>
<option value="red">Red</option>
<option value="green">Green</option>
<option value="gray">Gray</option>
<option value="black">Black</option>
</field>
b) go to "templates\sj_joomla3\includes\cpanel.php", finding:
<div class="inner clearfix">
<span title="Red" class="theme-color red<?php echo ($yt->getParam('sitestyle')=='red')?' active':'';?>">Red</span>
<span title="Green" class="theme-color green<?php echo ($yt->getParam('sitestyle')=='green')?' active':'';?>">Green</span>
<span title="Blue" class="theme-color blue<?php echo ($yt->getParam('sitestyle')=='blue')?' active':'';?>">Blue</span>
<span title="Gray" class="theme-color gray<?php echo ($yt->getParam('sitestyle')=='gray')?' active':'';?>">Gray</span>
</div>
=>
<div class="inner clearfix">
<span title="Red" class="theme-color red<?php echo ($yt->getParam('sitestyle')=='red')?' active':'';?>">Red</span>
<span title="Green" class="theme-color green<?php echo ($yt->getParam('sitestyle')=='green')?' active':'';?>">Green</span>
<span title="Blue" class="theme-color blue<?php echo ($yt->getParam('sitestyle')=='blue')?' active':'';?>">Blue</span>
<span title="Gray" class="theme-color gray<?php echo ($yt->getParam('sitestyle')=='gray')?' active':'';?>">Gray</span>
<span title="Black" class="theme-color black<?php echo ($yt->getParam('sitestyle')=='black')?' active':'';?>">Black</span>
</div>
c) go to "templates\sj_joomla3\includes\bottom.php", finding:
$('.theme-color.gray').click(function(){
$($(this).parent().find('.active')).removeClass('active'); $(this).addClass('active');
createCookie(TMPL_NAME+'_'+'sitestyle', $(this).html().toLowerCase(), 365);
templateSetting(array_gray);
onCPApply();
});
=>
$('.theme-color.gray').click(function(){
$($(this).parent().find('.active')).removeClass('active'); $(this).addClass('active');
createCookie(TMPL_NAME+'_'+'sitestyle', $(this).html().toLowerCase(), 365);
templateSetting(array_gray);
onCPApply();
});
$('.theme-color.black').click(function(){
$($(this).parent().find('.active')).removeClass('active'); $(this).addClass('active');
createCookie(TMPL_NAME+'_'+'sitestyle', $(this).html().toLowerCase(), 365);
templateSetting(array_gray);
onCPApply();
});
d) go to "templates\sj_joomla3\css\color" folder, copy an existing color file and rename it to black.css
e) change the content of black.css according to your mean
f) you can choose the color style in the cpanel on fronend or Style Settings in the template configuration.
2. Steps to add font to the font list in Template Admin
Example: you can create a new font family such as Garamond
a) go to "templates\yt_framework\templateDetails.xml", finding:
<field name="font_name" type="list" default="arial" label="FONT_NAME_LABEL" description="FONT_NAME_DESC" >
<option value="arial">Arial</option>
<option value="arial-black">Arial Black</option>
<option value="courier">Courier New</option>
<option value="georgia">Georgia</option>
<option value="impact">Impact</option>
<option value="lucida-console">Lucida Console</option>
<option value="lucida-grande">Lucida Grande</option>
<option value="lucida-sans">Lucida Sans</option>
<option value="palatino">Palatino</option>
<option value="tahoma">Tahoma</option>
<option value="times">Times New Roman</option>
<option value="trebuchet">Trebuchet</option>
<option value="verdana">Verdana</option>
</field>
=>
<field name="font_name" type="list" default="arial" label="FONT_NAME_LABEL" description="FONT_NAME_DESC" >
<option value="arial">Arial</option>
<option value="arial-black">Arial Black</option>
<option value="courier">Courier New</option>
<option value="georgia">Georgia</option>
<option value="impact">Impact</option>
<option value="lucida-console">Lucida Console</option>
<option value="lucida-grande">Lucida Grande</option>
<option value="lucida-sans">Lucida Sans</option>
<option value="palatino">Palatino</option>
<option value="tahoma">Tahoma</option>
<option value="times">Times New Roman</option>
<option value="trebuchet">Trebuchet</option>
<option value="verdana">Verdana</option>
<option value="garamond">Garamond</option>
</field>
b) go to "templates\yt_framework\includes\cpanel.php", finding:
$fontfamily = array(
'Arial'=>'arial',
'Arial Black'=>'arial-black',
'Courier New'=>'courier',
'Georgia'=>'georgia',
'Impact'=>'impact',
'Lucida Console'=>'lucida-console',
'Lucida Grande'=>'lucida-grande',
'Palatino'=>'palatino',
'Tahoma'=>'tahoma',
'Times New Roman'=>'times',
'Trebuchet'=>'trebuchet',
'Verdana'=>'verdana'
);
=>
$fontfamily = array(
'Arial'=>'arial',
'Arial Black'=>'arial-black',
'Courier New'=>'courier',
'Georgia'=>'georgia',
'Impact'=>'impact',
'Lucida Console'=>'lucida-console',
'Lucida Grande'=>'lucida-grande',
'Palatino'=>'palatino',
'Tahoma'=>'tahoma',
'Times New Roman'=>'times',
'Trebuchet'=>'trebuchet',
'Verdana'=>'verdana',
'Garamond'=>'garamond'
);
c) you can choose the font-family in the cpanel on fronend or Style Settings in the template configuration.
3. Steps to add new layout to Default Layout list
Example: you can create a new layout such as my-layout
a) go to "templates\yt_framework\layouts" folder, creating my-layout.xml file and change its content similar to other layout files:
* go to "templates\yt_framework\includes\cpanel.php", finding:
$layouts = array(
'left-main',
'main-right',
'full',
'left-main-right',
'left-right-main',
'main-left-right'
);
=>
$layouts = array(
'left-main',
'main-right',
'full',
'left-main-right',
'left-right-main',
'main-left-right',
'my-layout'
);
b) you can choose the my-layout in the cpanel on fronend or Layout Settings in the template configuration.