Documentation

Light-weight, fast, simple and powerful!
Translations of this page?:

How "Sessions" can control frontend display

PHP's global $_SESSION variable can be used to direct users to different frontend options in Wolf CMS, or otherwise set a value in a variable that can be accessed throughout your site.

Introduction

The technique described in this article:

  1. sets the session variable in a snippet;
  2. the snippet and variable are used in the layout;
  3. a hidden page redirects the user back to the original page, with the new display.

This can be used for a lot of different tasks. For example:

  • it can be used with page-parts to display multilingual content
  • it can be used with different CSS files to change the layout of the site based on user preference
  • it can be used with page tags to display different “categories” based on a common tag
  • and so on!

This tutorial will use the second example: a simple Wolf CMS “style switcher”.

Set SESSION variable in a snippet

Go to the Snippets tab in the admin, and click on “New Snippet”. In the new window, give the snippet a title (e.g. “cssSwitcher”), leave the filter set to ”-none-”, and paste this code1) into the Body:

<?php // Check and set site style
 
if(!isset($_SESSION['css'])) {
	// assign the default
	$css = 'default';
	$_SESSION['css'] = $css;
 
} elseif (isset($_GET['css'])) {
 
	switch($_GET['css']) {
		case 'green': // Green
			$css= 'green';
			break;
		case 'blue': // Blue
			$css= 'blue';
			break;
		case 'black': // Black
			$css= 'black';
			break;
		case 'default': // Default
			$css = 'default';
			break;
		default:
			$css = 'default';
	}
 
// pass a custom css to the session
$_SESSION['css'] = $css;
 
}
?>

Save the snippet.

Preparing the layout

Now click on the Layouts tab, and open your active layout. At the top of the layout (it can be the first line), put in this call for your new snippet:

<?php $this->includeSnippet('cssSwitcher'); ?>

Then where you call your CSS, put in the session variable instead of a hard-coded filename. It should look something like this:

<link rel="stylesheet" href="<?php echo URL_PUBLIC; ?>public/themes/multicss/<?php echo $_SESSION['css']; ?>.css" media="screen" type="text/css" />

This assumes that you have a CSS file to match each of the cases set up in your snippet in Step 1:

  • default.css
  • green.css
  • blue.css
  • black.css

The "hidden" redirect page

In order for the variable to be set, and the visitor to be returned to the page they were viewing with their chosen display, a hidden re-direct page is used. Create a new Page off of the root (Homepage), with a name like “css”, set the layout to “none”, and paste in this code:

<?php 
 
// Set css
$this->includeSnippet('cssSwitcher');
 
// Forward back to originating page
if($_SERVER['HTTP_REFERER'] != '') { 
  header('Location: '.$_SERVER['HTTP_REFERER']); // Forward back
} else {
  header('Location: '.BASE_URL); // Forward home
}
 
?>

Set the Status to “Hidden”, and Save the page.

Providing links for the user

Now you need some means of letting visitors to the site actually select one of these options. Set up the links on the page in your layout (somewhere! sidebar or footer, for example), like this:

<p id="cssSwitcher"><strong>Style</strong>:
<a href="<?php echo URL_PUBLIC; ?>css<?php echo (URL_SUFFIX == '') ? '/' : URL_SUFFIX; ?>?css=default">Default</a> | 
<a href="<?php echo URL_PUBLIC; ?>css<?php echo (URL_SUFFIX == '') ? '/' : URL_SUFFIX; ?>?css=green">Green</a> | 
<a href="<?php echo URL_PUBLIC; ?>css<?php echo (URL_SUFFIX == '') ? '/' : URL_SUFFIX; ?>?css=blue">Blue</a> | 
<a href="<?php echo URL_PUBLIC; ?>css<?php echo (URL_SUFFIX == '') ? '/' : URL_SUFFIX; ?>?css=black">Black</a>
</p>

Note: The links as shown above allow for the use of an HTML suffix or none, but assumes that mod_rewrite is enabled.

Credit: This technique was first worked out by Justin Frydman.

Additional Notes

Parsing multi-lingual title page-part

When using this technique as a language chooser (as in this multilingual demo), you can add a menu with the unique language title. Follow these steps:

1. For every page with multi-lingual page parts, also create a page-part called “titles” (as in the image at the demo site). Set the filter to ”-none-”. Put the different language titles each on their own row, preceded by the two-character ISO 639-1 code (e.g., 'de' for German) with colon and space. Then, put the translated content for that page, each in its own page-part with the ISO code as the name for that part. The “titles” page-part content could look like this, then:

de: Ein dritter Seite
fr: Une troisième page

The final result should look something like this:

Multi-lingual page-part setup

2. Create a snippet called “langTitle”, filter set to ”-none-”, with this content (note that the session variable here is called “lang” – this corresponds to the “css” session variable in the worked example above):

<?php if ($this->hasContent('titles')) : ?>
<?php
$lang = $_SESSION['lang'];
$titles = $this->content('titles');
$res = preg_match('/'.$lang.':\s*(.*)/i', $titles, $results);
if($res == 1){
	$title = trim($results[1]);
	echo $title;
} else {
	echo $this->title();
} ?>
<?php else : ?>
<?php echo $this->title(); ?>
<?php endif; ?>

It checks to see if that page has a page-part called “titles” with content, and ONLY runs if it does. Otherwise, it just returns to the page title.

3. Use that snippet to replace the page's title in your layout, like this:

<h2><?php $this->includeSnippet('langTitle'); // REPLACES echo $this->title(); ?></h2>

4. This code produces a menu which includes the correct title for the chosen language:

<?php $lang = $_SESSION['lang']; ?>
 
<h3><a href="<?php echo $this->url(); ?>">Lingua pages</a></h3>
 
<ul id="nav_sub">
<?php foreach ($this->children() as $child): ?>
<?php if ($child->hasContent('titles')) {
  $titles = $child->content('titles');
  $res = preg_match('/'.$lang.':\s*(.*)/i', $titles, $results);
    if($res == 1) {
	$title = trim($results[1]);
	$childTitle = $title;
  } else { $childTitle = $child->title(); } 
} else { $childTitle = $child->title(); } ?>
    <li><?php echo $child->link($childTitle, (url_start_with($child->url) ? ' class="current"': null)); ?></li>
<?php endforeach; ?>
</ul>

Credit: This technique was worked out by Craig Rodway

1) If the “switch” code is new to you, see the PHP manual on "switch".
 
tutorials/sessions_for_frontend_display.txt · Last modified: 2011-09-12 00:46 (external edit)
 
Except where otherwise noted, content on this wiki is licensed under the following license:GNU Free Documentation License 1.2
Copyright 2010 wolfcms.org / design by yello studio / Wolf CMS Inside