Кнопки соц сетей

Здесь обсуждается форумный движок phpBB различных версий. В дальнейшем, если понадобится, форум будет вынесен в отдельный подраздел и разбит на категории.
Ответить
Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#1

Сообщение tvq12 » 24 июн 2019, 18:35

Подскажите пожалуйста, как применительно к phpBB вставить кнопки соц сетей? За основу взял информацию вот отсюда https://inter-net.pro/css/knopki-sotssetej-dlya-sajta На сайт всё стало без проблем, а для форума пока не получается.

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#2

Сообщение DesignerMix » 25 июн 2019, 10:41

Эту тему смотрели? - viewtopic.php?t=981

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#3

Сообщение tvq12 » 25 июн 2019, 14:42

Это не то, что я хочу. Там устанавливаются кнопки с функцией "поделиться". А мне надо что-то типа такого: "Мы в соцсетях" и по кнопке переход на мою страницу в соцсетях. Кроме всего во всех расширениях отсутствует Инстаграм, а мне он нужен.

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#4

Сообщение DesignerMix » 25 июн 2019, 15:23

tvq12, не знаю как на счет расширений, но то, что вы сказали можно сделать правкой файлов темы оформления, если например используется тема на основе prosilver и если в этой теме не собственный файл overall_header.html то можно открыть его по пути папка_с_форумом\styles\prosilver\template\overall_header.html и после строк:

Код: Выделить всё

			</div>
			<!-- EVENT overall_header_headerbar_after -->
		</div>
		<!-- EVENT overall_header_navbar_before -->
		<!-- INCLUDE navbar_header.html -->
	</div>
добавить нужный вам код с картинками соцсетей и ссылками на них.

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#5

Сообщение tvq12 » 25 июн 2019, 15:54

Кнопки вставились, но я не знаю, как применить к ним стили. На сайте в стили добавлял такой код:
.social__button {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.social a {
display: flow-root;
width: 46px;
height: 46px;
margin: 0 10px 10px 0;
padding: 6px;
text-align: center;
background: #fff;
color: #000;
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0,0,0,0.15), inset 0 0 50px rgba(0,0,0,0.1);

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#6

Сообщение DesignerMix » 25 июн 2019, 17:57

В какой файл стилей добавляли код (нужно имя и путь до файла)? И очищали-ли кэш браузера и форума сэпосле изменения файла стилей?

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#7

Сообщение tvq12 » 25 июн 2019, 18:18

В тот-то и дело, что ни в какой. Не знаю куда добавить для форума.
И ещё, если добавляю код кнопок в overall_header.html (как посоветовали вы), то слова "Мы в соцсетях" отображаются нормально, если пробую в overall_footer.html (как хотелось бы мне), то отображаются кракозябриками.

Отправлено спустя 14 минут 8 секунд:
Что бы было понятнее о чём я говорю добавлю скрины.

Это header

Изображение

Это footer

Изображение

Отправлено спустя 3 минуты 43 секунды:
А задумано всё так:

Изображение

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#8

Сообщение DesignerMix » 25 июн 2019, 23:53

Дайте ссылку на форум, чтобы я сказал куда добавлять

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#9

Сообщение tvq12 » 26 июн 2019, 00:00


Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#10

Сообщение DesignerMix » 26 июн 2019, 00:19

Я так подумал, а зачем париться вообще, просто оформите стили вот так:

Код: Выделить всё

<style type="text/css">
.social__button {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.social a {
display: flow-root;
width: 46px;
height: 46px;
margin: 0 10px 10px 0;
padding: 6px;
text-align: center;
background: #fff;
color: #000;
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0,0,0,0.15), inset 0 0 50px rgba(0,0,0,0.1);
</style>
Добавьте это в тот файл который я сказал ПОСЛЕ кода который я указывал и ПЕРЕД кодом кнопок к которым этот стиль должен применяться

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#11

Сообщение tvq12 » 26 июн 2019, 11:46

Спасибо. Стили сработали. И уже в принципе так можно жить :D
Осталось две небольшие проблемы. Первая - это не меняется цвет кнопок при наведении курсора (на сайте меняется). Вторая - если размещать в футере, то текст отображается кракозябриками.

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#12

Сообщение DesignerMix » 26 июн 2019, 12:02

tvq12 писал(а):
26 июн 2019, 11:46
Первая - это не меняется цвет кнопок при наведении курсора (на сайте меняется)
А с чего ему меняться? В ваших стилях это не описано!
tvq12 писал(а):
26 июн 2019, 11:46
Вторая - если размещать в футере, то текст отображается кракозябриками.
Не в той кодировке сохраняете файл. Попробуйте UTF без BOM.

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#13

Сообщение tvq12 » 26 июн 2019, 12:48

Со сменой цвета извиняюсь. Потерял кусок кода стилей

Код: Выделить всё

.youtube a:hover {background: #c4302b; color: #fff;}
.twitter a:hover {background: #00acee; color: #fff;}
.instagram a:hover {background: #3f729b; color: #fff;}
.facebook a:hover {background: #3b5998; color: #fff;}
А вот с кодировкой не понял. Я открываю файл header и footer абсолютно одинаково через Notepad2, пишу эту надпись "Мы в соцсетях" руками и закрываю файл с сохранением. Где я теряю кодировку и как мне это поправить?

Аватара пользователя

DesignerMix
Администратор
Администратор
Сообщения: 6290
Зарегистрирован: 25 апр 2014, 10:51
Есть ответ: 215
Репутация: 721
Откуда: Белгород
Контактная информация:
Статус: Не в сети

Кнопки соц сетей

#14

Сообщение DesignerMix » 26 июн 2019, 12:51

tvq12 писал(а):
26 июн 2019, 12:48
Notepad2
Сам им не пользуюсь, но нашел в FAQ что это делается через меню File -> Encoding.

Аватара пользователя

Автор темы
tvq12
Постоянный пользователь
Сообщения: 128
Зарегистрирован: 16 ноя 2015, 17:02
Есть ответ: 1
Репутация: 6
Статус: Не в сети

Кнопки соц сетей

#15

Сообщение tvq12 » 26 июн 2019, 13:23

Большое спасибо вам. Всё получилось.

Ответить

Вернуться в «Движок phpBB»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 1 гость