Создание веб-сайта со скинами. Какой лучший способ создать правильное изображение с моей точки зрения?

Question

Я переписываю сайт, который будет поддерживать несколько скинов.В настоящее время я просто планирую разрешить изменение изображений и CSS, но основной HTML не изменится.И если обложка не изменяет изображение или файл CSS, она наследует этот файл от базовой обложки.

Имея это в виду, вот три способа, которые я рассматривал для обработки зависимой от обложки кожифайлы:

1. Оберните все запросы, относящиеся к скину, в представлении функцией поиска, например:

    <img src="<?php get_skin_file('/images/header.png', 'skin1'); ?>" />

    function get_skin_file($file, $skin) {
        $skin_file = '/' . $skin . '/' . $file;
        if(is_readable($skin_file)) return $skin_file;
        return '/default/' . $file;
    }

Пусть php обслуживает изображение

<img src="/header.png.php?skin=skin1" />

Всегда пытайтесь загрузить файл скина, и, если он не существует, используйте ModRewrite дляотправить результат в скрипт обработчика php:

<img src="/skin1/header.png" />

Номер 2 - это то, что я хотел бы сделать, но я просто обеспокоен производительностьюпоследствия того, что PHP обслуживает практически каждый файл изображения.

Моя база пользователей достаточно мала (около 30 тыс. Пользователей), поэтому я не думаю, что это действительно будет проблемой, но я также хотел бы узнать, что другие люди делают в этой ситуации.

Спасибо.

РЕДАКТИРОВАТЬ: Я понятия не имею, почему мой код не отформатирован должным образом.Я нажал кнопку с кодом и проверил, что это 4 пробела, но все равно безобразно.Извините за это.

Answer 1

Я бы попытался построить это так, чтобы оно было модульным и легко адаптировалось к будущим изменениям.Я бы не использовал в своем коде как можно больше жестких мест или, по крайней мере, уменьшил бы его до 1 места.

Одна вещь, на которую стоит обратить внимание, это наличие какого-либо ini-файла или xml-файла, который содержит информацию о ваших изображениях для определенных скинов.Таким образом, жесткие места находятся не в вашем php или html, они просто в файле ресурсов, который легко изменить.

Мне нравится использовать xml, так что вот пример того, что вы можете сделать.

Вот HTML.

<?php $skin = "notDefault"; ?>
<img src="<?php get_skin_image("header",$skin) ?>" />
<img src="<?php get_skin_image("footer",$skin) ?>" />

Тогда вот ваша функция: если изображение скина не будет найдено, оно извлечет его из файла XML по умолчанию.

function get_skin_image($type,$skin){
    $skin_xml_data = xml2array("skinFolderLocation/ " . $type . ".xml"); 
    $default_xml_data = xml2array("defaultFolderLocation/default.xml");
    // here is a link to the xml2array function for you to download 
    // http://www.php.net/manual/en/function.xml-parse.php#87920
    if(isset($skin_xml_data[$skin][$type])){
        return $skin_xml_dat[$skin][$type];
    } else {
        return $default_xml_data["default"][$type];
    }
}

И, наконец, страница XML, сохраненная какnotDefault.xml

<notDefault>
    <header>locationToHeader/header.png</header>
    <footer>locationToFooter/footer.png</footer>
</notDefault>

Answer 2

Все три из них являются абсолютно действительными вариантами.Я бы лично предпочел первое, хотя и использовал имя изображения, а не путь к изображению.Если биты управления темами достаточно мощные, это позволяет темам определять свои собственные дополнительные изображения, управляемые пользователем.

Рассмотрим четвертый вариант: на самом деле не вставляйте изображения с помощью тегов img.Вместо этого используйте div с фоновыми изображениями.Это может работать в большинстве случаев и оставляет определение изображений полностью до таблицы стилей.К сожалению, это также гораздо более сложный вариант.

Answer 3

