Колокольчик уведомлений на сайт?

Ссылка скопирована
Веб-разработка
2 ответов

На сайте есть раздел "Новости" и ссылка на эти новости в шапке, мне нужно напротив этой ссылки сделать счетчик - уведомление для пользователей, мне не нужно что бы уведомления как то свплывали или показывались в окне, нужно что бы напротив ссылки новости стояла например цифра 1 если добавлена одна новость или 2, 3 и т.д. после того как пользователь посетил страницу с новостями цифра соответственно пропала, что означает что он просмотрел страницу.
Колонка новости написана, существует, в админке есть возможность добавлять новости.

Вопрос, какой алгоритм действий должен быть что бы реализовать данную идею? Или может есть примеры? Вообще такие колокольчики сейчас много где есть, но в интернет информация только о push или всплывающих окнах.

Дополнительно:

Ответы:

Это счетчик непрочитанных новостей
Варианты реализации:
- для каждого пользователя у каждой новости есть отметка boolean (например в базе данных связь М - М, наличие записи - прочитана, отсутствие - нет), количество новостей без таких отметок для пользователя и есть искомое число (можно оптимизировать триггерами в базе данных на создание новостей)
этот вариант подходит, если есть возможность и необходимость мониторить прочтение каждой новости
- для каждого пользователя сохраняется дата последнего его захода на сайт (чтения страницы новостей), соответственно количество новостей с датой выхода больше сохраненной у пользователя - искомое число
этот вариант сильно быстрее работает но дубовый и не учитывает что пользователь мог не прочитать новости

Если я правильно понял вопрос, то вы имеете в виду счетчик непросмотренных постов, наподобие этого в vk, только без возможности ajax подгрузки?

Колокольчик уведомлений на сайт?

Лучше вариант реализации - это использовать WebSocket.
Если знания и опыт не позволяют, а желания разбираться в этом нет, то можно (но не стоит) сделать с помощью обычных ajax-запросов на ваш контроллер через определенный промежуток времени, например каждые 20 секунд.

Как минимум у вас должна быть таблица
UserID2NewsId
плюс какой то скрипт который раз в секунду опрашивает какой то апи
ну или что то типа longpool socket.io или подобного что бы вывешивать циферку

Такой функционал есть в одном из моих проектов посмотрите
https://github.com/vkorotenko/ChatApplication

Ну то есть? Берешь и рисуешь колокольчик, если для юзера есть непрочитанные новости.
Алгоритм чего? Отрисовки надо или как gif колокольчика вставить?

Или (вруг) ты не знаешь про cookies?

  • Что такое куки я знаю, как работать с ними не знаю. Но вчера с элементарным запросом разобрался как куки передать в браузер. Алгоритм работы скрипта, есть новости, предположим их 5, посетитель (любой посетитель) зашел на сайт и сверху увидел колокольчик (можно цифру, дело не в дизайне). Как добавиться одна или две или три новости такую цифру он и увидит.

    Колокольчик уведомлений на сайт?

    . Что я имею в виду под алгоритмом? Как это работает? Делать счетчик всех новостей? Выводить его и как то подключать куки? И да, я хочу сделать это через куки. Я просто не могу понять как это работает.

  • У каждой новости должен быть инкрементальный айдишник.
    Для каждого пользователя печеньке хранить ID последней прочитанной новости этим пользователем.
    При заходе, в шапке отображать разницу между айдишником который прочитал пользователем и последним актуальным айдишником. Если разницы нет, вообще не отображать колокольчик. 
  • <?php $link = mysqli_connect("localhost", "root", "", "news");  if ($link == false){     print("Ошибка: Невозможно подключиться к MySQL " . mysqli_connect_error()); } else {     print("Соединение установлено успешно"); } ?> <?php $cookies_name = 'news'; setcookie($cookies_name, 0); ?> <?php if (isset($_COOKIE[$cookies_name])) { 	$sql = "SELECT COUNT(id) as count FROM news"; 	$result = mysqli_query($link, $sql);  	while($row = mysqli_fetch_array($result)){ 	echo "<br />Новостей в базе: ".$row["count"]."<br />"; 	}  } 	else {  	 	$sql = "SELECT COUNT(id) as count FROM news"; 	$result = mysqli_query($link, $sql); 	while($row = mysqli_fetch_array($result)){ 	echo "<br />Всего новостей в базе: ".$row["count"]."<br />"; 	} } ?>

    <?php $link = mysqli_connect("localhost", "root", "", "news"); if ($link == false){ print("Ошибка: Невозможно подключиться к MySQL " . mysqli_connect_error()); } else { print("Соединение установлено успешно"); } ?> <?php $cookies_name = 'news'; setcookie($cookies_name, 0); ?> <?php if (isset($_COOKIE[$cookies_name])) { $sql = "SELECT COUNT(id) as count FROM news"; $result = mysqli_query($link, $sql); while($row = mysqli_fetch_array($result)){ echo "<br />Новостей в базе: ".$row["count"]."<br />"; } } else { $sql = "SELECT COUNT(id) as count FROM news"; $result = mysqli_query($link, $sql); while($row = mysqli_fetch_array($result)){ echo "<br />Всего новостей в базе: ".$row["count"]."<br />"; } } ?>

    Вот что у меня получилось, извиняюсь за код, собираю как могу )
    Сейчас при заходе пока нет куук пользователь видит фразу "Всего новостей в базе:5", как куки сохранились он видит "Новостей в базе:5 "
    Теперь не могу понять, как привязать ID к куки? Или хотя бы по порядку, как сделать условие что бы они сменились на 0 (новости) как на прочитанные, при посещении страницы новостей?

  • У каждой новости должен быть айдишник, просто порядковый номер. Новости читаешь всегда подряд.
    Хранишь айдишник новости в куках и все.

    setcookie($cookies_name, 0);

    это не очень понятно зачем ты каждый раз делаешь. Ты же просто обнуляешь все время. Ставить надо если у пользователя их не было.

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Павел Админов Ответ

