Jump to:

1382 Posts in 492 Topics by 521 members

Themes

SilverStripe Forums » Themes » How do we have two themes on our site?

Discuss SilverStripe Themes.

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

Page: 1
Go to End
Author Topic: 1741 Views
  • HilaryB
    Avatar
    Community Member
    11 Posts

    How do we have two themes on our site? Link to this post

    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.

  • Willr
    Avatar
    Forum Moderator
    5497 Posts

    Re: How do we have two themes on our site? Link to this post

    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
    }

  • HilaryB
    Avatar
    Community Member
    11 Posts

    Re: How do we have two themes on our site? Link to this post

    Thanks Willr - that is really helpful
    Hilary

  • edenview
    Avatar
    Community Member
    13 Posts

    Re: How do we have two themes on our site? Link to this post

    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"});
       }
    });

    1741 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.