kuban-forum.ru - Лучший форум для общения |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » kuban-forum.ru - Лучший форум для общения » 🍰Кофейня » Новости форума и обсуждение его работы
Автору Конференции.
С кодами не переигрывай - стало трудно писать обычный текст из твоих надстроек.
Как пользователь говорю.
Отредактировано Merlin (20.03.2025 14:02:20)
Если ты чего то не слышишь, если что то не видишь, если о чём то не знаешь - не факт что этого не существует.(С) Инопланетяне ибн Виктор Васильевич. +7 909 458 6666
Доброго времени суток 
Я не совсем понял вопрос, но отвечу, как понял
Видимо, речь про форму "Быстрого ответа", в которой, собственно, пишутся ответы Он имеет 2 режима функционирования - в режиме BBCode, когда BB-коды пишутся прямо в тексте сообщения, и в том режиме показывается кнопка "Посмотреть", т.е. это предпросмотр сообщения; и режим WYSIWYG, в котором предпросмотр сразу в окне ввода текста.
Вот как раз режим WYSIWYG и может "притормаживать", он сделан главным программистом платформы mybb.ru, находится в экспериментальном режиме, и у него иногда бывают странные глюки. Так что, при написании больших текстов и при глюках, лучше всего переключиться в режим BBCode, он надёжный, как топор
В целом, форум при нормальном интернете и при отсутствии тормозов на сервере, работает вполне сносно
P.S. Сейчас уменьшил количество кнопок в форме быстрого ответа при мобильном просмотре, а то в них было нереально попасть пальцем:)
Амал, когда снег убиреш?
у него иногда бывают странные глюки.
Я писал свой WYSIWYG-редактор, потом его использовал заказчик. И выяснился один, вроде как незаметный поначалу эффект - при вставке текста из MS Word. Давно это было, сейчас уже и браузеры умнее стали (в контекстном меню появился пункт "Вставить без форматирования"), народ запомнил комбинацию Ctrl-Shift-V для этого, но "осадочек остался". Я даже дополнил меню кнопкой очистки от всех кодов, но, если сразу не заметить, будет как "выплеснуть ребенка вместе с водой из ванны".
Так что, да, совет писать в режиме ВВ-кодов помогает всегда.
Собсно, вот такой простейший инструмент. На скриншоте в самой верхней части - его изначальный вид.
Чуть ниже - вид при использовании инструмента "маркер" - чтобы выделить цветом фона какой-либо текст. Желтый и красный используются активно.
Третья часть - подсказка по клавишам.
И, да, им редактируется (в т.ч. и создается с ноля) некий список из отдельных позиций, который находится слева (или вверху в моб. версии).
PS: кнопка </> и есть переключатель "WYSIWYG / BBcode".
Сегодня "дошли руки" и прописал "ужатие" отображения для всех картинок, вставленных на форум, до размера 400 пикселей по бо́льшей стороне.
Стало выглядеть гораздо аккуратнее
Тест (исходное 624 * 311)
При загрузке, как и раньше выходит вот такой диалог:
При щелчке по картинке, как и прежде открывается в своем исходном размере. И это правильно. Но... где же 400?
Отредактировано Саид (20.01.2025 14:35:52)
Загрузка картинки - это отдельный скрипт, который может реально обрезать, а может и не обрезать вставляемую картинку.
А отображение картинки в комментарии - это именно отображение в уменьшенном размере, без физического изменения размеров.
<style>
/* Ужатие некликабельных и кликабельных картинок в постах */
.post-content .postimg, .post-content a .postimg {
max-width:400px!important;
max-height:400px!important;
width:auto!important;
height:auto!important;
}
</style>
это все замечательно, но для разных устройств (десктоп, планшет, мобила) жестко задавать в пикселях не есть гуд. Да и функции min() и max() тоже не зря созданы.
У меня было как-то мучение: чтоб текст красиво вписывался в определенные другим текстом рамки, приходилось менять межбуквенный интервал для первого текста вот так:
letter-spacing: clamp(-3px, calc(4vw - 17.2px), -1px);
Боюсь, что и с шириной картинки, если "покрутить" на разных устройствах (от 320 до 1920, как минимум), придется прибегнуть к подобному "волшебству". Хотя для начала достаточно функции max().
форум при нормальном интернете и при отсутствии тормозов на сервере, работает
Не смог удержаться... и, как бывший радиолюбитель, вспомнил типичное заклинание, давным-давно сопровождавшее почти каждую схему. Звучало оно так:
При заведомо исправных деталях, собранная без ошибок схема, в наладке не нуждается.
Излишне упоминать, что налаживать приходилось ВСЕГДА Поэтому, когда впервые прочитал "Закон Мерфи" это стало своего рода Библией айтишника конца 20 века.
это все замечательно, но для разных устройств (десктоп, планшет, мобила) жестко задавать в пикселях не есть гуд. Да и функции min() и max() тоже не зря созданы.
У меня было как-то мучение: чтоб текст красиво вписывался в определенные другим текстом рамки, приходилось менять межбуквенный интервал для первого текста вот так:letter-spacing: clamp(-3px, calc(4vw - 17.2px), -1px);
Боюсь, что и с шириной картинки, если "покрутить" на разных устройствах (от 320 до 1920, как минимум), придется прибегнуть к подобному "волшебству". Хотя для начала достаточно функции max().
Типа max(40%, 400px) ? Идея в целом весьма здравая, попозже попробую её аккуратно приделать в нужное место
А пока что даже просто жёсткое ограничение отображения размера картинки - гораздо лучше, чем вообще ничего, когда огромные линейные размеры вставленных картинок выглядели ужасно
Проценты могут дать не то. Ибо браться они будут от ширины контейнера. Лучше vw - это напрямую от ширины экрана. Аналогия со шрифтом - em и rem.
И.. в responsive web design обычно высоту картинки указывают auto, что не отменяет использование max-height.
Есть еще способы возложить черную работу по вписыванию картинки в жесткие рамки на браузер, но это больше важно для фона (background-image).
Самый авторитетный Кубанский грибной форум был https://gribnikikybani.mybb.ru/
Форум неживой после смерти Золотой рыбки, но пока доступен богатый архив по грибам
Этот форум страдает от старой вёрстки и старых скриптов, конфликтующих с современным состоянием платформы mybb.ru. Там нужно либо переделывать вёрстку под нынешний функционал mybb.ru и под современные стандарты вёрстки, либо просто перейти на одну из предустановленных тем и немножко модифицировать внешний вид под привычный дизайн.
А сейчас там даже тему нельзя создать, нет многих кнопок, сайта с внешними смайликами уже нет, в общем, не работает почти ничего.
Я там написал в теме техподдержки https://gribnikikybani.mybb.ru/viewtopic.php?id=210&p=18#p55037 что могу попытаться помочь в вопросе восстановление функционала форума, пока что нет ответа.
Вообще, можно нам переехать на платный хостинг, поставить туда современный движок форума, а для грибников выделить большую категорию форума со своими разделами и подразделами, типа форум внутри форума но это много усилий, и вопрос, насколько оно было бы нужно
Как я уже говорил, смысл любого форума в долговременном хранении контента, поэтому, если вкладывать более-менее серьёзные усилия в форум как место в Интернете, то лет на 10-20, для более мелких горизонтов полно всяких болталок разного происхождения, это проще, особенно для общения на телефоне
У многих людей сейчас поменялось по 5 айфонов, но нет ни одного компьютера или ноутбука А форумы это всё-таки штука для компьютера или хотя бы для планшета, на телефоне форумам тесновато, и не совсем понятно, насколько нужно адаптировать интерфейс для мобильного использования (или вообще это должен быть отдельный интерфейс к общей базе данных, или даже отдельное приложение на телефон со своей логикой взаимодействия) и насколько глубока эта мобильная кроличья нора Но это тема отдельной беседы
Отредактировано Мерлин (24.01.2025 13:41:25)
Что скажут спецы по поганкам?
Я не большой спец по поганкам и фото чересчур цветастое, но... Вижу 2 варианта: 1) Гимнопил Юноны - несъедобный, ибо горький по-жизни)); 2) ложный опенок кирпично-красный - слабоядовитый, но можно съесть, отварив дважды с промывкой проточной водой 
Отредактировано Искандер (24.01.2025 14:42:55)
Всего лишь фото грибов - а как подействовало! Пошли галлюцинации...
если вкладывать более-менее серьёзные усилия в форум как место в Интернете, то лет на 10-20
Кроме как в детей вкладывать что-то с расчетом на 10-20 лет нынче бесполезняк. Даже недвижимость.
и не совсем понятно, насколько нужно адаптировать интерфейс для мобильного использования (или вообще это должен быть отдельный интерфейс к общей базе данных, или даже отдельное приложение на телефон со своей логикой взаимодействия) и насколько глубока эта мобильная кроличья нора
Да нет никакой норы, есть RWD, помогающий сделать практически два разных вида сайта из одних и тех же элементов.
У многих людей сейчас поменялось по 5 айфонов, но нет ни одного компьютера или ноутбука
Надо с этим бороться, или надо это учитывать?
Раз уж тема с грибов перешла на... вот это вот всё, то вот свежие данные с моего коммерческого сайта:
Мобилы - 82% Из 14 попавших в фильтр (я ограничиваю выдачу в отчет, но не сбор данных) разрешений экрана всего 4 выдают десктопы.
Кроме как в детей вкладывать что-то с расчетом на 10-20 лет нынче бесполезняк. Даже недвижимость.
При чём тут дети и недвижимость, если речь идёт о программах в интернете.
Да нет никакой норы, есть RWD, помогающий сделать практически два разных вида сайта из одних и тех же элементов.
Responsive web design это инструмент для формирования дизайна при разных габаритах устройства просмотра, на основе "резиновых" элементов, относительных размеров и перестановки места, где эти кусочки будут показываться. Я же говорю про сам дизайн для мобильных устройств.
Дизайн форума для компьютеров прекрасно подходит для длинных текстов с кучей картинок, цитат и ссылок. Но контент для просмотра на телефоне и генерируемый на телефоне обычно имеет гораздо меньший размер, пользователи общаются почти всегда небольшим куском текста, может с одной картинкой или с одним видео - которые удобно вставлять в отправляемое сообщение. Это принципиальная разница, которую авторы в Телеграме решают, например, засовыванием контента под сообщение в канале (аналог для форума - разбивание контента на несколько сообщений внутри заголовочной темы). Возможно, "дизайн" для мобилки должен будет сам разбивать крупные блоки текста на более мелкие сообщения.
С видео тоже вопрос, где его хранить, ибо для болтовни в стиле телеграма никакого места на хостинге не хватит, как вариант - хранить в условно бесконечном хранилище (в телеграме) и ссылаться на него на форуме.
Разделы - для форума для компов 20, 30 и даже 50 разделов на главной странице вообще не проблема, а для мобильника это неудобно, надо их группировать в более крупные группы, или как вариант, показывать темы по выбранным тегам (но это напрямую ведёт к фрагментации сообщества).
Так что, вопросов тут больше, чем ответов, а RWD это просто хороший инструментарий, который не заменяет вопросов архитектуры программы в интернете, желаемого user interface и комфортного user experience.
Но это всё актуально, конечно, если глубоко копать А можно и не копать
Отредактировано Мерлин (24.01.2025 16:38:08)
речь идёт о программах в интернете.
именно про них я и высказался.
... и перестановки места, где эти кусочки будут показываться.
Или не показываться вообще. Надеюсь, Mobile First - тоже (как и RWD) не пустой звук? Загляни сюда. Готового шаблона для форума там скорее всего нет, но идей наберешься.
Кстати, а вот прям этот дизайн, который сейчас - он что, совсем никудышний?
Отредактировано Саид (24.01.2025 17:05:03)
Перенёс нетематические сообщения из профильного раздела.
:Ну так два вопроса и остались:
- что не так с этим дизайном в плане мобил?
- нашел ли вдохновение на Themeforest ?
По второму вопросу - да, там всё платное. И я даже кое-что покупал. Но больше - воровал. Стариннвя программа Teleport VLX неплохо качает шаблон, чтоб потом с ними спокойно разобраться и модифицировать под свои нужды. Есть, конечно же и методы защиты, особенно по JS, но не все авторы прибегают к ним.
По шаблону Canvas у меня карт-бланш. Я его черти когда купил, могу скачивать все новые версии. Прям сейчас опять скачал зачем-то (1 Гб. в zip) 73,133 продаж, однако!
Или не показываться вообще. Надеюсь, Mobile First - тоже (как и RWD) не пустой звук?
Посмотрел на форум в мобильном виде... перегружен прилично. Т.е. когда уже в конкретной теме, читать писать норм, но чтоб до нее добраться - надо иметь привычку.
1. Меню "гамбургер" сделано в расчете на ловкие пальчики. Dropdown там - не лучшее решение. Уж лучше, ИМХО, выдвигающаяся сбоку на 0,5...0,75 ширины экрана панель на всю высоту экрана. Туда же можно засунуть и некоторые другие элементы.
2. Общее решение - продублировать текстовые элементы в сокращенном изложении. Вот мой пример:
CSS
/* для мобил */
.show-on-large{display:none!important}
/* для десктопов */
@media only screen and (min-width:1200px){
.hide-on-large-only{display:none!important}
.show-on-large{display:inline-block!important}
}
HTML
…. title="Умное округление"><span class="hide-on-large-only">SR</span><span class="show-on-large">Smart Round (и еще куча текста)</span>
Кстати, я заметил, что прежние пороги переключения дизайна (360px, 576, 1024...) сейчас уже не имеют большого смысла. На данный момент 360px - лидер, наверное с ростом технологий следующим будет что-то в р-не 400+. А потом - сразу десктопы/ноуты от 1280 (редко) и выше.
Это все имеет смысл, если хочешь помочь пользователям. Я уважаю и тех, кто еще не дорос даже до 360. А максимальнуб ширину сайта фиксирую на 1400px. Есть такое золотое правило при чтении текста, чтоб не мучились глаза при переходе на новую строку: 60 - 80 ЗНАКОВ НА СТРОКЕ. Для форумов это тем более важно.
выдвигающаяся сбоку
Много идей для frontend бывает на CodePen. Вот одна из них.
Ну или просто в их поиске забить "sliding menu", вылезут и другие варианты. Причем эффекты можно и самому новые додумать, ибо CSS transform много чего позволяет/
Например, на одном из моих сайтов меню не выезжает сбоку, а появляется во вращении вокруг вертикальной оси. Создается впечатление, что основной экран и меню просто на разных плоскостях этой "двери - вертушки". А все, что надо - добавить класс mobile к body. И тогда...
.mobile #menu {
visibility: visible;
opacity: 1;
transform-style: preserve-3d;
transform: rotateY(360deg);
}
Вот слабое подобие этого на CodePen: https://codepen.io/darkwing/pen/DrNEzy В поиске попробуй "flip menu"
нашел ли вдохновение на Themeforest ?
Спасибо за источник, посмотрю повнимательнее чуть попозже)) Идеи с меню тоже прикольные 
что не так с этим дизайном в плане мобил?
"Не так" с дизайном в целом вообще)) я постоянно лазию с напильником и что-то допиливаю, и конца этому не видно Это как ремонт, который невозможно закончить, можно только прекратить
Поэтому у меня периодически появляется идея просто поставить современный движок на обычном недорогом хостинге, там хоть многие "детские болезни" решены "из коробки".
Исходные коды, привносящие стандартному виду форума дополнительный функционал и дизайн, открыты, структурированы и выложены в открытый доступ.
Коды разного происхождения (в т.ч. из головы), и некоторые модифицированы относительно первоисточников.
Можно копировать для себя, если кому-то это надо, или предлагать свои варианты улучшения
Идеи с меню тоже прикольные
они не прикольные, а просто более логичные для мобилы. Дропдаун (который есть сейчас) я проверял на живых клиентах, на сотрудниках заказчика - все орали, что им надо четкое, а не "куда-то пропадающее" меню. Потом орать перестали, и я понял почему - устали, перестали им пользоваться.
Удачу я нашел (в случае с коммерцией) в виде меню, закрепленного внизу экрана. Но там по ширине с трудом влазят 5-6 кнопок. С иконками и подписями. Чтоб и красиво и информативно. Поэтому "для души" на своем сайте я сделал "дверь-вертушку".
Как среднее между этими решениями - выдвигающееся сбоку меню. Триггером служит тот же гамбургер, но ему не надо превращаться в крестик, ибо свой крестик есть на выдвигающейся панели. Согласись, что 700+ пикселей высоты на неподвижном меню позволяют впихнуть что хочешь. И пользователю удобно - не надо ловить миг удачи, пока от тебя не сбежало меню.
Вот это всё - чистое художество. А люди - просто тупо листают....
Merlin, я выделил из своего сайта меню "вертушку" и залил на свободный хостинг. В качестве разделов меню просто набросал 5-6 пунктов чего в голову пришло и удвоил. Получилось 10 пунктов, плюс подвальчик.
Чтобы посмотреть мобильное меню, перейди в режим эмуляции мобилы (в Хроме Ctrl-Shift-I, затем Ctrl-Shift-M, в Firefox сразу Ctrl-Shift-M). Дальше разберешься. CSS, HTML, м один Image можешь сохранить и колдовать дальше в оффлайне.
Переключать класс активного пункта меню можно как в JS, так и в PHP - как больше нравится.
ЗЫ: текст на странице - не шифровка
Отредактировано Саид (02.02.2025 23:12:56)
Merlin, я выделил из своего сайта меню "вертушку" и залил на свободный хостинг. В качестве разделов меню просто набросал 5-6 пунктов чего в голову пришло и удвоил. Получилось 10 пунктов, плюс подвальчик.
Чтобы посмотреть мобильное меню, перейди в режим эмуляции мобилы (в Хроме Ctrl-Shift-I, затем Ctrl-Shift-M, в Firefox сразу Ctrl-Shift-M). Дальше разберешься. CSS, HTML, м один Image можешь сохранить и колдовать дальше в оффлайне.
Переключать класс активного пункта меню можно как в JS, так и в PHP - как больше нравится.
ЗЫ: текст на странице - не шифровка
Большое спасибо, я попозже попробую с этим что-нибудь сделать:)
Чуть попозже я покажу скрины, как наиболее распространённые в мире форуме выглядят на мобил, для сравнения в одном месте, так сказать:)
В любом случае, для данного форума в мобильном виде есть ползунок изменения размера шрифта в комментариях, это очень удобно и можно даже назвать имбой:)
Исправлено отображение мини-картинки аватара в цитате, стало аккуратнее
Добавил ещё панельки со сторонними смайликами (колобки) . На компе смотрится нормально, в мобильной версии похуже, но пока что так 
Добавил ещё панельки
Лучше бы ты добавил Горбачева. И не говори, что не понимаешь, о чем это. Тогда это помогло, поможет и сейчас.
| ОФФ. Болталка | 👑Политический форум | 29.09.2025 |
Вы здесь » kuban-forum.ru - Лучший форум для общения » 🍰Кофейня » Новости форума и обсуждение его работы
