Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Форум для новичков » Общие вопросы от новичков (63) #3


Общие вопросы от новичков (63) #3

Сообщений 341 страница 360 из 367

1

Инструменты для поиска и редактирования стиля (скриптов).

Как с помощью браузера можно определить элемент дизайна.

Каталог скриптов/CSS

Полезные скрипты, необходимые темы для новичков, а также ссылки на сайты рассказывающие что такое HTML и CSS.

Типовые Вопросы (ЧаВо)

Ответы на часто задаваемые вопросы.

Как задавать вопросы! Разница между стилем и скриптом. ( Советы)

Плюс к названию темы еще и Памятка.

Любой вопрос по оформлению/неполадкам сопровождайте ссылкой на форум, по которому возникли сложности.

Предыдущая часть темы: Общие вопросы от новичков (63)

Предыдущая часть темы: Общие вопросы от новичков (63) #2

0

341

Добрый день
Сегодня  перестал работать счётчик просмотров
Кто знает почему и что делать?

0

342

Марина Аврора 22
Пожалуйста, укажите ссылку на форум с проблемой, а также опишите проблему более подробно, что за счётчик и что с ним не так (желательно с приложением скриншотов).
Задавать вопросы лучше в общей теме: Общие вопросы от новичков (63) #3, данная тема предназначена для тех, кто испытывает проблемы с регистрацией на этом форуме.

+1

343

Добрый день
Форум "Рисунки с натуры"
http://risyiy.mybb.ru
https://upforme.ru/uploads/0000/14/1c/39466/t894838.jpg
ссючетчик просмотров в разделе "Платные услуги" всегда показывал количество просмотров форума за сутки, а сегодня за вчерашний день стоят эти две единицы и все,хотя просмотры были и гораздо больше,чем один за сутки
Это какая-то ошибка или сбой
Прошу помочь в разрешении этой проблемы

0

344

Merlin777 написал(а):

Здравствуйте.

https://upforme.ru/uploads/0000/14/1c/38891/t69605.webp

У вас длина форумов такая или что? Я подробно описала проблему, у меня они разные и отображение идёт от края форумов, а не из угла кнопки. Я попросила при возможности сделать в самом коде выход меню из нижнего правого угла, но не критично в целом.)

Отредактировано <3 (Вс, 28 Сен 2025 12:33:21)

0

345

Марина Аврора 22
Счётчик просмотров обновляется раз в сутки. Реальное количество будет показано завтра. К тому же не совсем понятно, зачем вам это значение так подробно контролировать, оно влияет только на стоимость отключения рекламы (чем больше просмотров - тем выше стоимость).

0

346

<3 написал(а):

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

Я сделал отображение менюшки не под названием форума, а справа :) Что такое "выход из угла", я не понимаю :)

+1

347

Merlin777 написал(а):

Я сделал отображение менюшки не под названием форума, а справа

А, я поняла, но как это сделать?  :D Мне было нужно, чтобы окошко с темами выступало от края самой кнопки при нажатии.) Так как названия форумов разной длины и одинаковый отступ от края самих форумов выглядит криво...
Вот для наглядности:
https://upforme.ru/uploads/0000/14/1c/38357/782231.png
(и при разных названиях по длине получается, что где-то меню выпадает у кнопки, а где-то перегораживает половину картинки и текста, поэтому я вообще убрала этот отступ)

Отредактировано <3 (Вс, 28 Сен 2025 12:38:25)

0

348

<3 написал(а):

я поняла, а как это сделать?

Попробуйте вот это:

Показать код
Код:
<script type="module">
/* ========================================
   🎨 CSS с регулируемыми параметрами
======================================== */
const style = document.createElement('style');
style.textContent = `
:root {
  --topiclist-count: 10;             
  --topiclist-session: 1;            
  --topiclist-touch-device: 0;       
  --topiclist-select-action: click;  
  --topiclist-template-click: "<img src='https://forumstatic.ru/files/001c/36/f3/86140.png' alt='Список тем' style='width:16px;height:16px;vertical-align:middle'>";  
}

.topicslist {
  position: absolute;
  background-color: #faf1ed;
  border: 1px solid rgba(0,0,0,.35);
  margin-top: 3px;
  padding: 10px;
  box-shadow: 0 4px 4px -2px rgba(0,0,0,.35);
  border-radius: 3px;
  max-width: 90vw;
  z-index: 110;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
.topicslist.show { opacity: 1; }
.topicslist .sticky a { font-weight: bold; color: #f00; }
.topicslist .closed a { color: #a9a9a9; }
.topicslist .load { animation: slow-load-blink 2s ease-in-out infinite; }
.clickt { cursor: pointer; user-select: none; }
.clickt img { border: 0; line-height: 1; max-height: 16px; max-width: 16px; vertical-align: middle; }
@keyframes slow-load-blink{0%,100%{opacity:1}50%{opacity:.3}}
`;
document.head.appendChild(style);

