HOW TO: let users switch skins/color schemes
Ok this mod can be seen in action at www.madtech.org. Basically what it does is let the user set a small cookie which you can then use to load specific css file and graphics. I will show how it is implemented on my website, it is a very specific example but this mod is easily manipulated to fit your needs. The whole hack took me about 6 hours to perfect, it has been working great since (about 2 weeks).
First off, we edit [/skin1/customer/home.tpl]. Below 'd' in skin_d.conf stands for default, I suggest you rename skin1.conf to skin_d.conf to make things easier. Code:
{ config_load file="$skin_config" } Code:
{if $smarty.cookies.skin} {config_load file="skin_`$smarty.cookies.skin`.conf"} If you want the skins to also apply to the administration section of your site, repeat the above step to [/skin1/single/home.tpl], else move on. Ok I put the skin selection into head.tpl, making it appear on every single page. You are free to put the following piece of code where ever the hell you want, it will not make a difference, but may be harder to find by your customers. So this from my [/skin1/head.tpl]. Just put it anywhere, and delete any unneeded colors/options. Code:
<FORM action="{$smarty.server.REQUEST_URI}" method=POST name=skin_form> Now we have the switch utility in head.tpl, but switching won't do anything... yet. I chose the following file because it is loaded in EVERY SINGLE php, which is essentially what we want. We want the user to be able to switch skins from ANYWHERE on the site, and it beats editing every single php and inserting the code... so if anyone thinks it is a problem that I put it here, let me know. I don't see it being any harm though. What this code does is write the cookie, it expires after a year, which is plenty of time. Insert the following piece of code into [/customer/auth.php]. Just insert it right after the copyright statement and you won't run into problems. Code:
if($_POST["skin"]){ OK we are almost there. So far you will be able to select a skin, have the cookie written and then have the correct css file loaded. Everything should work except that the dialogs and site logos are still the default color. If you want them to stay the same then don't bother with the below, but if you do want to load a different dialog picture or logo just follow the example below. For skinned graphics, just rename the default to filename_d, in this case rename the default bg_dialog.gif to bg_dialog_d.gif. Ok this example is for [/skin1/dialog.tpl] but can be applied on any graphic loaded. The original code in [/skin1/dialog.tpl] goes like this: Code:
<TD height="20" class=DialogTitle background="{$ImagesDir}/dialog_bg.gif" valign=bottom>{$title}</TD> So the snipet above should now look like this: Code:
<TD height="20" class=DialogTitle background="{$ImagesDir}/dialog_bg_{if $smarty.cookies.skin}{$smarty.cookies.skin}{else}d{/if}.gif" valign=bottom>{$title}</TD> I'm a PHP/Smarty newbie (before I started working with X-Cart about a month ago), so I'm very proud of this mod that I made. What do you guys think? Any suggestions on what could be done better? If you're using this hack on your site, please reply with a URL so others can see more examples. Cheers ;) |
:D Good Work! Sweet mod! I Look forward to playing with this some, perhaps not letting the user set the skin, but perhaps expanding the selection of skin to be used based on day of the week, a holiday or something to that effect.
Continue your efforts, much success with your shop! Regards, Glen |
All times are GMT -8. The time now is 06:38 AM. |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.