Перейти к содержимому


Новости На Главной


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 9

#1 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 25 Июль 2016 - 19:56

Аккаунт SL-368333

Здравствуйте. Необходима коррекция блока новостей на главной странице.

1. Убрать вывод даты публикации (в редакторе убрал галочку "Показывать дату создания новости" но дата показывается)
2. Показ новостей в 4 блока по горизонтали в десктопной версии и по вертикали в мобильной. (скрин прилагаю)

Спасибо

Прикрепленные изображения

  • news.jpg


#2 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Июль 2016 - 01:57

В шаблоне HTML найдите и удалите:
<div class="date">
						<span class="d-day">{news_list_mass_media.TIME | date("d")}</span>
						<span class="d-month">{news_list_mass_media.TIME | date("m")}</span>
					  </div>

<div class="date">
						<span class="d-day">{news_list_articles.TIME | date("d")}</span>
						<span class="d-month">{news_list_articles.TIME | date("m")}</span>
					  </div>

<div class="date">
						<span class="d-day">{news_list_shop.TIME | date("d")}</span>
						<span class="d-month">{news_list_shop.TIME | date("m")}</span>
					  </div>

<div class="date">
						<span class="d-day">{news_list_all.TIME | date("d")}</span>
						<span class="d-month">{news_list_all.TIME | date("m")}</span>
					  </div>

Уточните пожалуйста, актуален ли вопрос по количеству выводим новостей, так как на данный момент у вас выводится по 4 новости?

#3 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 26 Июль 2016 - 06:53

Просмотр сообщенияVaccina (26 Июль 2016 - 01:57) писал:

В шаблоне HTML найдите и удалите:
<div class="date">
					 <span class="d-day">{news_list_mass_media.TIME | date("d")}</span>
					 <span class="d-month">{news_list_mass_media.TIME | date("m")}</span>
					 </div>

<div class="date">
					 <span class="d-day">{news_list_articles.TIME | date("d")}</span>
					 <span class="d-month">{news_list_articles.TIME | date("m")}</span>
					 </div>

<div class="date">
					 <span class="d-day">{news_list_shop.TIME | date("d")}</span>
					 <span class="d-month">{news_list_shop.TIME | date("m")}</span>
					 </div>

<div class="date">
					 <span class="d-day">{news_list_all.TIME | date("d")}</span>
					 <span class="d-month">{news_list_all.TIME | date("m")}</span>
					 </div>

Уточните пожалуйста, актуален ли вопрос по количеству выводим новостей, так как на данный момент у вас выводится по 4 новости?
Да, должно быть 4 новости как сейчас, только надо выстроить по горизонтали в одну строчку как на скрине выше. И, конечно, должно быть адаптировано для мобильной версии.

#4 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 26 Июль 2016 - 13:16

Просмотр сообщенияAst (26 Июль 2016 - 06:53) писал:

Да, должно быть 4 новости как сейчас, только надо выстроить по горизонтали в одну строчку как на скрине выше. И, конечно, должно быть адаптировано для мобильной версии.
Здравствуйте.
в main.css найдите код
#botsl .block.block-latestblog .block-content ul .item {
	float: left;
	width: 100%;
}
и замените на
#botsl .block.block-latestblog .block-content ul .item {
	float: left;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
так же найдите
#botsl .block.block-latestblog .block-content ul .item .item-post {
	position: relative;
	padding: 11px 0px 19px 65px;
	float: left;
	width: 40%;
	margin-left: 5%;
}
и замените на
#botsl .block.block-latestblog .block-content ul .item .item-post {
	position: relative;
	padding: 11px 0px 19px 0px;
}


#5 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 26 Июль 2016 - 14:02

Просмотр сообщенияDanil (26 Июль 2016 - 13:16) писал:

Здравствуйте.
в main.css найдите код
#botsl .block.block-latestblog .block-content ul .item {
float: left;
width: 100%;
}
и замените на
#botsl .block.block-latestblog .block-content ul .item {
float: left;
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
так же найдите
#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 65px;
float: left;
width: 40%;
margin-left: 5%;
}
и замените на
#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 0px;
}

Спасибо, все получилось как хотел. Но можно сделать чтобы каждый блок новостей имел одинаковый размер по ширине? Сейчас ширина блока зависит от длины заголовка. Лучше пусть длинный заголовок опускается на вторую строку, но расстояния между картинками будут одинаковые. Можно поправить? Спасибо.

#6 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 26 Июль 2016 - 14:23

Просмотр сообщенияAst (26 Июль 2016 - 14:02) писал:

Спасибо, все получилось как хотел. Но можно сделать чтобы каждый блок новостей имел одинаковый размер по ширине? Сейчас ширина блока зависит от длины заголовка. Лучше пусть длинный заголовок опускается на вторую строку, но расстояния между картинками будут одинаковые. Можно поправить? Спасибо.
В main.css найдите код
#botsl .block.block-latestblog .block-content ul .item .item-post {
	position: relative;
	padding: 11px 0px 19px 0px;
}
и замените на

#botsl .block.block-latestblog .block-content ul .item .item-post {
	position: relative;
	padding: 11px 0px 19px 0px;
	width: 250px;
}
изменяйте значение 250px(ширина блока).

#7 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 26 Июль 2016 - 14:44

Просмотр сообщенияDanil (26 Июль 2016 - 14:23) писал:

В main.css найдите код
#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 0px;
}
и замените на

#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 0px;
width: 250px;
}
изменяйте значение 250px(ширина блока).

Спасибо, все отлично!

#8 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 26 Июль 2016 - 16:14

Просмотр сообщенияDanil (26 Июль 2016 - 14:23) писал:

В main.css найдите код
#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 0px;
}
и замените на

#botsl .block.block-latestblog .block-content ul .item .item-post {
position: relative;
padding: 11px 0px 19px 0px;
width: 250px;
}
изменяйте значение 250px(ширина блока).

С новостями все получилось хорошо, но сейчас стало ясно, что форма обратной связи оказалась над новостями, что ломает восприятие. Можно поменять местами форму обратной связи и блок новостей? Причем форму обратной связи  нужно положить на подвал без зазора. Получится?

#9 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 26 Июль 2016 - 20:22

Просмотр сообщенияAst (26 Июль 2016 - 16:14) писал:

С новостями все получилось хорошо, но сейчас стало ясно, что форма обратной связи оказалась над новостями, что ломает восприятие. Можно поменять местами форму обратной связи и блок новостей? Причем форму обратной связи  нужно положить на подвал без зазора. Получится?
В шаблоне html найдите код
Скрытый текст
и замените на
Скрытый текст
В main.css найдите код
#content {
	margin: 30px 0;
	position: relative;
	z-index: 0;
	min-height: 235px;
}
и замените на
#content {
	margin: 30px 0 0 0;
	position: relative;
	z-index: 0;
	min-height: 217px;
}


#10 Ast

Ast

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 253 сообщений

Отправлено 26 Июль 2016 - 21:21

Просмотр сообщенияDanil (26 Июль 2016 - 20:22) писал:

В шаблоне html найдите код
Скрытый текст
и замените на
Скрытый текст
В main.css найдите код
#content {
margin: 30px 0;
position: relative;
z-index: 0;
min-height: 235px;
}
и замените на
#content {
margin: 30px 0 0 0;
position: relative;
z-index: 0;
min-height: 217px;
}
Спасибо! Отлично




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных