Перейти к публикации
Дизайн и модификация IPS Community IPBSkinsBETA
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...
wick

Изменить вид хука

Рекомендованные сообщения

есть хук "топ авторов за месяц" выводит информацию в блок вот так:

post-57740-0-41151000-1425683746_thumb.jpg

 

так же есть хук "Активные авторы сегодня" который выводит информацию так:

post-57740-0-21843300-1425683809_thumb.jpg

 

и есть только внешний вид изменённого хука "топ авторов за месяц" который выглядит так:

post-57740-0-10153200-1425683794_thumb.jpg

 

Задача сделать так, что бы первый хук выглядел так как на втором или на третьем скриншоте, что бы не было пустого места с правой стороны и имена пользователей шли в 2 столбика, который имеют фиксированную ширину, дабы если у пользователя имя длиннее, что бы вёрстка не съезжала.

 

Если кто то сможет это реализовать, сделать из двух одно, напишите стоимость этой работы в лс.

Поделиться сообщением


Ссылка на сообщение

Установить размер блока, так чтобы в один ряд их поместилось два + обтекание по левому краю float: left.

  • Upvote 1

Поделиться сообщением


Ссылка на сообщение

Установить размер блока, так чтобы в один ряд их поместилось два + обтекание по левому краю float: left.

Сколько будет стоить реализовать это? так как из написанного не совсем понимаю, что и где надо сделать). Спасибо

Поделиться сообщением


Ссылка на сообщение

помогите пожалуйста, а то пустое место в этом блоке создаёт не приятное ощущение )

 

Вот эти 2 хука надо привести к нормальному виду, что бы пользователи были в 2 столбца а не в один.

hook.xml- Top Posters

topMonthlyPosters.xml- top Monthly Posters

Поделиться сообщением


Ссылка на сообщение

Установил оба и оба одинаковы (в 1 колонку)

post-57438-0-33149700-1425999900_thumb.jpg

 

Задаем для нужного li свойство float:left

post-57438-0-60751600-1425999989_thumb.jpg

 

Ну а далее, как и сказал siv1987 выше, задать ширину, отступы...

 

Раз у вас второй блок изменен как надо - может, просто сделать по примеру и скорее всего будет достаточно в шаблоне первого хука ( Список форумов --> topMonthlyPosters ) указать нужный класс (от второго хука), чтобы применить к нему те же css свойства. Можете в лс ссылку на форум, где стоят эти хуки - посмотрим, может действительно все намного проще.

 

Или же сами:

шаблон:

Список форумов --> topMonthlyPosters

минимально нужные css для элементов li в этом шаблоне:

float: left;

width: ...px;

Поделиться сообщением


Ссылка на сообщение

отправил в лс, но по Вашему варианту, это всё дело разъедится в хаотичном порядке в зависимости от длинны имени пользователя, тут видимо только надо настраивать css для хуков и делать для каждого столбца свою таблицу либо как то так, но сделав разные таблицы как в них распихивать всё в нужной последовательности тоже пока не понимаю

Поделиться сообщением


Ссылка на сообщение
03/10/15 19:47 (изменено)

Такой вариант:

 

1) Редактируем шаблоны хуков для вашего стиля (приписываем свой класс дивам)

 

"Список форумов --> topMonthlyPosters"

 

самую первую строку

<div class='ipsSideBlock clearfix'>

заменяем на:

<div class='ipsSideBlock clearfix twocolumn'>

 

 

"Список форумов --> hookTopPosters"

 

вторую строку

<div class='ipsSideBlock clearfix'>

заменяем на:

<div class='ipsSideBlock clearfix twocolumn'>

 

 

2) В ipb_styles.css для данного стиля в самом низу добавляем:

 

/* two columns view for hooks */

.twocolumn > div > ul > li {
float: left;
width:119px;
overflow: hidden;
}
.twocolumn > div > ul > li:nth-child(odd) {
margin-right:10px;
}
.twocolumn > div > ul > li > .list_content {
word-wrap: normal;
}
.twocolumn > div > ul > li > .list_content > .ipsType_smaller  > a {
font-size: 13px !important;
}

 

 

3) Сокращаем и приводим надписи к одному виду:

 

