Вывод чанка MODX в зависимости от ширины монитора
Необходимо разработать сниппет, который будет выводить чанк в зависимости от ширины экрана.
Например, есть сложный дизайнерский блок, пример http://prntscr.com/ketr19 или http://prntscr.com/ketspn, таких примеров сотни... (выводится через отдельный чанк). Очень часто, неудобно перестраивать такие блоки стилями при адаптации (очень затратно по времени, чтобы довести до адекватного вида http://prntscr.com/ketrqd). Или например нужно вывести блок с совершенно другой html структурой для определенных экранов (например экранов ниже 960 и т д). Или хедер для интернет магазина нужно вывести с другой структурой (где будет другой порядок колонок, не такой как для ПК). На практике, ситуаций очень много, где было бы идеально выводить чанк с отдельной упрощенной структурой, а не играться со стилями и переставлять колонки местами через скрипты...
PS Через CSS (@media screen) просьба не предлагать в стиле напишите для блока display: none; - этот вариант категорически не подходит, так как нужно не просто скрыть содержимое через стиль, а полностью убрать из исходного кода + очень пагубно для продвигаемого сайта скрыть содержимое через display: none, даже сказал бы убийственно и недопустимо (скрывать разные тексты и содержимое и дублировать его другим блоком, который будет отображать это содержимое для меньших экранов). Так же не предлагать Бутстрап и различные скрипты для определения устройства (это все не то)
Нужно определение именно ширины (по такой логике как сейчас с CSS @media screen, точно определяет). Пример компонент MobileDetect для MODX (только он определяет устройство а не ширину экрана), нравится как тут условие задается http://prntscr.com/ketu3t (в таком плане хотелось бы через фильтр Fenom)
-
Я так полагаю можно через ajax запросы, сделать вывод нужного блока.
-
Здравствуйте. Вам виднее
-
Через аякс не получиться, так как контент не будет проиндексирован поисковиком... Я думаю что нужно дорабатывать мобайлДетект таким образом чтоб возвращалось true на запрос вида
{if '320' | mobiledetect}вот такая ситуация, вариант, вас устроит?
-
Я в этом не силен) мне главное чтобы работало и индексировалось поисковиком)
-
так а почему не установите просто мобайлДетект, или проверка должна быть строго по ширине в пикселях? дело в том что эта библиотека проверяет браузер по загаловкам которы тот, браузер, отправляет во время запроса страницы вот и все... тоесть есть 3 варианта моб, планш и комп, а вам я так понял нужны варианты строго в пикселях или в диапазонах размеров ширины..
-
Да, строго в пикселях. Например, у планшета может быть расширение очень разное, например у одного будет 1280+ у другого 1024, зачем мне показывать к примеру узкую версию с 1024 для 1280+, если для 1280+ я могу показать красивую ПК версию... как то так)
-
хорошо, если к примеру моб. и меняется ориентация в пространстве? то как тогда?
и припишите запланированные размеры? или какими предполагаете пользоваться.. + вы установили себе плагин на сайт? он работает в ключе моб. + планш. + комп ?
-
Мне главное один раз перестроить чанки. Тоесть вывести нужный чанк с новой html структурой на определенном расширении экрана (например на 1200, 960 или 800, на каком то одном) а дальше стилями через CSS @media screen, а чанк для ПК версии скрыть (чтобы его вообще в исходном коде небыло). Не совсем понял - (+ вы установили себе плагин на сайт? он работает в ключе моб. + планш. + комп ? )
-
Это про mobile detect.
Он считывает заголовок который отсылает браузер, и определяет тип браузера. Браузер для пк или для планшета или для смартфона
-
"Мне главное один раз перестроить чанки. Тоесть вывести нужный чанк с новой html структурой на определенном расширении экрана (например на 1200, 960 или 800, на каком то одном) а дальше стилями через CSS.., а чанк для ПК версии скрыть (чтобы его вообще в исходном коде небыло). "
- как раз это и делает скирпт мобайлДетект который вы можете прямо использовать по назначению
{if 'standard' | mobiledetect}[[$chnk_desc]] {/if} {if 'tablet' | mobiledetect}[[$chnk_tablet]]{/if} {if 'mobile' | mobiledetect}[[$chnk_mob]]{/if} -
Нет, это не то. Как я и писал ранее, к примеру хоху перестроить чанк для экрана 1024 и ниже, а если задам tablet то он мне может показать этот контент и для экранов меньше 1024 и для экранов больше 1024... а нужно к примеру только 1024 =<
-
Php не может определять ширину экрана.
Мобайл детект считывает заголовок который передает браузер.
Ширину неопределить
-
А кто вам мешает переписать скрипт, дописать к заголовкам размер в пикселях + вернуть не булев тип а массив с юзер агентом и шириной этого девайса?
-
Это каким образом вы заставите браузеры передавать ширину экрана?
-
не заставлять браузер передавать ширину, не получиться, а дописать ширину самому в зависимости от юзер агента в класс детектера
-
Вы сомжете сделать таким способом как описываете?
-
Я как раз думаю над этим, и возможностью реализации, дописать размеры можно к детектору, а вот какие именно, нужно проверять устройства на передаваемый заголовок юзер агента и реальную ширину экрана, тоесть если размер экрана идет для планшета, то дальше нужно раскинуть 1024 это или 960 или 800. я правильно вас понимаю?
-
Ширина экрана в заголовке котлрый отправляет браузера нет. И не будет.
Ширину может получить толь js который выполняется при открытии страницы
-
Например. Зашел человек с ipad 1 в альбоме (это 1024) а мы прописали условие что
{if '1204' | mobiledetect}[[$chnk_1024]] {/if}и ему вывелся чанк с содержимым для 1024, больше он переопределяться не будет, тоесть дальше уже не будет условий для этого чанка для экрана 960 и 800. Один раз только будет глобальная перестройка чанка
-
прописали условие для 1024 и значит что этот чан будет показываться на экранах 1024 и ниже (до самого минимального).
-
Или например зашел человек с планшета в портрете (768) и мы к примеру прописали условие для экранов 768 и ниже, но если он сменил ориентацию в таком случае в альбомную (1024), то уже ему выводится стандартный чанк для ПК
-
Самое простое перестраивать как надо при помощи css. На ваших скринах не видно что там какойто сложный вид
-
Есть в разы сложнее, особенно шапки... css то никак колонок местами не поменяет при необходимости...
-
Ну а то что вы хотите, это невозможно.
Только разные чанки для пк планшета и смартфона. Не учитывая ширину.
Либо при загрузки страницы отправлять ajax запрос в спец файл, который в сесию или куки запишет ширину экрана.
И проверять при выводе чанка какая ширина записана и выводить то что нужно
-
Mobail detect определить тип, а дальше уже медиа запросами. Я думаю это оптимальный вариант.
-
Aktualne zlecenia dla freelancerów w kategorii Programowanie stron internetowych
Platforma edukacyjna dla trenerów koszykówki + niestandardowy CMSPlatforma edukacyjna dla trenerów koszykówki + Custom CMSPrzegląd projektu Poszukujemy doświadczonego zespołu deweloperskiego lub programisty full-stack do zbudowania nowoczesnej platformy edukacyjnej dla trenerów koszykówki. Strona internetowa zapewni trenerom koszykówki dostęp… Bazy danych i SQL, Programowanie stron internetowych ∙ 5 godzin 22 minuty temu ∙ 25 ofert |
Integracja między Keycrm a Tilda
66 PLN
Potrzebna jest poprawna integracja Tilda ↔️ KeyCRM. Obecnie zamówienia są tworzone, produkty są przekazywane, ale występują problemy z przekazywaniem cech produktu (rozmiarów) oraz wyświetlaniem danych w lejkach. Należy ustalić przyczynę i skonfigurować przekazywanie… Content Management Systems, Programowanie stron internetowych ∙ 5 godzin 39 minut temu ∙ 9 ofert |
Szukam programisty do OpenCartDzień dobry 1) należy wdrożyć na stronie dneprkomfort.dp.uazakupiono moduł dla ukraińskich banków, już wdrożono Monto bank oto przykład naszego konkurenta Trzeba zrobić rozłożenie na raty, zakupy na raty (Monto Bank) Pumb, Sens, Monto domyślnie 2 płatności na 2 miesiące Pumb… Programowanie stron internetowych, Parsowanie danych ∙ 6 godzin 39 minut temu ∙ 19 ofert |
Szukam asystenta sysadmina, programisty.
83 PLN
Witam. Szukam pomocników. 1. Programista frontend, backend, reactjs, postgresql, redis, php, nodejs 2. Administrator systemów debian, ubuntu, proxmox, routeros, wireguard Proszę odpisywać tylko w przypadku posiadania doświadczenia w tych dziedzinach powyżej 5 lat.… Administracja systemem i siecią, Programowanie stron internetowych ∙ 6 godzin 54 minuty temu ∙ 14 ofert |
Multiregionalność na Laravel
415 PLN
Co jest wymagane: Wdrożenie struktury GEO (Kraj -> Województwo -> Miasto) w formie niestandardowej wtyczki, aby nie modyfikować rdzenia CMS. Dla każdej takiej strony GEO w panelu administracyjnym powinny być standardowe pola: H1, Tytuł, Opis oraz pole na tekst SEO. Frontend… Programowanie stron internetowych ∙ 10 godzin 17 sekund temu ∙ 38 ofert |
Kijów