Question

Присмотрел адаптивный дизайн #1722, но его нужно сделать максимально удобным и компактным, особенно для мобильных устройств. Подскажите, пожалуйста, где и что поменять. Заранее спасибо большое! Сразу общие вопросы - для десктопа и телефона.

1. Как убрать с главной промо-блок и сделать, чтобы главная страница выглядела как все остальные?

2. Как уменьшить шрифт заголовков (везде кроме форума) примерно на четверть?

3. Как уменьшить высоту боковых блоков - убрать лишнее пустое пространство?

А дальше вопросы по адаптивному отображению шаблона на телефоне.

4. Как на главной странице форума сделать 3 колонки: Форум, Темы, Ответы?

5. Как на форуме в списке тем добавить колонку, в которой отображается количество ответов/просмотров (через | или в две строки)? Идея в том, чтобы сделать эту колонку адаптивно-узкой, чтобы не мешала отображению названия темы.

6. Как на форуме в теме с ответами сделать максимально компактным блок с инфой о пользователе? В первой строке: ник, дата и время (только цифры, без слов), # сообщения. Второй строкой: значок группы, название группы, статус, кол-во сообщений.

7. Как убрать аватарки (но чтобы в десктопной версии остались)?

8. Как убрать лишнее пустое место между сообщениями на форуме, и поставить явный разделитель (жирную черту что ли) между сообщениями?

9. Можно ли для неавторизованных убрать кнопки под сообщением – профиль, www, ЛС, вверх?

10. Как уменьшить шрифт названия сайта при просмотре с телефона?

Answer 1

1. Перейти в шаблон: http://234.usite.pro/panel/?a=tmpl&m=2&t=0 найти и удалить код:

 <!-- <global_promo> -->
 <?if($PAGE_ID$='sitePage1')?>
 <section>
 <div class="promo-wrap">
 <div class="promo">
 <div class="caption">
 <div class="cap-ds description">Vestibulum iaculis lacin</div>
 <div class="cap-ttl">Lorem ipsum</div>
 <div class="cap-ds"><a role="button" href="#">More</a></div>
 </div>
 </div>
 <div class="mouse-wrap">
 <a href="#" class="mouse-scroll"></a>
 </div>
 <div class="parallax-wrap"></div>
 <div class="second-parallax-wrap"></div>
 <div class="third-parallax-wrap"></div>
 <div class="fourth-parallax-wrap"></div>

 </div>
 </section>
 <?endif?>
 <!-- </global_promo> -->

2. Нужны конкретные примеры, мы не можем за вас ходить и искать по всему сайту заголовки непонятно какие.

3. В стилях ищем строку номер 110:

.sidebox {
    margin: 30px 0;
    position: relative;
    -webkit-box-shadow: 0 10px 20px rgba(217,213,230,0.5);
    box-shadow: 0 10px 20px rgba(217,213,230,0.5);
    border-radius: 7px;
    background-color: #fafaff
}

уменьшаем значение 30 на сколько нужно.

4. То есть колонку обновления хотите полностью убрать ?

5. Это доступно только внутри форумов, на главной форума это не доступно системно, пример http://234.usite.pro/forum/2

По остальным вопросам обратитесь к специалистам: https://divly.ru/ там помогут доработать сайт под ваши требования.

Comments

Yuri_Geruk,

Да, спасибо большое. Еще несколько проблем шаблона, которые не знаю, как решить:

1. На странице поиска значок поиска наложен поверх значка меню. Я так понимаю, это значок должен быть в окне поиска справа, как в стандарнтной форме поиска.

2. Текст выезжает влево за границы в модулях: поиск, Каталог статей, Блог. Если с мобильного смотреть.

3. На форуме в каждом последнем сообщении темы отсутствует линия после строки "ник, дата, время, номер сообщения". Пример.

4. На форуме исчезает строка с адресом, когда смотришь с телефона. Это и в темах, и в разделах.

Заранее спасибо!

---

Эзотерик Лэнд,

1. В стилях строка номер 82:

#casing input.searchSbmFl[type='submit'],.searchForm .searchSbmFl {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    padding: 0;
    margin: 0;
    width: 42px!important;
    height: 36px;
    border: 0;
    border-radius: 0 3px 3px 0;
    white-space: nowrap;
    text-indent: 150%;
    overflow: hidden;
    background: #ab0202 url(/.s/t/1722/sch.png) 50% no-repeat!important
}

удалить красное.

2. В стили в самый низ новой строкой пропишите:

@media screen and (min-width: 240px) and (max-width: 650px) { .eMessage,.eText,.cMessage,.eTitle,.eDetails {margin-left: 30px;} }

3. В стилях удалить строку номер 371:

.gTable:not(#shop-price-list) tr:last-child td {
    border-bottom-color: transparent!important;
}

4. Непонятно о чем вы говорите. Хорошо бы скриншоти выделить на нем проблему, что именно исчезает и как должно быть.

---

Yuri_Geruk,

Третий вопрос решен, спасибо. Остались эти:

1. Не сработало, см. скрин #1. На странице поиска стало норм, а в остальных местах съехало везде. Отменил изменения.

2. Тоже не сработало. Изменения сохранены.

4. Вот эта строка адреса на форуме исзезает, когда сжимаешь браузер на компе наполовину; и на телефоне ее нет. Можно сделать, чтобы она не исчезала?

---

Yuri_Geruk,

Съезжание текста сам уже устранил, пока ждал ответа.

Остались вопросы:

1. На странице поиска значок поиска наложен поверх значка меню. Проблема только на странице поиска. Во всех остальных местах форма поиска отображается нормльно. Где что нужно исправить?

2. Строка адреса на форуме исчезает, когда сжимаешь браузер на компе наполовину; и на телефоне ее тоже нет. Можно сделать, чтобы она не исчезала? Скрин в предыдущем сообщении.

Спасибо.

---

Эзотерик Лэнд,

Если не помогло, тогда обращайтесь к специалистам: https://divly.ru/ там помогут с адаптацией шаблона. Мы чем могли тем помогли.