Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Themes /

Discuss SilverStripe Themes.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

How do we have two themes on our site?


Go to End


4 Posts   3205 Views

Avatar
HilaryB

Community Member, 11 Posts

29 May 2010 at 4:05am

We have developed a site with our own theme which is in the themes folder. We have now been asked to do a new section of the site with a totally different look and feel - ie a new theme is needed.

I have tried setting up a new module (our existing classes are in a module but the design is under themes) with a Page.ss and a Layout/MynewPage.ss, but whilst the layout template works the page is still rendered with the original outer Page.ss template not my new one. I then tried to move the original one from the theme to the existing module and flushed the template to see if that would work, but it didn't.

We will need a number of new page types so really need to have an alternative Page.ss

We are using version 2.3 of silverstripe. An upgrade to 2.4 is planned but won't happen before we have to deliver this work.

I would appreciate pointers as to how we set a different theme per module or any other way of achieving the same result.

Avatar
Willr

Forum Moderator, 5523 Posts

29 May 2010 at 2:30pm

Well use can use SSViewer::set_theme("ThemeName"); in your page.php init functionality rather than your _config file and do something tricky to work out what theme to use (you would have totally separate themes). There is a few ways you can do this

* Have a checkbox in the CMS (or dropdown) to select what theme a page is on
* Base what theme to use based on a page type
* Use InSection to work out what theme to use.

Each of those have pros and cons. I think the simplest one is to use InSection('page') so say your new section is a section called 'Products' that is different from the site you can do $this->InSection('products').

In your mysite/code/Page.php

function init() {

if($this->InSection('products')) {
SSViewer::set_theme('productstheme');
}
else {
SSViewer::set_theme('sitetheme');
}

// normal init code
}

Avatar
HilaryB

Community Member, 11 Posts

1 June 2010 at 3:35am

Thanks Willr - that is really helpful
Hilary

Avatar
edenview

Community Member, 13 Posts

25 July 2010 at 6:36am

Hi Willr,

I am looking at wanting to change my website for different screen sizes and resolutions.

Is it possible to change theme based on screen size and resolution.

I have the following javascript and trying to incorporate it with either themes or css. Incorporating it with css appears buggy and does a complete website refresh and when changing to the 'else' resolution the 'typography.css' & 'form.css' don't work.

Javascipt used:

$(document).ready(function() {

if ((screen.width>=1024) && (screen.height>=768) && (screen.colorDepth>12))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "themes/??template??/css/HighQ_Large.css"});
}

if ((screen.width>=1024) && (screen.height>=768) && (screen.colorDepth<=12))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "themes/??template??/css/LowQ_Large.css"});
}

if ((screen.width<=1024) && (screen.height<=768) && (screen.colorDepth>12))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "themes/??template??/css/HighQ_Small.css"});
}

if ((screen.width<=1024) && (screen.height<=768) && (screen.colorDepth<=12))
{
$("link[rel=stylesheet]:not(:first)").attr({href : "themes/??template??/css/LowQ_Small.css"});
}

else
{
$("link[rel=stylesheet]:not(:first)").attr({href : "themes/??template??/css/HighQ_Large.css"});
}
});