Create Your Own Theme

8/8/2019 Create Your Own Theme

http://slidepdf.com/reader/full/create-your-own-theme 1/4

Create Your Own Multi-Themed Xoops Site

Date 2005/5/12 11:20:33 | Topic: Themes

You may have noticed some Xoops users are using multiple themes on their sites. The themechanger module by suin willhelp you change themes per modules. This tutorial provides a different and simpler way of changing themes.

The best way of illustrating it is by showing an example. The following steps are what we did for our site.

Goal

In our example, we want to accomplish the following:

Main theme, let call it themeA, for the siteThemeB, for the module newbb (Forums)

Users visiting our site will see ThemeA, and they will see ThemeB by clicking on Forums.

Create a Switching or Directing Theme

The theme to be used as default on our site should be able to tell Xoops to retrieve matching theme for the module selected.

With this in mind, we created a theme.html file with the following:

<{php}>

$mod = $GLOBALS['xoopsModule'];

$dirname = (isset($mod) ? $mod->getVar('dirname') :'system');

if ($dirname == 'newbb') {$theme='ThemeB';

} else {

$theme='ThemeA';

}

$this->assign('themename', $theme.'/theme.html');

$this->assign('xoops_theme', $theme);

$this->assign('xoops_themecss', XOOPS_URL.'/themes/'.$theme.'/style.css');

$this->assign('xoops_imageurl', XOOPS_URL.'/themes/'.$theme.'/');

<{/php}>

<{include file="$themename"}>

Create a New Theme

We created a new theme call Multi (you can name it to whatever you wish) under the theme directory - use either a FTPclient or mkdir shell command.

We uploaded the newly created theme.html file into Multi theme directory. Also we uploaded the style.css file fromThemeA to the Multi directory.

Please note that style.css is not required to make your multiple themes work. Without it, all the java popup windows will notlook very nice, as they can’t find a suitable style.css file under Multi theme. Javascript popup windows will only look for

Page 1 of 4Xoops Tips - Themes - Create Your Own Multi-Themed Xoops Site

10/21/2010http://xoops-tips.com/modules/news/print.php?storyid=89



the style.css file under the default theme (Multi), and not under individual themes.

Enable Multiple Themes

We then went to Preferences and General Settings: selected Yes for updating theme files and selected Multi as the defaulttheme.

Viola, we have a multi-theme site. If you have followed the steps and have not made typos and other mistakes, now youshould have a multi-themed Xoops Site.

Little TIP in Testing New Themes Open a new browser window and go into General Settings and keep browser open then go back to you previous workingbrowser to change your theme. Once you have enabled the new theme, if something goes wrong and you can’t get back tothe original theme, use the spare (backup) browser window to reverse back to your old theme.

Customization

If you don’t want to be as dramatic as we purposely show on this site, you could modify your main theme and use themodified versions for the modules of your choice. Things you can do: change header image, different style sheet (such

different menu colors for different modules) … Your imagination is the limit on what you can do.

We will show two additional example you can do is to customize your themes.

Page 2 of 4Xoops Tips - Themes - Create Your Own Multi-Themed Xoops Site

10/21/2010http://xoops-tips.com/modules/news/print.php?storyid=89





Documents

Create Your Own Theme