History of StylistPackage

Comparing versions
Version 3Current version

My Site Stylist

my site stylist is a configurable graphical user interface to modify (perhaps even create) new themes.

note: this package is still in developement and certain aspects are nowhere near completion :)


now it's possible to select the style you want to edit rather than just picking the one that is being displayed
it's not required to use the GUI. you can use edit the css file using a massive textarea

features and items available

  • admin area allows users with permissions to add/remove elements and modify definable properties that can be set for these
  • relatively simple to work with and allows basically full customisation of the site if you take the time to add all classes, tags and ids to the list of editable items.
  • it's possible to customise a css file that is visible globally for all users using that particular theme
  • in addition every user can have his/her own css file that is only applied when that user calls that theme
    • ideally this file should be visible if the style is applied to the individual area
    • basically:
      • user selects his/her favorite theme for his/her user area
      • user customises his/her favorite theme
      • user applies modifications to his/her user area
      • customisation is visible to every user accessing his/her user area
  • it is possible to manage images in all these customisations making my site stylist quite flexible and powerful

this is a brief log of things that have been done and will be done
gui related
form is collapsable at every element to save space
individual and unified settings for borders and margins available
admin area is now
  • sortable
  • searchable
  • pagination
link to view original file is available
  • for simplicity reasons, i think it's better if the original file isn't directly modified (or copied and modified) but custom settings are loaded later resulting in overwriting of original css settings

data related
form submission results in easy to manage variables, similar to css syntax
individual form buttons work (still submit full form - should be fixed at some point)
final submit button for entire form is working as well
read css file and
  • create array of classes
  • pass all variables to form and populate it
  • create css file from date generated in form
classes, ids and tags have appropriate column settings in table since . and # conflict php varibles
array structure
$css_elements = array(
'tag' => array(
'body' => array( 'border','margin','font','background' ),
'table' => array( 'border','margin','font','background' )
'id' => array(
'class' => array(
on the admin page

permissions and preferences that are available
tiki_p_admin_stylistobvious as well
tiki_p_edit_globaluser has rights to edit the global css
upload_style_imagesleads to the fact that 'background' can't be set by users without this perm
copy_style_imagescan't copy images from original image folder to custom folder
apply_style_globallyallows user to apply his/her modifications globally for the given theme

max_file_sizeset MAX_FILE_SIZE for image upload
ignore_max_file_sizeignore the above setting and set it to 100MB
use_color_pickershould we use the color picker popup window?

custom css files that are created
  • global css files are stored in the storage directory
  • private css files are stored in the individual storage folder

  • when you use the stylist the file created is in
    • <style>/custom.css
  • when editing the css file without stylist, the file is called
    • <style>/<style>.css

order of loading css files is
  • base.css
  • <style>.css
    • first check if user has <style>/<style>.css --> continue with loading <style>_<browser>.css
    • then check if there is a global version of <style>/<style>.css --> continue with loading <style>_<browser>.css
    • finally load original <style>/<style>.css --> continue with loading <style>_<browser>.css
  • <style>_<browser>.css
    • this is a css file that is loaded in addition to <style>.css if <browser> matches the client browser
  • custom.css
    • first load custom.css found in the global storage directory
    • then load custom.css found in individual storage area


My Site Stylist

my site stylist is a configurable graphical user interface to modify (perhaps even create) new themes.


admin area

the admin area allows you to define what tags, classes and ids can be modified by users using the stylist. this allows the admin total control over how much can be modified.
e.g. if you don't want the users to change the banner you have put up, don't allow users to change the settings for #tikitop.
in addition it's possible to define what properties can be set.

original files are never modified

stylist doen't modify any of the original files but either creates new files that are loaded in addition to the original <style>.css file (when you use the graphical user interface(GUI)) or it creates a copy of the original file that is loaded instead of the original <style>.css file.

global style modifications

depending on your permissions it is possible to create global css files. the global css modifications you make (be it with or without the GUI) are visible to all users using that particular theme.


stylist allows you (depending on the settings in the admin section) to upload your own images and thus customise the feel for your site without actually having to touch the css file directly or the need of ftp.


it is possible to work on any style that is available without having to change the theme set in your preferences. to simply this task, it is possible to preview the style you are working on and thus see all changes you make after every time you save the modifications you have made.

personal style manager

there is an integrated custom style manager which gives you an overview of all styles you have already modified and what images are available for every one of them. also, you have the option to delete custom modifications if you wish to do so.

permissions and preferences that are available


tiki_p_admin_stylistuser has the right to set tags, ids and classes that can be modified by other users
tiki_p_edit_globaluser has rights to edit the global css
tiki_p_edit_cssuser can edit a copy of the original css file using a textarea. the user has no constraints on what the css file contains
tiki_p_use_stylistif the user is allowed to use the stylist at all
tiki_p_no_max_file_sizeuser isn't bound to the preference set in max_file_size


max_file_sizeset MAX_FILE_SIZE for image upload (if not set, or tiki_p_no_max_file_size is set) it defaults to 10MB
use_color_pickershould we use the color picker popup window?

theme selection restrictions

the admin always has control over what themes users can pick, and when these can be displayed.
1user can pick a theme for his/her homepage. this setting takes precedence over all settings.
2it is possible to pick a theme based on a category.
3user can pick a theme to view the entire site using a particular theme.
4theme control module.
5global theme setting for entire site.

loading of css files - full listing

1base.cssthemes/this is always loaded and helps functionality of site
2<style>.cssstorage/users/<user_id>%1000/<user_id>/themesif found, continue with # 3
storage/themesif found, continue with # 3
themes/<style>if found, continue with # 3
4custom.cssstorage/users/<user_id>%1000/<user_id>/themeslast file
storage/themeslast file
Page History
23 Feb 2005 (04:57 UTC)
Current • Source
View • Compare • Difference • Source
View • Compare • Difference • Source
View • Compare • Difference • Source
View • Compare • Difference • Source
View • Compare • Difference • Source
View • Compare • Difference • Source
View • Compare • Difference • Source