Добавить простой нижний колонтитул в квадратный шаблон страницы «Премьер»

Question

Я не знаю, если вы, ребята, столкнулись с обложками Squarespace, но человек с ними трудно ориентироваться по коду. Я делаю отдельный рекламный сайт, который требует только титульную страницу и видео, поэтому я использую титульную страницу «Премьер». Однако по юридическим причинам у меня должен быть нижний колонтитул с информацией об авторских правах и ссылкой на наше заявление о конфиденциальности. Моя первоначальная идея состояла в том, чтобы использовать вставку header с помощью css :: after, чтобы включить полный div div, но я хочу, чтобы титульная страница все еще занимала весь экран и чтобы пользователь мог прокручивать вниз, чтобы увидеть нижний колонтитул.

Один пример, который я пытался изменить было https://answers.squarespace.com/questions/109923/adding-footer-text-on-cover-page-code-injection.html с помощью этого кода:

<style> 
#collection-559df309e4b026e5cd65a4b4 
[data-slide-id="559df309e4b026e5cd65a4b5"] 
.sqs-slice-group.group-social::after { 
    content: "some general text"; 
    padding: 5px 0; 
    margin: 0 auto; 
    text-align: center; 
    font-size: 10px; 
    color: #fff; 
} 
</style> 

я выгружена мой ID сбора и передачи данных-слайд-идентификатор в этот код, но он поставил «общий текст» блок на вершине кнопку воспроизведения, а также в правом верхнем углу экрана. Я пробовал менять элементы вокруг безрезультатно - любая помощь была бы оценена.

Answer 1

Вот что я хотел бы сделать, если бы я предпочел избегать использования Javascript. Вставьте следующий HTML-код в область заголовка «Code Injection» для титульной страницы. Это добавит div, который появляется под основной областью содержимого, так что пользователь должен прокрутить вниз, чтобы увидеть его.

<div id="coverFooter"> 
    <a id="coverPP" href="/privacy-policy/">Privacy Policy</a> <span id="coverCR">&copy; 2016 Your Company, LLC</span> 
</div> 

<style> 
    #coverFooter { 
     position: absolute; 
     z-index: 1; 
     top: 100%; 
     width: 100%; 
     padding-top: 20px; 
     padding-bottom: 20px; 
     background-color: white; 
     box-sizing: border-box; 

     text-align: center; 
     padding-right: 30px; 
     padding-left: 30px; 

     /* Use this for right aligned text instead. 
     text-align: right; 
     padding-right: 60px; 
     padding-left: 60px; 
     */ 
    } 

    #coverPP { 
     white-space: nowrap; 
    } 

    #coverCR { 
     margin-left: 10px; 
     white-space: nowrap; 
    } 
</style> 

Here is a working example, который я буду держать в Интернете в течение недели.

Вы, конечно же, захотите изменить ссылку href, текст авторского права и, возможно, правила CSS, такие как цвета и дополнительные значения.

Имейте в виду, что это вводит div обложки CoverFooter в верхнюю часть элемента body, хотя CSS делает его отображаться внизу. Это может побудить поисковые системы индексировать текст внутри div как описание страницы в SERPS. Обязательно добавьте «Описание поисковой системы» в разделе «Настройки» -> «Основные», чтобы помочь смягчить это, и следите за описанием страницы в SERPS. Если это становится проблемой, сохраните CSS в области вставки заголовка, но замените div HTML на Javascript, который вставляет div в нижней части элемента body.

Наконец, вы либо будете ссылаться на политику конфиденциальности в другом домене, либо вам нужно будет выбрать «Добавить дополнительные страницы» и добавить страницу политики конфиденциальности в раздел «не связанные».