/* ========================================
   ⚙️ Настройки из CSS
======================================== */
function getParams() {
  const root = getComputedStyle(document.documentElement);
  return {
    count: parseInt(root.getPropertyValue('--topiclist-count')) || 10,
    useSession: root.getPropertyValue('--topiclist-session').trim() === '1',
    touchDevice: root.getPropertyValue('--topiclist-touch-device').trim() === '1' || ('ontouchstart' in window || navigator.maxTouchPoints > 0),
    selectAction: root.getPropertyValue('--topiclist-select-action').trim() || 'click',
    templateClick: root.getPropertyValue('--topiclist-template-click').replace(/['"]/g,'') || ' >'
  };
}

/* ========================================
   🌐 Переводы
======================================== */
const lang = document.documentElement.lang === 'ru' ? 'ru' : 'en';
const translations = {
  en: { showTopics:"Show list of topics", loadTopics:"Loading topics...", noTopics:"No topics", errorLoad:"Error loading topics.<br>Refresh page."},
  ru: { showTopics:"Показать список тем", loadTopics:"Загружаю список...", noTopics:"Тем нет", errorLoad:"Ошибка при загрузке.<br>Обновите страницу."}
};

/* ========================================
   🏗 Загрузка и отображение тем
======================================== */
let currentForumId = null;
let closeTimeout = null;

async function loadTopics(container, forumId) {
  const params = getParams();
  const key = `fid${forumId}_storage`;
  const now = Date.now();

  if (params.useSession && sessionStorage.getItem(key)) {
    const cached = JSON.parse(sessionStorage.getItem(key));
    if (now - cached.timestamp < 600000) return renderTopics(container, cached.data);
    sessionStorage.removeItem(key);
  }

  try {
    const res = await fetch(`/api.php?method=topic.get&forum_id=${forumId}&sort_by=last_post&sort_dir=desc&sticky_first=1&limit=${params.count}`);
    const data = await res.json();
    if (data?.response?.length > 0) {
      const topics = data.response.map(t => ({
        subject: t.subject,
        url: `/viewtopic.php?id=${t.id}`,
        class: `tid${t.id}` + (t.sticky ? " sticky" : "") + (t.closed ? " closed" : "")
      }));
      renderTopics(container, topics);
      if (params.useSession) sessionStorage.setItem(key, JSON.stringify({ data: topics, timestamp: now }));
    } else renderMessage(container, translations[lang].noTopics);
  } catch (e) {
    renderMessage(container, translations[lang].errorLoad);
  }
}

function renderTopics(container, topics) {
  const ul = container.querySelector("ul");
  ul.innerHTML = "";
  topics.forEach(t => {
    const li = document.createElement("li");
    li.className = t.class;
    li.innerHTML = `<a href="${t.url}">${t.subject}</a>`;
    ul.appendChild(li);
  });
  container.classList.add('show'); // Плавное появление
}

function renderMessage(container, message) {
  const ul = container.querySelector("ul");
  ul.innerHTML = `<li>${message}</li>`;
  container.classList.add('show'); // Плавное появление
}

/* ========================================
   🎛 Показ блока тем
======================================== */
function showTopics(trigger) {
  const tr = trigger.closest("tr");
  const forumId = tr.id.match(/\d+/)[0];
  if (currentForumId === forumId && tr.querySelector(".topicslist")) return;

  document.querySelectorAll(".topicslist").forEach(el => el.remove());

  const header = tr.querySelector("h3");
  const box = document.createElement("div");
  box.className = "topicslist";
  box.innerHTML = `<ul><li class="load">${translations[lang].loadTopics}</li></ul>`;
  header.insertAdjacentElement("afterend", box);

  positionBox(trigger, box);
  loadTopics(box, forumId);
  currentForumId = forumId;

  if (getParams().selectAction === "hover" && !getParams().touchDevice) resetCloseTimeout(box);
}

function resetCloseTimeout(box) {
  clearTimeout(closeTimeout);
  closeTimeout = setTimeout(() => {
    box.remove();
    currentForumId = null;
  }, 2000);
}

/* ========================================
   📌 Позиционирование блока справа
======================================== */
function positionBox(button, box) {
  const rect = button.getBoundingClientRect();
  const scrollTop = window.scrollY || document.documentElement.scrollTop;
  const scrollLeft = window.scrollX || document.documentElement.scrollLeft;

  box.style.position = 'absolute';
  box.style.left = `${rect.right + scrollLeft + 5}px`; // справа с отступом
  box.style.top = `${rect.top + scrollTop}px`;          // по верхнему краю кнопки

  const maxRight = window.innerWidth - 10;
  if (rect.right + 5 + box.offsetWidth > maxRight) {
    box.style.left = `${maxRight - box.offsetWidth}px`;
  }
}

/* ========================================
   🚀 Инициализация кнопок и слушателей
======================================== */
function initListeners() {
  document.querySelectorAll(".tclcon h3 a").forEach(a => {
    const btn = document.createElement("span");
    btn.className = "clickt";
    btn.title = translations[lang].showTopics;
    btn.innerHTML = getParams().templateClick; // ← картинка вместо стрелки
    a.insertAdjacentElement("afterend", btn);

    btn.addEventListener("click", e => {
      e.stopPropagation();
      const row = btn.closest("tr");
      const forumId = row.id.match(/\d+/)[0];
      const box = row.querySelector(".topicslist");

      if (currentForumId === forumId && box) { box.remove(); currentForumId = null; }
      else showTopics(btn);
    });
  });

  document.addEventListener("click", e => {
    if (!e.target.closest(".topicslist") && !e.target.closest(".clickt")) {
      document.querySelectorAll(".topicslist").forEach(el => el.remove());
      currentForumId = null;
    }
  });
}

document.addEventListener("DOMContentLoaded", initListeners);
</script>

Это я сделал из скрипта уважаемого господина Reysler. У него код выглядит более компактно за счёт вынесения разной логики по разным внешним файлам которые подгружаются, это удобно и и это считается хорошим тоном в программировании, и браузер может это быстрее загружать (теоретически). Но "большой кусок кода" тоже  работает  :)
(мне просто сейчас лень разносить всё по внешним файлам, сорри  :) )

