Мини-профиль системный шаблон 1718 | |
Данный простой профиль изменяет социальные иконки в верхней части сайта. Мне это было нужно, чтобы люди с мобильных устройств могли просто и быстро зарегистрироваться или авторизоваться на сайте. Установка HTML: Ставим в верхнюю часть сайта скопированный ниже html код, и ставим его вместо шрифтовых иконок. Код <?if($USERS_ON$)?><span><i class="fa fa-user"></i></span><?if($USER_LOGGED_IN$)?><a href="$PERSONAL_PAGE_LINK$">$USERNAME$</a> <span><i class="fa fa-times"></i></span><a href="$LOGOUT_LINK$">Выход</a><?else?><p>$USERNAME$</p> <span><i class="fa fa-plus"></i></span><a href="$REGISTER_LINK$">Регистрация</a>| <a href="$LOGIN_LINK$">Вход</a><?endif?><?endif?> Установка CSS: Ставим в стили css, изменяя строчки 142 и 146. Они как раз отвечают за стили такого профиля. Код .soc-block{float:right; border-radius:20px; border: 3px solid #fffc; padding: 3px; margin: -7px;} .soc-block p{color:#000; margin:0; display: inline;} .soc-block span + p {margin-left: 10px;} .soc-block span, input#filter_word, input#sfSbm{vertical-align:middle} .soc-block i{margin-left:10px; font-size:20px; color:#fff; font-weight: bold;} .soc-block p, .soc-block a{margin-left:10px; font-size:16px; color:#fff; margin-right: 15px; text-transform: uppercase; font-weight: bold;} .soc-block a:hover{color:#ffbb28} .soc-block a:active{color:#e6a225} P.S: Хочу отметить, что я не силён в стилях, мои познания очень скудны. Так как же я смог такое провернуть?Честно, с помощью нейронных сетей, но с ними тоже пришлось повозиться. К примеру, если ставить в сообщения для нейронки просто код html и css, то ничего не выйдет. Он сделает всё, добавив всё что не надо. Я прописывал что надо и писал теги, которые используются в html. К примеру, сделай так, чтобы span и p находились на одном уровне. |
22 Марта 2025 Просмотров: 207
Поделиться в социальных сетях
Материал разместил