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.

Template Questions /

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

multiple themes on one site


Go to End


13 Posts   9508 Views

Avatar
AlaVive

Community Member, 42 Posts

15 September 2009 at 10:49am

I'm terribly interested in knowing how the CMS-tabbed theme configuration turned out, mccarville.

This is exactly what I need to do for a current site.

Avatar
steve_nyhof

Community Member, 224 Posts

28 October 2009 at 11:58am

Can anyone who figured out this code provide it here please?

Avatar
AlaVive

Community Member, 42 Posts

29 October 2009 at 2:40am

Happily (and, thanks again do zenmonkey for giving the tip to make this work so well: http://silverstripe.org/general-questions/show/269713?start=0#post269718#post269718/)!

I'm not the wisest when it comes to php, so there may be a prettier way to do it. But, this is what works for me.

In mysite/code/Page.php:

<?php

class Page extends SiteTree {
	
	public static $db = array(
	"ShowInChickenMenu" => "Boolean",
	"ShowInTurkeyMenu" => "Boolean",
	"PageStyle" => "Enum('Corporate,Chickens,Turkeys')",
	);

 
	public static $has_one = array(
	'BannerImage' => 'Image'
	);
	
function getCMSFields() {
  $fields = parent::getCMSFields();
  $fields->addFieldToTab("Root.Behaviour", new CheckboxField("ShowInChickenMenu", "Show Chicken Menu "));
  $fields->addFieldToTab("Root.Behaviour", new CheckboxField("ShowInTurkeyMenu", "Show Turkey Menu "));
  $fields->addFieldToTab("Root.Content.Main", new DropdownField("PageStyle", "Style", array(
"Corporate" => "Corporate",
"Chickens" => "Chickens",
"Turkeys" => "Turkeys",
))); 
$fields->addFieldToTab("Root.Content.BannerImage", new ImageField("BannerImage"));

  return $fields;
 }  
   
}

class Page_Controller extends ContentController {
	
	public function init() {
		parent::init();
		
	function ChickenMenu(){
	$whereStatement = "ShowInChickenMenu = 1";
	return DataObject::get("Page", $whereStatement);
   }
   
	function TurkeyMenu(){
	$whereStatement = "ShowInTurkeyMenu = 1";
	return DataObject::get("Page", $whereStatement);
   }
   
   function CheckChickens() {
	if ($this->PageStyle == "Chickens") {
	return true;
	}
	else { return false; }
	}
	
	function CheckTurkeys() {
	if ($this->PageStyle == "Turkeys") {
	return true;
	}
	else { return false; }
	}
	
	/**
	 * Site search form 
	 */ 
	 
	 function SearchForm() {
      $searchText = isset($this->Query) ? $this->Query : 'Search';
		
      $fields = new FieldSet(
         new TextField("Search", "", $searchText)
      );
 
      $actions = new FieldSet(
         new FormAction('results', '')
      );
 
      return new SearchForm($this, "SearchForm", $fields, $actions);
   }
	
	/**
	 * Process and render search results
	 */
	function results($data, $form){
	  	$data = array(
	     	'Results' => $form->getResults(),
	     	'Query' => $form->getSearchQuery(),
	      	'Title' => 'Search Results'
	  	);

	  	return $this->customise($data)->renderWith(array('Page_results', 'Page'));
	}
	
}

?>

There are many uses for the style check function, but this is how it works for the theme implementation and menu swap, depending on the page style chosen in my templates/page.ss layout:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >

  <head>
		<% base_tag %>
		<title><% if MetaTitle %>$MetaTitle<% else %>$Title<% end_if %> &raquo; Your Site Name</title>  
        $MetaTags(false)
		<link rel="shortcut icon" href="/favicon.ico" />
        <% if CheckChickens %>
			<link rel="stylesheet" href="/themes/themename/css/chicken_layout.css" type="text/css" media="screen" />
		<% else_if CheckTurkeys %>
			<link rel="stylesheet" href="/themes/themename/css/turkey_layout.css" type="text/css" media="screen" />
   		<% else %>
    		<link rel="stylesheet" href="/themes/themename/css/corp_layout.css" type="text/css" media="screen" />
		<% end_if %>
        <% require themedCSS(layout) %>
		<% require themedCSS(typography) %>
		<% require themedCSS(form) %>
        <script src="j/AC_RunActiveContent.js" type="text/javascript"></script>
            
 </head>
<body>
<div id="wrap">
  <div id="header"> 
  <% if CheckChickens %>
		<img name="put image name here" src="/themes/themename/images/chicken_pglogo.jpg" class="logo">
	<% else_if CheckTurkeys %>
		<img name="put image name here" src="/themes/themename/images/turkey_pglogo.jpg" class="logo">
    <% else %>
    	<img name="put image name here" src="/themes/themename/images/pglogo.jpg" class="logo">
	<% end_if %>
    <div id="headerlinks">
      <a href="sign-up">Sign Up</a> <a href="careers">Careers</a> $SearchForm
    </div>
    <div id="nav">
    <div id="navleft"></div>
    <% if CheckChickens %>
		<% include ChickenNavigation %>
	<% else_if CheckTurkeys %>
		<% include TurkeyNavigation %>
    <% else %>
    	<% include Navigation %>
	<% end_if %>
    </div>
    <% include Breadcrumbs %>
  $Layout
      <div id="footer">
    <% include Footer %>
  </div>
  </div>
</div>
</body>
</html>

I hope this helps!

Avatar
edenview

Community Member, 13 Posts

27 July 2010 at 5:09pm

Hi there,

I am trying to change themes based on a java script code to change css layout and keep getting a refresh problem on every page.

I would like to know if it's possible to add the following java script code example below converted for the Page.php file:

$(document).ready(function() {

if ((screen.width>=1024) && (screen.height>=768) && (screen.colorDepth<=12))
{
$("head").append('<link rel="stylesheet" type="text/css" href="/themes/??theme??/css/LowQ_Large.css"/>');
}

if ((screen.width<=1024) && (screen.height<=768) && (screen.colorDepth>12))
{
$("head").append('<link rel="stylesheet" type="text/css" href="/themes/??theme??/css/HighQ_Small.css"/>');
}

if ((screen.width<=1024) && (screen.height<=768) && (screen.colorDepth<=12))
{
$("head").append('<link rel="stylesheet" type="text/css" href="/themes/??theme??/css/LowQ_Small.css"/>');
}

});

Avatar
johnmblack

Community Member, 62 Posts

20 October 2011 at 6:21am

Edited: 24/10/2011 5:26pm

I had a more low-key code solution to this (CMS control of multiple themes) than was given above. Maybe I misunderstood the nuances of the requirements, but for me, it was sufficient to have a simple text field to type in the theme whenever it wasn't the site default. I didn't tie it into other selectable field criteria.

So I have 2 themes: blackcandy, and myCustomTheme. The following code allows me to enter a preferred theme value on the Home Page of the main site (this is actually a required step). That will always be the default. Any other page anywhere on the site can then have a value in that field that will take precedence, not only for itself but for all descendants (you don't have to set the value on the descendants.)

Prerequisite: A function that gets the value of a simple field either for the current page, or for any ancestor of the page up the hierarchy of pages (note - different from the hierarchy of classes). If none found before the top level, returns null. (Sorry if the core already had something like this; I couldn't find anything.)

Page.php, class Page:

	public function getInheritedValue($key)
	{
		$topmostItem = $this;
		//	Iterate upward through the hierarchy until we reach a page that has a value.
		while (!is_null($topmostItem))
		{
			$fieldVal = $this->getField($key);
			if (!is_null($fieldVal)  &&  '' != $fieldVal)
			{
				return $fieldVal;
			}
			$topmostItem = $topmostItem->getParent();  // when no more, becomes null
		}
		return null;
	}

(I reuse that function many, many times.)

Now for the feature-specific stuff. The controller init() function tries to get the PreferredTheme value for the current page or its ancestors. If not found, it tries to get the value for the Home page. If found anywhere, it sets the theme.
Page.php, class Page:

DB fields:
		'PreferredTheme' => 'Varchar(255)'
CMS Fields:
		$fields->addFieldToTab('Root.Behaviour', new TextField('PreferredTheme', 'Preferred Theme (for this and all child pages)'));

Page.php, class Page_Controller:

	public function init()
	{
		$preferredTheme = $this->getInheritedValue('PreferredTheme');
		if (is_null($preferredTheme)  ||  '' == $preferredTheme)
		{
			$homePage = ContentController::Page('home');  // should this be ->HomepageForDomain instead?
			$preferredTheme = $homePage->getInheritedValue('PreferredTheme');
		}
		if (!is_null($preferredTheme)  &&  '' != $preferredTheme)
		{
			SSViewer::set_theme($preferredTheme);
		}
		parent::init();
		...
	}

Go to Top