Новости Joomla

NorrCompetition 3.0 — новые возможности компонента конкурсов и голосований для Joomla 6

Релиз NorrCompetition 3.0 — крупное обновление расширения для проведения конкурсов и голосований в Joomla.

Вышли релизы безопасности Joomla 6.1.1 и Joomla 5.4.6

Релиз безопасности Joomla 6.1.1 и Joomla 5.4.6

Проект Joomla! рад сообщить о выходе Joomla 6.1.1 и Joomla 5.4.6. Это релизы безопасности и исправления ошибок для серий 5.x и 6.x.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

В открытый доступ выложен видео-курс Дмитрия Гончарова по созданию интернет-магазина на связке Joomla + JoomShopping. Видеоуроки содержат пошаговые инструкции от регистрации хостинга до особенностей вёрстки, настройки способов оплаты и доставки.

В видео фигурирует JoomShopping 4 и Joomla 3, однако JoomShopping довольно консервативный компонент и многие способы и подходы в нём не менялись годами, поэтому данные видео могут быть по прежнему полезны.

Смотреть видео-курс

@joomlafeed

1   Вниз
0 Пользователей и 1 Гость просматривают эту тему.
  • 19 Ответов
  • 6093 Просмотров
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Как изменить мобильную версию сайта?
« : 11.01.2016, 11:26:28 »
Привет. У меня такая проблемка -  сделал я одностраничник на Joomla 3.4 с помощью расширения SP Pagebuilder при этом использовал стандартный шаблон - protostar. Все норм, все работает, только при заходе на страничку с мобильного устройства картинка в шапке довольно сильно "выпирает" из границ шаблона(совсем не красиво выглядит). Если смотреть в альбомной ориентации, то все нормально. Как мне исправить этот дефект при том, что меньше по размеру саму картинку сделать не получается так как она тогда не вместится в сам шаблон и будет смотреться не красиво при просмотре в ПК. Может как-то можно сделать так, чтобы в мобильной версии она вовсе не показывалась или показывалась другая, поменьше размером??
Записан
*

JaneFaint

  • Захожу иногда
  • 121
  • 3 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #1 : 11.01.2016, 11:37:33 »
Я думаю, что следует залезть в CSS, и там копаться: уменьшать/убирать/заменять картинку.
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #2 : 11.01.2016, 11:44:23 »
@media only screen and (max-device-width: тут ваш размерpx) {
тут условия для размера
}

тут вы подключаете условие в шаблоне:

<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: ваш размерpx)" href="ваш CSS шаблона и правильный путь к нему.css" />

Можно ещё добавить для определённых дивов запреты, можно делать для всех стандарно:

/ Для небольших устройств (смартфоны) /
img {
  max-width: 100%;
  display: inline-block;
}
/ Для средних устройств (планшеты) /
@media (min-width: 420px) {
  img {
    max-width: 48%;
  }
}
/ Для больших устройств (ноуты, пк) /
@media (min-width: 760px) {
  img {
    max-width: 24%;
  }
}

В любом случае для "мобилок" вам без @media не обойтись ну ни как!

вот запрет для дивов:

@media (max-width: ваш размерpx) {
  .имя класса дива {
    display: none;
  }
}

<div class="имя класса дива">тело дива</div>

///

Надеюсь всё дословно и доступно.Всё происходит в файле ваш шаблон/имя.css (если нету lessов)
если есть-тогда переопределить в индексе или в лайоте на нужный файл( от шаблона зависит) и обновления это не затрут.
« Последнее редактирование: 11.01.2016, 11:59:31 от vipiusss »
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #3 : 11.01.2016, 12:46:40 »
прошу прощения, я понимаю - вы и так максимально просто написали, но в силу того, что я немного чайник и нуб, можно немного проще. хотя бы чуть-чуть. я попытался применить все вами написанное, но ничего не изменилось (подозреваю, что я что-то не так сделал)
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #4 : 11.01.2016, 12:57:46 »
ну тут надо знать, что вы и где сделали, даже из того, что я написал выше.
по умолчанию вам надо работать с CSS файлом шаблона.
а что вы наделали-тут не телепаты.
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #5 : 11.01.2016, 13:33:27 »
Я в конец документа template.css вставил следующее
@media only screen and (max-device-width: 783px) {

img {
  max-width: 100%;
  display: inline-block;
}

@media (min-width: 420px) {
  img {
    max-width: 48%;
  }
}

@media (min-width: 760px) {
  img {
    max-width: 24%;
  }
}
}

В документ index.php на 88 строку это в пределах тега <head> вставил следующее       
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 783px)" href="/css/template.css"/>
 не судите строго и не смейтесь, если я поступил, как не опытный пользователь)
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #6 : 11.01.2016, 13:44:52 »
В документ index.php на 88 строку это в пределах тега <head> вставил следующее       
<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 783px)" href="/css/template.css"/>

это вам не надо тогда, раз вы выбрали этот вариант.
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #7 : 11.01.2016, 13:51:49 »
@media (max-width: ваш размерpx) {
  .имя класса дива {
    display: none;
  }
}
ну меняйте "точечно" для дивов:тут хоть понятно?

