Alt

Alt 2.3.7

Нет прав для скачивания
для версии 2.2.8 подойдет данный стиль?
 
только что установил, такая же проблема, плагин поставил, стиль Alt как основной, остальные два под родительский стиль, просто белый фон и все, ничего нету
При импорте стиля форум попросту белый (нет никого текста / функционала) , подскажите какие дополнительно плагины должны быть?
А файлы с архива, грузили на сервер?
 

Вложения

  • joxi_screenshot_1740630388689.png
    joxi_screenshot_1740630388689.png
    60 KB · Просмотры: 36
Данная версия стиля (которую скачиваете), работает на 2.2?
Она не может работать на 2.2 из-за ряда изменений в шаблонах, по этому если будете заливать и под неё, то заливайте оба варианта сразу, что бы не путать версионность.
 
Добавил необходимый виджет и вот такая история...
 

Вложения

  • 1000036298.jpg
    1000036298.jpg
    361.1 KB · Просмотры: 23
  • Screenshot_20250401-162803.jpg
    Screenshot_20250401-162803.jpg
    596 KB · Просмотры: 22
В связи с созданной новой темой по поводу белого экрана после импорта стиля, расскажу, в чём именно заключается проблема. Если почитать тему стиля, то Svyat уже давал ответ на этот счёт. В шаблоне PAGE_CONTAINER прописан следующий код:
HTML:
<xf:if is="property('dt_latest_posts')">
    <div class="p-body-latest">
        <xf:widget key="forum_overview_new_posts" />
    </div>
</xf:if>
В нём видно, что используется ключ виджета forum_overview_new_posts, однако такого виджета с этим ключом в XenForo 2.3 изначально нет. Из-за этого XenForo не может его найти, что и приводит к "белому экрану". Чтобы избежать этой ошибки, необходимо отключить отображение данного блока. Для этого перейдите в Внешний вид -> Настройки стиля -> [DohTheme] -> Basic options и снимите галочку с настройки Latest Posts. После этого проблема исчезнет.
 
В связи с созданной новой темой по поводу белого экрана после импорта стиля, расскажу, в чём именно заключается проблема. Если почитать тему стиля, то Svyat уже давал ответ на этот счёт. В шаблоне PAGE_CONTAINER прописан следующий код:
HTML:
<xf:if is="property('dt_latest_posts')">
    <div class="p-body-latest">
        <xf:widget key="forum_overview_new_posts" />
    </div>
</xf:if>
В нём видно, что используется ключ виджета forum_overview_new_posts, однако такого виджета с этим ключом в XenForo 2.3 изначально нет. Из-за этого XenForo не может его найти, что и приводит к "белому экрану". Чтобы избежать этой ошибки, необходимо отключить отображение данного блока. Для этого перейдите в Внешний вид -> Настройки стиля -> [DohTheme] -> Basic options и снимите галочку с настройки Latest Posts. После этого проблема исчезнет.
OFFTOP

Как такое решение пришло на вашу голову?

 
А как поставить фото на фон узла в gridnodeimg?
 
Последнее редактирование:
А как поставить фото на фон узла в gridnodeimg?
gridNodeImg это второстепенный стиль под родительским, это никак не имеет прямое отношение к форуму, фото на фон узла можно поставить на настройке узла.
 
Мб нужно кому будет. 100% уже есть где то, но когда нужно было не нашел.
Простое раздвижное анимационное меню.
1756366951315.png1756366988545.png