В хуках используются надписи "ххх сообщений" и "Написал сообщений: ххх" - надо бы свести к чему-либо одному и желательно сократить. Я бы предложил заменить на "ххх постов" или "ххх сообщ."

 

Для этого

 

в шаблоне "Список форумов --> topMonthlyPosters" строку

{parse format_number="$r['posts']"} {$this->lang->words['posts']}

меняем на

{parse format_number="$r['posts']"} сообщ.

 

в шаблоне "Список форумов --> hookTopPosters" строку

<div class='list_content'><p class='desc ipsType_smaller'>{$this->lang->words['tp_p']}: {parse format_number="$tp['postis']"}</p></div>

меняем на

<div class='list_content'><p class='desc ipsType_smaller'>{parse format_number="$tp['postis']"} сообщ.</p></div>

 

ПС: почему не через редактирование языка? Проще да и фраза может использоваться еще где-то.

 

 

4) Изменяем количество выводимых "авторов"

 

по умолчанию выводиться 5, а нам для красоты надо четное число (так как колонок у нас уже две)

 

Идем

"Система --> Управление хуками --> Изменить настройки: Top Posters" в поле "Пользователей в блоке:" ставим 6 (или 8 или 10 ... четное число)

"Система --> Управление хуками --> Изменить настройки: (SOS34) Monthly Top Posters" в поле "Number of Users" ставим 6 (или 8 или 10 ... четное число)

 

post-57438-0-07212700-1426017140_thumb.jpg

длинные имена будут обрезаться

 

---

ППС: на изящность решения и кода не претендую

Изменено пользователем Viktar83
  • Upvote 2

Поделиться сообщением


Ссылка на сообщение

Спасибо! Это то что надо, буду мучать завтра, сейчас дорисовываю иконки к форумам, мозги уже не соображают )

Поделиться сообщением


Ссылка на сообщение

Сделал но почему то получилось большое расстояние между пользователями, как его сократить?

post-57740-0-15986400-1426038175_thumb.jpg

Поделиться сообщением


Ссылка на сообщение

Сделал но почему то получилось большое расстояние между пользователями, как его сократить?

Потому что в ipb_styles.css
.ipsSideBlock ul li {
margin: 15px 0 15px 0;
}

  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
03/11/15 07:06 (изменено)

Потому что в ipb_styles.css

.ipsSideBlock ul li {
margin: 15px 0 15px 0;
}

что надо сделать скажите пожалуйста

 

 

вроде разобрался

 

исправил на margin: 5px 0 5px 0

вроде нормик стало, только длинные ники сдвигают количество сообщений вних ( , если бы можно было бы сделать как сто бы ник просто обрезался

Изменено пользователем wick

Поделиться сообщением


Ссылка на сообщение

Потому что в ipb_styles.css

.ipsSideBlock ul li {
margin: 15px 0 15px 0;
}

Да. тогда можно дописать например:

 

.twocolumn > div > ul > li {

float: left;

width:119px;

overflow: hidden;

margin: 5px 0;

}

 

---

ПС

Из-за того, что ко всем элементам li применено свойство обтекания, родительский ul "схлопнулся" и соответственно пропали границы (border) у блока,

поэтому можно в тех обоих шаблонах строку

<ul class="ipsList_withminiphoto">

заменить на

<ul class="ipsList_withminiphoto clearfix">

  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
03/11/15 07:17 (изменено)

Длинный ник обрежется, а вот тот, который из нескольких слов состоит...

Как вариант чуть уменьшить размер шрифта, как на втором хуке

Изменено пользователем Viktar83
  • Upvote 1

Поделиться сообщением


Ссылка на сообщение
03/11/15 07:23 (изменено)

<ul class="ipsList_withminiphoto">

заменить на

<ul class="ipsList_withminiphoto clearfix">

на эти изменения ни как не реагирует

 

может можно сделать как ограничение на количество выводимых символов?

Изменено пользователем wick

Поделиться сообщением


Ссылка на сообщение

может можно сделать как ограничение на количество выводимых символов?

http://htmlbook.ru/css/text-overflow

Там же можете часть кода и примера взять

  • Upvote 1

Поделиться сообщением


Ссылка на сообщение

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...