Ok, but said guinea pig is 1.1.x, not 2.0.x or 2.1 or the dreaded Los el Cartos Amigos. Code is quite simple though. It's the same basic idea used in all 1.1.x multis, and in some of Bloc's themes for background pickers. Goes like this:
// Layout changer.
if(!$context['user']['is_guest'] && isset($_POST['options']['theme_layout']))
{
include_once($GLOBALS['sourcedir'] . '/Profile.php');
makeThemeChanges($context['user']['id'], $settings['theme_id']);
$options['theme_layout'] = $_POST['options']['theme_layout'];
}
elseif ($context['user']['is_guest'])
{
if (isset($_POST['options']['theme_layout']))
{
$_SESSION['theme_layout'] = $_POST['options']['theme_layout'];
$options['theme_layout'] = $_SESSION['theme_layout'];
}
elseif (isset($_SESSION['theme_layout']))
$options['theme_layout'] = $_SESSION['theme_layout'];
}
// Background changer.
if(!$context['user']['is_guest'] && isset($_POST['options']['mypic']))
{
include_once($GLOBALS['sourcedir'] . '/Profile.php');
makeThemeChanges($context['user']['id'], $settings['theme_id']);
$options['mypic'] = $_POST['options']['mypic'];
}
elseif ($context['user']['is_guest'])
{
if (isset($_POST['options']['mypic']))
{
$_SESSION['mypic'] = $_POST['options']['mypic'];
$options['mypic'] = $_SESSION['mypic'];
}
elseif (isset($_SESSION['mypic']))
$options['mypic'] = $_SESSION['mypic'];
}
}
// The main sub template above the content.
function template_main_above()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;
// Show right to left and the character set for ease of translating.
echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"', $context['right_to_left'] ? ' dir="rtl"' : '', '><head>
<meta http-equiv="Content-Type" content="text/html; charset=', $context['character_set'], '" />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
<meta name="viewport" content="width=device-width" />
<meta name="description" content="', $context['page_title'], '" />', empty($context['robot_no_index']) ? '' : '
<meta name="robots" content="noindex" />', '
<meta name="keywords" content="cemb, ex muslim, former muslim, council of ex-muslims, leaving islam, discuss islam, islam, murtad, apostate, sharia, koran, quran, hadith" />';
// Any layout set by user?
if (isset($options['theme_layout']))
$settings['theme_layout'] = $options['theme_layout'];
// If not set, or if not allowed to set
if(!isset($options['theme_layout']) || (isset($settings['allow_layout_change']) && $settings['allow_layout_change'] == 'no'))
{
// Defaults.
($context['browser']['is_touchscreen']) ? ($options['theme_layout'] = 'Mobile') : ($options['theme_layout'] = isset($settings['theme_layout']) ? $settings['theme_layout'] : 'Standard');
$settings['theme_layout'] = $options['theme_layout'];
}
// Any backround set by user?
if (isset($options['mypic']))
$settings['mypic'] = $options['mypic'];
// If not set.....
if(!isset($options['mypic']))
{
// Defaults.
$options['mypic'] = isset($settings['mypic']) ? $settings['mypic'] : '1';
$settings['mypic'] = $options['mypic'];
}
// Load stylesheets before javascript. Avoids FOUC on page load.
echo '
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/style_Standard.css?116" />';
if ($settings['theme_layout'] !== 'Standard')
echo '
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/style_' , $settings['theme_layout'] , '.css?116" />';
Then it just has a couple of selects anywhere else for the pickers. Now of course you could do this with the variant system. In that case you'd just decide which function you wanted to run via variants, and which one you wanted to run via the custom code (one instance of, instead of two).
Selects are coded like this:
// Layout selection.
if (isset($settings['allow_layout_change']) && $settings['allow_layout_change'] == 'buttons')
{
echo '
<form name="layout_select" action="' . $_SERVER['REQUEST_URL'] . (strpos($_SERVER['REQUEST_URL'], '.php?') !== false ? ';' : '?') . '" method="post">
Layouts
<select size="1" name="options[theme_layout]" onchange="submit()">
<option value="Mobile" ', (!empty($options['theme_layout']) && $options['theme_layout'] == 'Mobile') ? 'selected="selected"' : '' ,'>Mobile</option>
<option value="Smallscreen" ', (!empty($options['theme_layout']) && $options['theme_layout'] =='Smallscreen') ? 'selected="selected"' : '' ,'>Smallscreen</option>
<option value="Standard" ', (!empty($options['theme_layout']) && $options['theme_layout'] == 'Standard') ? 'selected="selected"' : '' ,'>Standard</option>
<option value="Widescreen" ', (!empty($options['theme_layout']) && $options['theme_layout'] == 'Widescreen') ? 'selected="selected"' : '' ,'>Widescreen</option>
</select>
</form>';
}
// Background selection.
if ($settings['theme_layout'] !== 'Mobile')
{
echo '
<form id="background_select" name="background_select" action="' . $_SERVER['REQUEST_URL'] . (strpos($_SERVER['REQUEST_URL'], '.php?') !== false ? ';' : '?') . '" method="post">
Styles
<select size="1" name="options[mypic]" onchange="submit()">
<option value="1" ', (!empty($options['mypic']) && $options['mypic']=='1') ? 'selected="selected"' : '' ,'>Light stone</option>
<option value="2" ', (!empty($options['mypic']) && $options['mypic']=='2') ? 'selected="selected"' : '' ,'>Dark grunge</option>
<option value="3" ', (!empty($options['mypic']) && $options['mypic']=='3') ? 'selected="selected"' : '' ,'>Evening sky</option>
<option value="4" ', (!empty($options['mypic']) && $options['mypic']=='4') ? 'selected="selected"' : '' ,'>Dark sunset</option>
</select>
</form>';
}
The !Mobile conditional is just because there's no point in a pretty background on a phone, because you can't see it anyway. So for phones the css just sets a basic white background on body, regardless of which background option is set.
Modern, Free, Powerful