17 января 2009 в 15:52
Помогите пожалуйста. Как создать шаблоны темы под разные расширения монитора?
Шаблон страницы под разные расширения монитора
Главные вкладки
17 января 2009 в 15:52
Комментарии
передавать в php разрешение. можно через куки можно через сессию. Но на практике при включенном кешировании не всегда срабатывает.
Для установки куков у меня такой js был.
document.cookie = "ek_x=" + screen.availWidth;
document.cookie = "ek_y=" + screen.availHeight;
}
var EkOnload = window.onload;
window.onload = function () { if(EkOnload) EkOnload(); setCoo();
}
На сервере читаем
<?phpif ($_COOKIE['ek_x']>0){
$ek_x = $_COOKIE['ek_x'];
}
else {$ek_x = 1024;}
?>
Можно более подробно обьяснить что нужно делать?
а) Нужно узнать какое расширение у пользователя и в зависимости от этого отдать ему тот или ной код шаблона.
некоректный какой-то вопрос... узнать текущее разрешение монитора друпал может только после выполнения js скрипта на клиенте. а скрипт нужно клиенту предварительно отдать, то есть загрузить страницу в какой-то дефолтной теме.
в общем как ты себе представляешь протокол работы, что за чем показывается?
Собственно это я и написал. Код работает. Передаем через куки разрешение монитора клиента. И сервером это перерабатываем.
может ему просто резиновая верстка нужна? )
Может...., но автор нем .....
Нет мне не нужна резиновая верстка, а нужно порядок действий: что где нужно прописывать чтоб узнать разрешение монитора и как отдать той или иной шаблон под разрешение клиентского монитора?
Я собственно и написал один из вариантов, как дать разрешение от клиента, как его на серваке подобрать. Обрабатывай на здоровье, что не ясно? Только нормально работать не будет при кешировании. Я использовал этот метод на живом сайте - все работало. Большинству все равно хватит некоего стандартного разрешения 1024 Х 768. Если надо охватить пользователей с КПК, то лучше ил поддомен отвести. Если сильно надо именно шаблоны, то используй что я написал + можешь кнопку поставить на сайте для показа под конкретное разрешение.
HIgor1968, твой метод как в Опере так и в ИЕ будет работать?
Проблем не возникало.
Там все просто JS куки ставит, PHP читает. Напрямую работает только после повторной перезагрузки страницы. Надо дорабатывать. Или обходные пути, например универсальная для разных разрешений страница приветствия. На которой и установим куки, а далее сайт грузим уже зная разрешение клиента.
screen.availWidth возвращает ширину окна, а не экрана. Ширину экрана возвращает screen.width, хотя помоему это не для всех браузеров работает одинкаово.
Да, конечно. Я получал окно, поэтому скопировал код какой был. Передать хоть размер экрана, хоть окна можно только JS и после формирования страницы, т.е. экран можно подстроить под разрешение клиента только на второй странице, когда куки с разрешением уже установлены.
В page.tpl.php после тэга
<script language='JavaScript'>
var EkOnload = window.onload;
window.onload = function () {
if(EkOnload)
EkOnload();
document.cookie = "ek_x=" + screen.availWidth;
document.cookie = "ek_y=" + screen.availHeight;
}
</script>
в кукисы пишет, спасибо.
После
вставил:
print '<link rel="stylesheet" type="text/css" href="' . base_path() . path_to_theme() . '/res_';
if ($_COOKIE['ek_x']>1024)
{
print 'big.css"/>';
}
else
{
print 'default.css"/>';
}
?>
Теперь в res_big.css осталось прописать стили для больших разрешений и в res_default.css для 1024x768 и меньше
Думаю всё получится )
Красивее будет, если js отдельным файлом сделаешь и в инфо темы добавишь.
Тогда в HEAD ,блоке включаться JS будет.
попробую, он тогда и при оптимизации в 6ом друпале будет сжиматься как и все остальные в один файл, наверно
Да
Вот еще простой пример как можно стили подсовывать в зависимости от разрешения экрана
<!--
var correctwidth1=800
if (screen.width==correctwidth1)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/1_new.css\">");
var correctwidth2=1024
if (screen.width==correctwidth2)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/2_new.css\">");
var correctwidth3=1152
if (screen.width==correctwidth3)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/3_new.css\">");
var correctwidth4=1280
if (screen.width>=correctwidth4)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/4_new.css\">");
// -->
</script>
А что если в скрипт, который сохраняет разрешение экрана в кукис, сунуть проверку: если в кукисе нет значений ширины/высоты экрана, то сохранить их и тут же перезагрузить страничку?
Тут немного на понимание яваскрипта, а я то с ним не особо близок, вот и хочу узнать - можно ли такое реализовать и как? То, что страничку перезагрузить средствами яваскрипта можно - я знаю, но скрипт вызовется во время загрузки страницы или перед загрузкой, или все-таки после? Если скрипт вызовется вконце, то былоб некрасиво делать обновление обновление страницы ))
Тоже ничего в голову не идет кроме входной страницы на сайт. Типа подождите пару секунд, сейчас все будет.
Чем вас вариант подстановки стилей в зависимости от разрешения экрана не устраивает?
При верстке для темы делается 1 файл стилей основной - который используется в любом случае + несколько файлов стилей по одному под каждое расширение.
Последние ставятся в тему после строки включения основных стилей. И все дела. Ребят, зачем усложнять-то.
Хыхех, не вгляделся. Ну да с document.write можно откинуть кукисы
Увидеть, я увидел, но прошло мимо ушей;) Спасибо WiseMan. Вопрос исчерпан.
Добрый день.
JS скрипт работает, из кукисов читается.
Вопрос следующий:
В браузере (FireFox например) жму ctrl+колесо - картинка в браузере уменьшается.
из кукисов, естественно, читают все теже значения экрана.
как быть в такой ситуации как масштабировать сайт у пользователей, которые меняют масштаб внутри браузера, поидее при обновлении странички надо бы им что-то более симпатичное показывать, чем они получают!?
Спасибо.
висело в закладках и только сейчас начал реализовывать!
пребываю в приятном шоке ))) Здорово!!!
а вот вопрос такой
будет ли работать этот вариант для мобильных устройств???
<!--
var correctwidth1=1280
if (screen.width==correctwidth1)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/1_new.css\">");
var correctwidth2=240
if (screen.width==correctwidth2)
document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"css/2_new.css\">");
// -->
</script>
то есть если указать ширину 240?
никто не проверял на практике? и как должно быть в теории?
В файле page.tpl.php после
<?php print $styles ?>и<?php print $scripts ?>использую конструкцию:var correctwidth1=800
if (screen.width<correctwidth1)
document.write("<link rel=\"stylesheet\" type=\"text/css\"
href=\"sites/all/themes/greenNblack/style_mobile.css\">");
</script>
Работает для главной страницы, а для остальных не работает, в чем может быть проблема, кто знает?
В том, что вы, батенька, используете винду и не отличаете путь с "/" от путя без "/"