0

349

Уважаемый Alex_63, спасибо вам за консультацию
Но до сегодняшнего дня количество просмотров за вчерашний день было видно на следующее утро, примерно в 6-30 утра было известно,сколько людей  посмотрело мой форум
Мне важно знать интерес окружающих к моим постам
Почему до сегодняшнего дня количество просмотров было видно сразу на следующие сутки утром, а сегодня уже полдня прошло и нет ничего
Завтра будет за позавчера,получается?
А почему раньше было сразу на следующее утро, а не через полтора суток?
Можно восстановить прежний порядок работы этого раздела?

0

350

Марина Аврора 22
Принцип подсчёта показов никак не менялся уже много лет. Он нужен для расчёта стоимости отключения рекламы на будущий месяц, а не для контроля посещаемости. Для ваших целей целесообразнее будет использовать сторонние метрики, например Яндекс.Метрика.

0

351

Merlin777,

И как сделать то, что показано в посте #339? Действую по принципу: "Хочу всё знать!" и люблю познавать что-то новое для себя, особенно то, как всё устроено.  :)

0

352

Neo.Neo написал(а):

Merlin777,

И как сделать то, что показано в посте #339? Действую по принципу: "Хочу всё знать!" и люблю познавать что-то новое для себя, особенно то, как всё устроено.  :)

348й пост, вы имеете в виду? :)

+1

353

Извините, а что за проблема с подписями:
https://upforme.ru/uploads/0000/14/1c/38357/991826.png
Не вижу изображений, в настройках разрешила, где что упустила?

0

354

Merlin777 написал(а):

348й пост, вы имеете в виду? :)

Нет, этот - со скриншотом:

Общие вопросы от новичков (63) #3

Там я вижу иконки справа от названий и превью. Вот и стало интересно, что "под капотом".  :)

0

355

Merlin777 написал(а):

Попробуйте вот это:

Показать код
Код:
<script type="module">
/* ========================================
   🎨 CSS с регулируемыми параметрами
======================================== */
const style = document.createElement('style');
style.textContent = `
:root {
  --topiclist-count: 10;             
  --topiclist-session: 1;            
  --topiclist-touch-device: 0;       
  --topiclist-select-action: click;  
  --topiclist-template-click: "<img src='https://forumstatic.ru/files/001c/36/f3/86140.png' alt='Список тем' style='width:16px;height:16px;vertical-align:middle'>";  
}

.topicslist {
  position: absolute;
  background-color: #faf1ed;
  border: 1px solid rgba(0,0,0,.35);
  margin-top: 3px;
  padding: 10px;
  box-shadow: 0 4px 4px -2px rgba(0,0,0,.35);
  border-radius: 3px;
  max-width: 90vw;
  z-index: 110;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
.topicslist.show { opacity: 1; }
.topicslist .sticky a { font-weight: bold; color: #f00; }
.topicslist .closed a { color: #a9a9a9; }
.topicslist .load { animation: slow-load-blink 2s ease-in-out infinite; }
.clickt { cursor: pointer; user-select: none; }
.clickt img { border: 0; line-height: 1; max-height: 16px; max-width: 16px; vertical-align: middle; }
@keyframes slow-load-blink{0%,100%{opacity:1}50%{opacity:.3}}
`;
document.head.appendChild(style);

/* ========================================
   ⚙️ Настройки из CSS
======================================== */
function getParams() {
  const root = getComputedStyle(document.documentElement);
  return {
    count: parseInt(root.getPropertyValue('--topiclist-count')) || 10,
    useSession: root.getPropertyValue('--topiclist-session').trim() === '1',
    touchDevice: root.getPropertyValue('--topiclist-touch-device').trim() === '1' || ('ontouchstart' in window || navigator.maxTouchPoints > 0),
    selectAction: root.getPropertyValue('--topiclist-select-action').trim() || 'click',
    templateClick: root.getPropertyValue('--topiclist-template-click').replace(/['"]/g,'') || ' >'
  };
}

/* ========================================
   🌐 Переводы
======================================== */
const lang = document.documentElement.lang === 'ru' ? 'ru' : 'en';
const translations = {
  en: { showTopics:"Show list of topics", loadTopics:"Loading topics...", noTopics:"No topics", errorLoad:"Error loading topics.<br>Refresh page."},
  ru: { showTopics:"Показать список тем", loadTopics:"Загружаю список...", noTopics:"Тем нет", errorLoad:"Ошибка при загрузке.<br>Обновите страницу."}
};

/* ========================================
   🏗 Загрузка и отображение тем
======================================== */
let currentForumId = null;
let closeTimeout = null;

async function loadTopics(container, forumId) {
  const params = getParams();
  const key = `fid${forumId}_storage`;
  const now = Date.now();

  if (params.useSession && sessionStorage.getItem(key)) {
    const cached = JSON.parse(sessionStorage.getItem(key));
    if (now - cached.timestamp < 600000) return renderTopics(container, cached.data);
    sessionStorage.removeItem(key);
  }

  try {
    const res = await fetch(`/api.php?method=topic.get&forum_id=${forumId}&sort_by=last_post&sort_dir=desc&sticky_first=1&limit=${params.count}`);
    const data = await res.json();
    if (data?.response?.length > 0) {
      const topics = data.response.map(t => ({
        subject: t.subject,
        url: `/viewtopic.php?id=${t.id}`,
        class: `tid${t.id}` + (t.sticky ? " sticky" : "") + (t.closed ? " closed" : "")
      }));
      renderTopics(container, topics);
      if (params.useSession) sessionStorage.setItem(key, JSON.stringify({ data: topics, timestamp: now }));
    } else renderMessage(container, translations[lang].noTopics);
  } catch (e) {
    renderMessage(container, translations[lang].errorLoad);
  }
}

function renderTopics(container, topics) {
  const ul = container.querySelector("ul");
  ul.innerHTML = "";
  topics.forEach(t => {
    const li = document.createElement("li");
    li.className = t.class;
    li.innerHTML = `<a href="${t.url}">${t.subject}</a>`;
    ul.appendChild(li);
  });
  container.classList.add('show'); // Плавное появление
}

function renderMessage(container, message) {
  const ul = container.querySelector("ul");
  ul.innerHTML = `<li>${message}</li>`;
  container.classList.add('show'); // Плавное появление
}

/* ========================================
   🎛 Показ блока тем
======================================== */
function showTopics(trigger) {
  const tr = trigger.closest("tr");
  const forumId = tr.id.match(/\d+/)[0];
  if (currentForumId === forumId && tr.querySelector(".topicslist")) return;

  document.querySelectorAll(".topicslist").forEach(el => el.remove());

  const header = tr.querySelector("h3");
  const box = document.createElement("div");
  box.className = "topicslist";
  box.innerHTML = `<ul><li class="load">${translations[lang].loadTopics}</li></ul>`;
  header.insertAdjacentElement("afterend", box);

  positionBox(trigger, box);
  loadTopics(box, forumId);
  currentForumId = forumId;

  if (getParams().selectAction === "hover" && !getParams().touchDevice) resetCloseTimeout(box);
}

function resetCloseTimeout(box) {
  clearTimeout(closeTimeout);
  closeTimeout = setTimeout(() => {
    box.remove();
    currentForumId = null;
  }, 2000);
}

/* ========================================
   📌 Позиционирование блока справа
======================================== */
function positionBox(button, box) {
  const rect = button.getBoundingClientRect();
  const scrollTop = window.scrollY || document.documentElement.scrollTop;
  const scrollLeft = window.scrollX || document.documentElement.scrollLeft;

  box.style.position = 'absolute';
  box.style.left = `${rect.right + scrollLeft + 5}px`; // справа с отступом
  box.style.top = `${rect.top + scrollTop}px`;          // по верхнему краю кнопки

  const maxRight = window.innerWidth - 10;
  if (rect.right + 5 + box.offsetWidth > maxRight) {
    box.style.left = `${maxRight - box.offsetWidth}px`;
  }
}

/* ========================================
   🚀 Инициализация кнопок и слушателей
======================================== */
function initListeners() {
  document.querySelectorAll(".tclcon h3 a").forEach(a => {
    const btn = document.createElement("span");
    btn.className = "clickt";
    btn.title = translations[lang].showTopics;
    btn.innerHTML = getParams().templateClick; // ← картинка вместо стрелки
    a.insertAdjacentElement("afterend", btn);

    btn.addEventListener("click", e => {
      e.stopPropagation();
      const row = btn.closest("tr");
      const forumId = row.id.match(/\d+/)[0];
      const box = row.querySelector(".topicslist");

      if (currentForumId === forumId && box) { box.remove(); currentForumId = null; }
      else showTopics(btn);
    });
  });

  document.addEventListener("click", e => {
    if (!e.target.closest(".topicslist") && !e.target.closest(".clickt")) {
      document.querySelectorAll(".topicslist").forEach(el => el.remove());
      currentForumId = null;
    }
  });
}

document.addEventListener("DOMContentLoaded", initListeners);
</script>

Это я сделал из скрипта уважаемого господина Reysler. У него код выглядит более компактно за счёт вынесения разной логики по разным внешним файлам которые подгружаются, это удобно и и это считается хорошим тоном в программировании, и браузер может это быстрее загружать (теоретически). Но "большой кусок кода" тоже  работает  :)
(мне просто сейчас лень разносить всё по внешним файлам, сорри  :) )