Для добавления колокольчика уведомлений на ваш сайт вы можете использовать JavaScript и CSS. Вот пример того, как вы можете это сделать:

1. Сначала добавьте следующий код в ваш HTML файл:

 
 
 
 
 
<title>Уведомления</title>
 
 
 
<div class="notification">
  У вас новое уведомление!
</div>
<button>Показать уведомление</button>

<title>Уведомления</title> <div class="notification"> У вас новое уведомление! </div> <button>Показать уведомление</button>

2. Затем создайте файл styles.css и добавьте следующий CSS код:

.notification {
  display: none;
  position: fixed;
  top: 10px;
  right: 10px;
  padding: 10px;
  background-color: #f44336;
  color: white;
  border-radius: 5px;
}

.notification { display: none; position: fixed; top: 10px; right: 10px; padding: 10px; background-color: #f44336; color: white; border-radius: 5px; }

3. Создайте файл script.js и добавьте следующий JavaScript код:

function showNotification() {
  var notification = document.querySelector('.notification');
  notification.style.display = 'block';
  setTimeout(function() {
    notification.style.display = 'none';
  }, 3000);
}

function showNotification() { var notification = document.querySelector('.notification'); notification.style.display = 'block'; setTimeout(function() { notification.style.display = 'none'; }, 3000); }

Этот код создаст кнопку, которая при нажатии будет показывать уведомление в правом верхнем углу страницы на 3 секунды. Вы можете настроить стили уведомления и время его отображения в соответствии с вашими потребностями.

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

Другие ответы (1) Ответить на вопрос
Елена Вебер

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

Пример кода на JavaScript для создания колокольчика уведомлений:

// Создаем элемент колокольчика
var bell = document.createElement('div');
bell.innerHTML = '<img src="bell-icon.png">';
bell.classList.add('bell-icon');
 
// Добавляем обработчик клика для отображения уведомлений
bell.addEventListener('click', function() {
    // Здесь можно добавить логику для отображения уведомлений
    alert('У вас новое уведомление!');
});
 
// Добавляем колокольчик на страницу
document.body.appendChild(bell);

// Создаем элемент колокольчика var bell = document.createElement('div'); bell.innerHTML = '<img src="bell-icon.png">'; bell.classList.add('bell-icon'); // Добавляем обработчик клика для отображения уведомлений bell.addEventListener('click', function() { // Здесь можно добавить логику для отображения уведомлений alert('У вас новое уведомление!'); }); // Добавляем колокольчик на страницу document.body.appendChild(bell);

В данном примере мы создаем элемент колокольчика, добавляем обработчик события клика для отображения уведомлений (в данном случае просто вызов alert), и добавляем созданный элемент на страницу.

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

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

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно

VPN Как правильно настроить vless для Android TV? 1 ответ Pyrogram Как правильно зарегистрировать юзер бота в Telegram? 1 ответ печатные-платы Как заставить запускаться программу M3.exe от компании Hanxing AOI в инспекционной машине на Windows 7 Pro? 1 ответ Аккумуляторные батареи Почему при зарядке автостарта слышен писк, где искать причину? 1 ответ