Есть ли более быстрый способ обновить все страницы на веб-сайте HTML? - PullRequest
Новая
       0

Есть ли более быстрый способ обновить все страницы на веб-сайте HTML?

0 голосов
/ 15 ноября 2018

Я сделал сайт с несколькими страницами, и у каждой страницы есть заголовок, содержащий горизонтальную панель навигации.Каждый раз, когда я узнавал что-то новое о HTML или имел представление о дизайне заголовка, я менял заголовок.Однако, после изучения и изменения некоторых вещей пару раз, я понял, что мне придется копировать и вставлять код для заголовка для каждой страницы на моем сайте, и я подумал, что для более крупных сайтов это может быть оченьтрудоемкий процесс.Есть ли способ сэкономить это количество времени?

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

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

Спасибо,

-Этан С.

Ответы [ 3 ]

0 голосов
/ 19 ноября 2018

Я чувствую ваше разочарование. Хорошо, я знаю, что некоторые люди сходят с ума от мысли о PHP, но терпите меня. Если у вас есть заголовок, который вы хотите использовать на всех своих страницах, вы можете просто поместить весь этот код для заголовка в отдельный файл и сохранить его как «header.php», а затем набрать: 

<?php include 'header.php';?>

вверху ваших страниц. Единственное реальное изменение, которое вы должны внести в остальные страницы, - убедиться, что все они сохранены как файлы .php, а НЕ как файлы .html.

Все, что вы делаете с помощью этой простой строки PHP, - это импортируете тот фрагмент кода, который составляет ваш заголовочный файл ("header.php"), на ваши текущие страницы.

На веб-сайте w3schools есть отличное, простое объяснение, как это сделать.

P.S. при тестировании страниц PHP вы ДОЛЖНЫ проходить через сервер.

Удачи! Не сдавайся.

0 голосов
/ 20 ноября 2018

Вы ищете язык шаблонов , который поддерживает партиалы.

Партиалы - это небольшие, контекстно-зависимые компоненты в вашем списке и шаблонах страниц, которые можно экономно использоватьсохранить ваши шаблоны DRY (не повторяйте себя).

Некоторые языки шаблонов имеют синтаксис ближе к HTML, чем другие, поэтому посмотрите вокруг.

Большинство языков шаблонов скомпилировать на сервере .Это не готовые файлы, которые просто передаются вашему клиенту.Вместо этого они компилируются, по запросу, на сервере и используются в качестве HTML для ваших клиентов.

В отличие от статических файлов HTML (что вы, вероятно, используете сейчас), где клиент запрашивает файл HTMLи просто получить его, как есть.

Я лично использую Рули на сервере Node.js / Express, потому что его синтаксис близок к HTML.

0 голосов
/ 15 ноября 2018

То, что вы хотите, включает в себя. Есть несколько способов включить:

  • Процесс внешнего интерфейса (предварительная обработка) с помощью менеджеров задач, таких как Gulp, Grunt, Webpack, вы можете встраивать один и тот же частичный HTML в несколько мест назначения.
  • Бэкэнд-процесс : при использовании языка бэкэнда вы также можете достичь этого.

Для простоты, и, учитывая, что ваши знания, скорее всего, только на 100%, я бы порекомендовал один из следующих:

  1. JavaScript: опция для начинающих. Бэкэнд не требуется, но обычно не рекомендуется (потенциально небезопасно, плохая практика) 

    <!DOCTYPE html>
<html>
<head>
<title>My site</title>
</head>
<body>
<div class="header-container"></div>
<script>
(async function () {
    const headerHTMLRequest = await fetch('./header.html');
    const headerHTML = await headerHTMLRequest.text();
    document.querySelector('.header-container').innerHTML = headerHTML;
})();
</script>
<!-- rest of page -->
</body>
</html>

  2. PHP: это интерпретируемый внутренний язык, и есть несколько инструментов, таких как MAMP или XAMPP, которые предоставят вам готовое решение для использования сервера. Существует множество бесплатных альтернатив хостинга. 

    <!DOCTYPE html>
<html>
<head>
<title>My site</title>
</head>
<body>
<?php include("header.html"); ?>
<!-- rest of page -->
</body>
</html>

Надеюсь, это имеет смысл. Я пытался сделать это простым.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...