Не могли бы вы назвать пространство имен вашей кожи? Например, большинство создаваемых мной приложений имеют каталог inc (содержащий логику программирования) и каталог tpl, который затем разбивается на отдельные каталоги для отдельных оболочек. Если у сайта только один скин, он будет только одним каталогом.

Например:

inc/
    ...
tpl/
    default/
        assets/
            css/
            images/
            js/
    alternative/
        assets/
            css/
            images/
            js/

В моем скрипте контроллера index.php я могу прослушивать переменную tpl, передаваемую через массив $_GET. Например:

if (!isset($_SESSION['tpl'])) {
    $tpl = "default";
}
if (isset($_GET['tpl']) && is_dir('tpl/'.$_GET['tpl'])) {
    $_SESSION['tpl'] = $_GET['tpl'];
}
$tpl = $_SESSION['tpl'];

Теперь текущее значение tpl доступно в моем массиве $_SESSION (я мог бы легко изменить его на использование файлов cookie, если бы я хотел, чтобы значение сохранялось между сеансами) и переменной $tpl. Затем я могу получить изображения и пути CSS, например:

<img src="tpl/<?php echo $tpl; ?>/assets/images/heading.jpg" alt="Heading image" />

<link rel="stylesheet" href="tpl/<?php echo $tpl; ?>/assets/css/screen.css" type="text/css" />

Запросы на активы (CSS, изображения, JavaScript) можно затем обернуть в пользовательскую функцию. Это также может обрабатывать случаи, когда, скажем, все ваши файлы JavaScript содержались в скине default, и вы не хотели дублировать их в скине alternative.

function get_template_file($filename, $tpl)
{
    // if we're requesting a JavaScript file, serve from 'default' regardless
    if (substr($filename, -3) == ".js") {
        return "tpl/default/".$filename;
    }
    else {
        $file = "tpl/{$tpl}/{$filename}";
        if (is_file($file) && is_readable($file)) {
            return $file;
        }
        else {
            $tpl = "default";
            return $file; // try return 'default' filepath
        }
    }
}

Answer 4

В итоге я выбрал вариант 2. У меня есть Apache для поиска шаблонов URL, и, если присутствует заменяемый скином URL-адрес, запрос направляется в мой скрипт выбора образа скина.

Вот соответствующая конфигурация apache:

<Directory /var/www/website>
  RewriteEngine on
  RewriteBase /

  RewriteCond %{REQUEST_URI} \.select.(png|jpg|gif|txt|css)$ [NC]
  RewriteRule ^(.*)$ index.php?mode=select&q=$1 [L,QSA]
</Directory>

Вот код PHP из файла, который отображает изображение:

<?php
preg_match("%^(?P<path>.+)\.select\.(?P<ext>(jpg|gif|png|txt|css))$%", $_REQUEST['q'], $matches);

$base = '/' . $matches['path'] . '.' . $matches['ext'];

$file = '/skins/' . App::get('skin') . '/' . $base;

if(is_readable($file)) {
  header('Content-type: image/' . $matches['ext']);
  header('Content-Transfer-Encoding: binary');
  header('Content-Length: ' . filesize($file)+1);
  readfile($file);
  exit();
}
//custom file isn't available, so load the default
$file = '/skins/default/' . $base;
header('Content-type: image/' . $matches['ext']);
header('Content-Transfer-Encoding: binary');
header('Content-Length: ' . filesize($file)+1);
readfile($file);
exit();
?>

поэтому для любого актива, который, на мой взгляд, должен учитывать скин, я загружаю его следующим образом:

<img src="/images/header.select.png" />

и apache ловит его и отправляет в мой скрипт-обработчик.

Спасибо за вашу помощь в этом. Оба из двух других предложений предоставили stmpy, и Чарльз тоже сработает, но это было идеальным решением для меня. В качестве бонуса, делая это таким образом, я также могу заменить изображения в CSS и что не динамически без пользовательских файлов CSS. Мое приложение будет в основном состоять из простой замены основного фона, поэтому все, что потребуется для моих тем, по большей части будет просто создавать новую папку скина и загружать одно фоновое изображение.