Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

Развернуть/свернуть описание категорий


A132

Recommended Posts

День добрый, господа!

 

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

Такой модуль существует (во вложении). Но проблема этого модуля в том, что длину текста до свёртывания он берёт, как постоянную величину, и если реальное описание в конкретной категории короче этой величины, то получается, что модуль наоборот оставляет там после текста пустое место (картинки с примерами во вложении).

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

Неправильно.png

Правильно.png

category_description_expand_collapse.ocmod.xml

Надіслати
Поділитися на інших сайтах


Может вариант более гибкий подойдет но вручную?
в редакторе в режиме html ставить описание с тегами.

<p>Текст который будет всегда отображаться</p>
<div id="block_hidden">
<p>текст который будет скрыт под кнопку</p>
</div>

<div id="button_block_view"></div>


Это поместите в category.tpl
в самый низ, перед <?php echo $footer; ?> (можете  css переместить в стили)

<script>
  $('#button_block_view').html('Читать полностью');
  $('#button_block_view').on('click', function(e){
      e.preventDefault();
  var
      $this = $(this),
      content = $('#block_hidden');  
    if(!$this.hasClass('trigger')){
        $this.addClass('trigger');
        $this.html('Скрыть');
        content.slideDown();
      } else {
        $this.removeClass('trigger');
        $this.html('Читать полностью');
        content.slideUp();
      }
  });
</script>
<style>
  #block_hidden { display: none; }
  #button_block_view {
    font-size: 15px;
    cursor: pointer;
    color: #22649c;
    text-decoration: underline;
  }
  #button_block_view:hover, #button_block_view:focus {
    color: red;
  }
</style>

 

Змінено користувачем Seofisher
Надіслати
Поділитися на інших сайтах

4 часа назад, A132 сказал:

Ссылка-то есть, только в сети автор не был уже 2 года…

 

попробуйте такой вариант

 

 

category_description_expand_collapse_upd.ocmod.xml

  • +1 1
Надіслати
Поділитися на інших сайтах

7 часов назад, Vetroff сказал:

 

попробуйте такой вариант

 

 

category_description_expand_collapse_upd.ocmod.xml 3 \u043a\u0411 · 3 downloads

 

Благодарствую! Это именно то, что нужно.

  • +1 1
Надіслати
Поділитися на інших сайтах


8 часов назад, Seofisher сказал:

Может вариант более гибкий подойдет но вручную?
в редакторе в режиме html ставить описание с тегами.


<p>Текст который будет всегда отображаться</p>
<div id="block_hidden">
<p>текст который будет скрыт под кнопку</p>
</div>

<div id="button_block_view"></div>


Это поместите в category.tpl
в самый низ, перед <?php echo $footer; ?> (можете  css переместить в стили)


<script>
  $('#button_block_view').html('Читать полностью');
  $('#button_block_view').on('click', function(e){
      e.preventDefault();
  var
      $this = $(this),
      content = $('#block_hidden');  
    if(!$this.hasClass('trigger')){
        $this.addClass('trigger');
        $this.html('Скрыть');
        content.slideDown();
      } else {
        $this.removeClass('trigger');
        $this.html('Читать полностью');
        content.slideUp();
      }
  });
</script>
<style>
  #block_hidden { display: none; }
  #button_block_view {
    font-size: 15px;
    cursor: pointer;
    color: #22649c;
    text-decoration: underline;
  }
  #button_block_view:hover, #button_block_view:focus {
    color: red;
  }
</style>

 

 

Спасибо за отклик! Мне подошёл изменённый мод, который предложил товарищ Ветрофф, но когда будет свободное время - разберусь и опробую Ваш вариант тоже.

Надіслати
Поділитися на інших сайтах


  • 2 months later...
3 часа назад, Alexandra17 сказал:

 

какой-нибудь opencart 3.x на этом?

перепилить модиф под 3

Надіслати
Поділитися на інших сайтах

3 часа назад, Alexandra17 сказал:

 

какой-нибудь opencart 3.x на этом?

image.thumb.png.9c7904158e80a4d811dc02a557be1881.png

 

category_description_expand_collapse_upd_oc3x.ocmod.zip

 

Вот доработал под 3, пользуйтесь )))

Надіслати
Поділитися на інших сайтах

В 26.08.2020 в 08:41, Alexandra17 сказал:

 

не работает в opencart версии 3.0.3.6

Должен работать. Вы скачали то что я опубликовал ?

Надіслати
Поділитися на інших сайтах

  • 1 month later...
  • 1 month later...
  • 3 months later...
  • 5 months later...
В 22.08.2020 в 15:22, legioner26 сказал:

image.thumb.png.9c7904158e80a4d811dc02a557be1881.png

 

category_description_expand_collapse_upd_oc3x.ocmod.zip 1 \u043a\u0411 · 23 downloads

 

Вот доработал под 3, пользуйтесь )))

Спасибо ,работает  в категориях . А на главной станице текст не скрывает .Можете доработать? Чтобы сворачивал длинный текс на гланой 

Надіслати
Поділитися на інших сайтах


  • 2 years later...
01.06.2020 в 12:48, Vetroff сказал:

А ніхто не допилював цей варіант для шаблона MoneyMaker2? Активувався, але не заводиться

Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.