Извините, аналогично криво, но только теперь вообще всё в [ягодицы] уехало + кучу всего перенастраивать надо, а смысла нет, так что оставляю прежний...

0

356

Merlin777 написал(а):

348й пост, вы имеете в виду?

Это и есть заветный скрипт для иконок справа от названий и для превью? СПАСИБО.

0

357

<3 написал(а):

Извините, а что за проблема с подписями:
https://upforme.ru/uploads/0000/14/1c/38357/991826.png
Не вижу изображений, в настройках разрешила, где что упустила?

Осталась эта проблема, я явно где-то что-то забыла включить.

0

358

<3 написал(а):

Не, перепроверила, всё включено вроде... А картинку в подписи не видно, странно.

Перепроверьте ещё раз в админке: Права ---> Подпись  ---> "Разрешить BBCode [img*][/img*] в подписи пользователя? (не рекомендуется)." ---> Отметить "Да". Именно эти теги должны быть (выделено), только звёздочки из них уберите. Я протестировала - у меня картинка в подписи показывалась.

Отредактировано Neo.Neo (Вс, 28 Сен 2025 18:01:06)

0

359

Neo.Neo
Да, это включено давно, а вот в профиле "Отображение" было выключено почему-то - включила и заработало.)

0

360

<3 написал(а):

так что оставляю прежний...

Посмотрите ЛС.

0


Вы здесь » Единый форум поддержки » Форум для новичков » Общие вопросы от новичков (63) #3