Код:
<style>
    /* --- БАЗОВЫЕ СТИЛИ (можно вставить прямо в блок) --- */
   :root{
--hover-bg:rgba(37,99,235,0.06);
--radius:10px;
--transition:260ms cubic-bezier(.2,.9,.3,1);
--panel-max-height: 600px; /* запас для анимации */
}
    .sliding-menu{font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;max-width:420px}

    .sm-item{
      display:flex;align-items:center;justify-content:space-between;
      padding:12px 14px;border-radius:var(--radius);cursor:pointer;
      user-select:none;position:relative;color:var(--text);
      transition:background var(--transition);
    }
    .sm-item:hover{background:var(--hover-bg)}
    .sm-label{display:flex;align-items:center;gap:10px}
    .sm-title{font-size:15px;font-weight:600}
    .sm-desc{font-size:13px;color:var(--muted)}

    /* стрелка (появляется при hover на .sm-wrap) */
    .sm-toggle{
      width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;
      transform-origin:center;transition:transform var(--transition),opacity var(--transition);opacity:0;
      background:transparent;border:none;cursor:pointer
    }
    .sm-wrap:hover .sm-toggle{opacity:1}
    .sm-toggle svg{width:14px;height:14px;display:block;fill:none;stroke: #ffffff;;stroke-width:2}

    /* панель с подпунктами — через max-height для анимации */
    .sm-panel{overflow:hidden;max-height:0;transition:max-height var(--transition),padding var(--transition);}
    .sm-panel.open{padding:8px 8px 12px 8px;max-height:var(--panel-max-height)}

    .sm-sub{
      display:block;padding:8px 12px;border-radius:8px;margin:6px 4px;color:var(--text);text-decoration:none;font-size:14px;
      background:linear-gradient(180deg, rgba(0,0,0,0.01), rgba(0,0,0,0.00));
    }
    .sm-sub:hover{background:var(--hover-bg);color:var(--accent)}

    /* анимация поворота стрелки при открытии */
    .sm-wrap.open .sm-toggle{transform:rotate(90deg)}

    /* небольшая тень/оформление контейнера */
    .sm-box{background:var(--bg);border:1px solid rgba(15,23,42,0.04);padding:8px;border-radius:12px;box-shadow:0 6px 18px rgba(15,23,42,0.04)}

    /* фокус для клавиатуры */
    .sm-toggle:focus{outline:3px solid rgba(37,99,235,0.16)}
    .sm-item:focus{outline:3px solid rgba(37,99,235,0.08)}

    /* адаптивно */
    @media (max-width:420px){.sliding-menu{max-width:100%}}
  </style>

<!--
  Вставьте этот блок в ваш HTML (можно прямо в CMS/блок редактора).
  Скрипт внизу автономный — достаточно вставить весь документ или
  только содержимое <div class="sliding-menu"> и <script>...
-->

<div class="sliding-menu">
  <div class="sm-box" role="navigation" aria-label="Раздвижное меню">

    <!-- Пример пункта 1 (с подпунктами) -->
    <div class="sm-item-wrapper">
      <div class="sm-item sm-wrap" tabindex="0" aria-expanded="false">
        <div class="sm-label">
          <div class="sm-title" href="/#obsij-razdel.6">Общий раздел</div>
        </div>
        <button class="sm-toggle" aria-hidden="false" title="Открыть подразделы">
          <!-- простая стрелка вправо -->
          <svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 5l8 7-8 7" stroke-linecap="round" stroke-linejoin="round"/></svg>
        </button>
      </div>
      <div class="sm-panel" aria-hidden="true">
        <a href="/forums/ob-avlenia-i-obnovlenia.7/" class="sm-sub">Объявления и обновления</a>
      </div>
    </div>

    <!-- Пример пункта 2 (без подпунктов) -->
    <div class="sm-item-wrapper">
      <div class="sm-item" role="link" tabindex="0">
        <div class="sm-label">
          <div class="sm-title">Раздел 2</div>
          <div class="sm-desc">Переход на страницу</div>
        </div>
      </div>
    </div>

    <!-- Пример пункта 3 (с подпунктами) -->
    <div class="sm-item-wrapper">
      <div class="sm-item sm-wrap" tabindex="0" aria-expanded="false">
        <div class="sm-label">
          <div class="sm-title">Раздел 3</div>
          <div class="sm-desc">Ещё раздел</div>
        </div>
        <button class="sm-toggle" title="Открыть">
          <svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M8 5l8 7-8 7" stroke-linecap="round" stroke-linejoin="round"/></svg>
        </button>
      </div>
      <div class="sm-panel" aria-hidden="true">
        <a href="#" class="sm-sub">Подраздел 3.1</a>
        <a href="#" class="sm-sub">Подраздел 3.2</a>
      </div>
    </div>

  </div>
</div>

<script>
  // Небольшая автономная логика — подключите прямо под HTML блока
  (function(){
    const wrappers = document.querySelectorAll('.sm-item-wrapper');

    wrappers.forEach(wrap => {
      const header = wrap.querySelector('.sm-wrap');
      const panel = wrap.querySelector('.sm-panel');
      const toggle = wrap.querySelector('.sm-toggle');
      if(!header || !panel) return; // нет панели — ничего не делаем

      // подготовка: если в панели есть элементы, выставим max-height по содержимому
      const calcMax = ()=>{
        // вычислим реальную высоту содержимого и запишем в CSS-переменную
        panel.style.removeProperty('max-height');
        const contentH = panel.scrollHeight;
        panel.style.maxHeight = (contentH ? contentH + 24 : 0) + 'px';
        // но по умолчанию оставляем закрытым (контролируем через класс open)
        if(!header.classList.contains('open')) panel.style.maxHeight = '';
      }

      // открытие/закрытие
      const togglePanel = (evt)=>{
        const isOpen = header.classList.toggle('open');
        header.setAttribute('aria-expanded', isOpen);
        if(isOpen){
          panel.classList.add('open');
          panel.setAttribute('aria-hidden','false');
          // задаём max-height равным содержимому, чтобы анимация шла плавно
          panel.style.maxHeight = panel.scrollHeight + 24 + 'px';
        }else{
          panel.classList.remove('open');
          panel.setAttribute('aria-hidden','true');
          // чтобы закрытие анимировалось — установим max-height 0
          panel.style.maxHeight = '0px';
        }
      }

      // показывать кнопку стрелки только при hover — уже сделано стилями
      // слушатели
      toggle.addEventListener('click', (e)=>{ e.stopPropagation(); togglePanel(e); });

      // клики по заголовку (если нужен тоже toggle) — оставим по нажатию на кнопку только
      // но поддержим клавиатуру: Enter / Space на header — переключает
      header.addEventListener('keydown', (ev)=>{
        if(ev.key === 'Enter' || ev.key === ' '){ ev.preventDefault(); togglePanel(ev); }
      });

      // при ресайзе пересчитаем высоту
      window.addEventListener('resize', ()=>{ if(header.classList.contains('open')) calcMax(); });

      // начальная подстройка
      calcMax();
    });
  })();
</script>
 
Современный облачный хостинг провайдер | Aéza
Назад
Сверху Снизу