Добавление таблицы стилей ко всем страницам на основе пользовательских кликов

#javascript #jquery #html #css

#javascript #jquery #HTML #css

Вопрос:

Идея в том, что на веб-сайте есть страница настроек, которая меняет тему повсеместно. Таким образом, страница настроек будет содержать эту ссылку;

 <a href="">Click here to enable dark mode</a>  

Нажатие на это приведет к добавлению другой таблицы стилей на каждую страницу.

 <?php echo "<link rel='stylesheet' type='text/css' href='darkmode.css'>"; >  

В любом случае, идея такова, сайт создан, и добавление darkmode.css with <link rel="stylesheet" href="https://example.com/darkmode.css"> затем отображает темный режим на странице.

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

Я предполагаю, что переменной должно быть присвоено значение true на странице настроек, но ее необходимо перенести на весь сайт, чтобы

 <?php
if ($darkmode = $true)
  echo "<link rel="stylesheet" href="https://example.com/darkmode.css">";
?>  

Я бы предположил, что что-то подобное нужно будет добавить на каждую страницу, а затем просто повторить стиль, если это правда?

Буду признателен за любую помощь, заранее спасибо.

UPDATE 1

Ни один из этих кодов не работает, но это просто в качестве примера. Администратор установил бы флажок, и если бы флажок был установлен, страница прочитала бы файл для да / нет, а затем повторила ссылку на дополнительную таблицу стилей.

 <form action="preference.php" method="post">
 <input type="checkbox" id="preference" name="preference">
 </form>

<?php
$preference = $_POST["preference"];
$file = fopen("./preference.html","w");
fwrite($file, $preference);
fclose($file);
?>

<?php
echo readfile("http://example.com/admin/preference.html"); ?>  

Update 2
Поток

Это то, что должно произойти.
1 Пользователь включает темный режим.
2 Сохраняется темный режим.
3 Каждая страница проверяет, а затем использует PHP echo для таблицы стилей, если установлен темный режим.

Update 3

 <form action="preference.php" method="post">
 <input type="checkbox" id="preference" name="preference">
 <input type="submit" id="update" name="update" placeholder="Update Preference">
 </form>
 
 

<?php
if (isset($_COOKIE['darkmode'])) {
   if ($_COOKIE['darkmode'] == "true") {
    echo '<link rel="stylesheet" href="https://example.com/admin/darkmode.css">';
   }
   else {
   echo '<!--Not Enabled-->';
   }
   }
?>  

Я добавил код для формы, который обновит настройки и функцию echo для добавления на каждую страницу. Мне просто нужно иметь возможность сохранить это в cookie.

Update 4

Страница настроек:

 <form action="preference.php" method="post">
 <input type="checkbox" id="preference" name="preference">
 <input type="submit" id="update" name="update" placeholder="Update Preference">
 </form>  

Preference.php:

 <?php
if (isset($_POST['preference']) {
  // If a checkbox is checked in the form, set a cookie
  setcookie('isDarkMode', '1');
} else {
  // Otherwise -- delete cookie
  setcookie('isDarkMode', '', time() - 3600);
}
?>  

Добавлено на каждую страницу:

 <? if (isset($_COOKIE['isDarkMode']) amp;amp; $_COOKIE['isDarkMode']) { ?>
<link rel='stylesheet' type='text/css' href='https://example.com/stylesheet.css'>
<link rel='stylesheet' type='text/css' href='https://example.com/darkmode.css'>
  <? } else { ?>
<link rel='stylesheet' type='text/css' href='https://example.com/stylesheet.css'>
  <? } ?>  

На странице настроек отображается ошибка 500 при отправке формы. Есть идеи, почему это может быть?

Комментарии:

1. Что if ($darkmode) или if ($darkmode == true) ?..

2. Вот в чем я не уверен насчет @Arfeo. Мне нужно, чтобы пользователь включил ее на одной странице, но это должно быть где-то сохранено, чтобы отдельные страницы могли проверить, включено ли это.

3. В любом случае, if ($darkmode = $true) утверждение неверно.

4. Я знаю, @Arfeo. Я прошу указать отправную точку. Это был слабый пример того, что, по моему мнению, может понадобиться.

5. Итак, если вы действительно знаете, что приведенное выше утверждение неверно, попробуйте использовать файлы cookie или сеанс для сохранения состояния darkmode. И проверяйте это в самом начале каждой отображаемой страницы. Например, поместите флажок в файл заголовка.

Ответ №1:

В preference.php :

 <?
if (isset($_POST['preference'])) {
  // If a checkbox is checked in the form, set a cookie
  setcookie('isDarkMode', '1');
} else {
  // Otherwise -- delete cookie
  setcookie('isDarkMode', '', time() - 3600);
}
  

В заголовочном файле для каждой страницы:

 <html>
<head>
  ...
  <? if (isset($_COOKIE['isDarkMode']) amp;amp; $_COOKIE['isDarkMode']) { ?>
    <link rel='stylesheet' type='text/css' href='darkmode.css'>
  <? } else { ?>
    <link rel='stylesheet' type='text/css' href='normal.css'>
  <? } ?>
  ...
</head>
  

Комментарии:

1. Это выдает ошибку 500 в процессе. страница php

2. Можете ли вы показать сообщение об ошибке из журнала веб-сервера? @EdgeDeveloper

3. Ошибка синтаксического анализа: неожиданная ‘{‘ в /home/username/domains/mexample.com/public_html/admin/preference.php в строке 36 строка 36 является if (isset($_POST['preference']) { . Удаление ‘}’ приводит к ошибке T String на setcookie('isDarkMode', '1');

4. Ах да, обновил ответ. Пропущено ) после инструкции if, извините, опечатка. @EdgeDeveloper

5. Не нужно извиняться за опечатку. Сейчас это работает, но темный режим всегда включен, даже до установки cookie на этой странице. Это дополнение, поэтому в update 4 я использую его с обеими таблицами стилей. Не уверен, почему он всегда показывает оба.