Художественные махинации с нижним колонтитулом Wordpress: как заставить текст копирайта, логотип и верхнюю часть прокрутCSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Гость
 Художественные махинации с нижним колонтитулом Wordpress: как заставить текст копирайта, логотип и верхнюю часть прокрут

Сообщение Гость »


Я пытаюсь настроить эту тему в соответствии со своими потребностями и собираюсь выбросить монитор в окно. Пожалуйста, сохраните его. Его зовут Фил.
Сайт: magelightpress dot com, если он вам нужен.
Вот CSS, с которым я работаю:

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

/* font nonsense */

@font-face {
font-family: 'LuthonSouthardSerif';
src: url('/wp-content/uploads/2024/03/LuthonSouthardSerif.otf');
}

h1 {
font-family: 'LuthonSouthardSerif';
font-weight: normal;
font-size: 60px !important;
text-align: center;
color: #000000!important;
text-transform: uppercase;
}
h2 {
font-family: 'LuthonSouthardSerif';
font-weight: normal;
font-size: 50px !important;
color: #ae8c52 !important;
text-transform: uppercase;
}
h3 {
font-family: 'LuthonSouthardSerif';
font-weight: normal;
font-style: italic;
font-size: 40px !important;
color: #666666 !important;
text-transform: capitalize;
}
h4 {
font-family: 'LuthonSouthardSerif';
font-weight: normal;
font-size: 30px !important;
color: #ae8c52 !important;
text-transform: uppercase;
}
h5 {
font-family: 'LuthonSouthardSerif';
font-weight: normal;
font-size: 25 !important;
color: #ae8c52 !important;
text-transform: capitalize;
font-style: italic;
}
h6 {
font-family: 'LuthonSouthardSerif';
font-weight: bold;
font-size: 25 !important;
color: #000000 !important;
text-transform: Uppercase;
font-style: italic;
}

/* END font nonsense */

/* assigned footer graphics nonsense */

div.footer-copyright-home {
background: url('/wp-content/uploads/2024/03/MLP-Foot-Home.jpg') #efeee6 no-repeat;
}

div.footer-copyright-contact {
background: url('/wp-content/uploads/2024/03/MLP-Foot-Contact.jpg') #efeee6 no-repeat;
background-position: center top;
}

div.footer-copyright-about {
background: url('/wp-content/uploads/2024/03/MLP-Foot-About.jpg') #efeee6 no-repeat;
background-position: center top;
}

div.footer-copyright-devon {
background: url('/wp-content/uploads/2024/03/MLP-Foot-Devon.jpg') #efeee6 no-repeat;
background-position: center top;
}

div.footer-copyright-privacy {
background: url('/wp-content/uploads/2024/03/MLP-Foot-Privacy.jpg') #efeee6 no-repeat;
background-position: center top;
}

div.footer-copyright-books {
background: url('/wp-content/uploads/2024/03/MLP-Foot-Books.jpg') #efeee6 no-repeat;
background-position: center top;
}

/* END assigned footer graphics nonsense */

/* The actual footer */

.page-footer-inner {
position: relative;
background: url('/wp-content/uploads/2024/03/MLP-Foot-Home.jpg') #efeee6;
background-size: 100.2%;
background-position: center bottom;
background-repeat: no-repeat;
min-height: 200px; /* Set a minimum height for the footer */
padding-top: 500px; /* Adjust top padding as needed */
padding-bottom: 400px; /* Adjust bottom padding as needed */
}

.copyright-info {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
background-color: rgba(255, 255, 255, 0.0); /* Adjust opacity as needed */
padding: 50px;
font-size: 16px;
margin-bottom: 60px; /* Adjust margin bottom to control the space between copyright and footer */
}

/* Other CSS rules for footer elements...  */

/* Адаптивность для мобильных устройств */
@media screen и (макс. ширина: 768 пикселей) {
.page-footer-inner {
высота: auto ; /* Разрешить регулировку высоты нижнего колонтитула на маленьких экранах */

div.footer-logo {
позиция: абсолютная;
нижняя часть: 0;
влево: 50%;
преобразование: TranslateX(-50%);
цвет фона: rgba(255, 255, 255, 0.0); /* При необходимости отрегулируйте непрозрачность */
margin-bottom: 200px;
}

div.footer-logo img {
width: 100px;
margin-top: 50px;
}

span.scrolltop {
позиция: абсолютная;
внизу: 0;
слева: 50%;
Transform: TranslateX(-50%);
Цвет фона: rgba(255, 255, 255, 0.0); /* При необходимости отрегулируйте непрозрачность */
margin-bottom: 30px;
}

.footer-instagram-widget {
display: none;

ul#footer-menu {
позиция: абсолютная;
нижняя: 0;
левая: 50%;
преобразование: TranslateX(-50 %);
цвет фона: rgba(255, 255, 255, 0.0); /* При необходимости отрегулируйте непрозрачность */
Font-size: 16 пикселей;
Margin-bottom: 30 пикселей;
}

/* Адаптивность для мобильных устройств */
@media screen и (максимальная ширина: 768 пикселей) {
ul#footer-menu {
высота: auto; /* Разрешить регулировку высоты нижнего колонтитула на экранах меньшего размера */
}
}

/* КОНЕЦ фактического нижнего колонтитула */

/* Остальная часть сайт */

div.main-content {
цвет фона: прозрачный;
}
div.main-content.clear-fix {
padding-top: 0;
padding-bottom: 0;
}

div#top-bar.clear-fix {
background: url(/wp- content/uploads/2023/02/MLP-BG-Fixed.jpg) центр без повторов;
размер фона: обложка;
}

#top-menu {< br /> float: right;
padding-right: 20%;
}

#top-bar a {
цвет: #efeee6;
ul#top-menu {
text-align: right;
}
#top-menu .sub-menu, #top-menu .sub-menu a {< br /> фон: прозрачный;
граница: 1 пиксель, сплошной #aa8858;
}
span.mobile-menu-btn {
цвет: #efeee6;
}< br />
div#page-header .entry-header {
фоновая позиция: по центру вверху;
размер фона: 100,2%;
фоновый повтор: без повтора ;
переполнение: видимое;
максимальная высота: 350 пикселей;
}

.cv-outer {

}

#mobile-menu li a {
цвет: #efeee6;
дисплей: блок;
позиция: относительная;
z-индекс: 5;
#main-nav i {
color: #efeee6;
}

div.main-container {
поля: 0 пикселей авто 50 пикселей авто;
}

div.header-logo {
отображение: нет;
}
.page-title {
отображение: нет;< br />}

/* КОНЕЦ остальной части сайта*/
HTML
< предварительно>

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




[url=/* customizer nonsense link */]
[img]/wp-content/uploads/2024/03/footer-icon.png[/img]
[/url]

Copyright © 2024, Magelight Press. All rights reserved.

We support human artists. AI has no home here.



Источник: [url]https://stackoverflow.com/questions/78142414/wordpress-footer-shenanigans-how-do-i-get-the-copyright-logo-and-scrolltop-to[/url]
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»