///

только заметил:
@media only screen and (max-device-width: 783px) {  удалите и последнюю скобку.
вы код на код лепите.


вот  как я написал, тупо скопируйте с пояснялками( они закомментированы):
Спойлер
[свернуть]
« Последнее редактирование: 11.01.2016, 13:55:18 от vipiusss »
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #8 : 11.01.2016, 13:55:00 »
не помогло( хотел бы уточнить, что я работал именно с файлом template.css шаблона установленного на сайте. картинка по прежнему жутко выпирает вправо. и это только в книжной раскладке. в альбомной все ок. а если смотреть с планшета - то все норм в любом положении. короче проблема только с книжной разверткой на смартфонах.
P. S. скобку я убрал
« Последнее редактирование: 11.01.2016, 14:04:14 от mor4eGG »
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #9 : 11.01.2016, 13:56:18 »
я изменил ответ, почитайте.
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #10 : 11.01.2016, 14:12:37 »
тупо скопировал, вставил в конец template.css - ничего не поменялось. вставил вместе с этой строкой @media only screen and (max-device-width: 783p) - никакого эффекта. теперь у меня такая картина
@media only screen and (max-device-width: 783px) {

/ Для небольших устройств (смартфоны) /
img {
  max-width: 100%;
  display: inline-block;
}
/ Для средних устройств (планшеты) /
@media (min-width: 420px) {
  img {
    max-width: 48%;
  }
}
/ Для больших устройств (ноуты, пк) /
@media (min-width: 760px) {
  img {
    max-width: 24%;
  }
}
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #11 : 11.01.2016, 14:18:10 »
@media only screen and (max-device-width: 783px) {
это не надо.
и вы уверены, что именно этот CSS отвечает?
даже если и ставите, у вас скобка не закрыта.
поставьте просто в CSS, не важно куда, сверху или снизу, только в тот, что отвечает.может у вас лессы шаблон делает.
@media only screen and (max-device-width: 783px) { скобка началась, а где итого?
и эта строка не нужна, если вы ставите отдельно принудиловку.
« Последнее редактирование: 11.01.2016, 14:22:03 от vipiusss »
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #12 : 11.01.2016, 14:25:07 »
site.ru/templates/protostar/css
вот адрес документа templates.css в котором я меняю
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #13 : 11.01.2016, 14:29:48 »
у меня протостар с офф сайта, как и всё, установлено и нет проблем.
на мобилке(хром, ленова, андроид) всё корректно.
может вы не там скачали?
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #14 : 11.01.2016, 14:35:47 »
что вы имеете ввиду? sp page откуда я скачал? или Joomla? хотя какая разница - я все равно не вспомню. проверяю на тысяче устройств и на разных браузерах, сафари, Chrome опера; iphone, samsung, sony. работает корректно только на планшетах. может сама проблема в настройках sp page и этой картинке...хотя там я все варианты перепробовал
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #15 : 11.01.2016, 14:39:27 »
ну укажите картинку в новом диве, даже без класса, просто стилем в коде и проверьте
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #16 : 11.01.2016, 14:47:06 »
подскажите как это сделать
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #17 : 11.01.2016, 14:51:27 »
Цитата: mor4eGG от 11.01.2016, 14:47:06
подскажите как это сделать
что именно?див?
<div style="ваш стиль, аля css">тут ваша картинка</div>
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
*

mor4eGG

  • Осваиваюсь на форуме
  • 40
  • 0 / 0
Re: Как изменить мобильную версию сайта?
« Ответ #18 : 11.01.2016, 15:18:46 »
спасибо за помощь и терпение. разобрался. проблема была в самих настройках sp page. я пошаманил в настройках и подогнал немного размеры самой картинки и она стала как миленькая куда и как нужно. а, может быть и эти изменения в CSS помогли напару с настройками sp page. хз, главное, что цель достигнута.
Записан
*

vipiusss

  • Гуру
  • 5739
  • 344 / 11
  • Скайп: renor_
Re: Как изменить мобильную версию сайта?
« Ответ #19 : 11.01.2016, 18:37:14 »
 *DRINK*
ну хоть у кого-то настроение лучше!
Записан
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Изменить область кликабельности ссылов в шаблоне (в шапке)

Автор Maffo

 Ответов: 4
Просмотров: 1481 		Последний ответ 24.08.2021, 17:22:57
от Maffo
Не удается изменить страницу через конструктор yootheme

Автор bigbelka

 Ответов: 0
Просмотров: 1057 		Последний ответ 05.08.2021, 12:06:21
от bigbelka
Protostar. Резиновый. Изменить размер в %

Автор Belka

 Ответов: 29
Просмотров: 4685 		Последний ответ 10.04.2021, 09:27:47
от sivers
Как изменить расположение Меню в Helix3?

Автор Bazaroff

 Ответов: 18
Просмотров: 1904 		Последний ответ 24.01.2021, 19:06:59
от beliyadm
Непонятное отображение одной страницы сайта

Автор itbc

 Ответов: 12
Просмотров: 1395 		Последний ответ 14.12.2020, 13:42:32
от itbc