Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

HTML блок Скрытие текста кнопкой "Читать далее"


Recommended Posts

Доброго времени суток, друзья!

 

Возникла проблема на сайте. Сайт на OpenCart 3, тема UltraStore

На главной странице добавлен HTML блок с описанием магазина - получается целая простыня. Смотрится не очень

Пытался скрыть текст с помощью кнопки "Читать дальше"

 

Пытался сделать через HTML+CSS, пытался сделать через скрипт readmore.min.js.

То ли руки не с того места стоят.. то ли не пойму. Скрипт в хедер темы добавил, скрипт в папку добавил... пытался оформить текст - и абсолютно ничего не происходит..

Помогите, пожалуйста.. как реализовать эту кнопку "Читать далее"?

Link to comment
Share on other sites


HTML

<div class="about_block hidden">
	<div class="about_content">
		<div class="about_text block_content">
			<h1>Интернет-магазин Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин</h1>
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
		</div>
		<button class="button_type_link" data-show_text="Читать полностью" data-hide_text="Скрыть" type="button">Читать полностью</button>
	</div>
</div>

 

CSS

.about_block .about_content {
  padding: 8px 38px 28px 38px;
  border: 1px solid #e5e5e5;
  border-radius: 2px;
  box-sizing: border-box
}

.about_block .about_text {
  position: relative;
  margin: 20px 0
}

.about_block.hidden {
  display: block !important;
}

.about_block.hidden .about_text {
  max-height: 120px;
  overflow: hidden
}

.about_block .button_type_link {
  color: #53a545;
  font-size: 16px;
  cursor: pointer;
  background: 0 0;
  border: none;
  padding: 0;
  margin-bottom: 20px;
  border-bottom: 1px dotted;
  text-decoration: none
}

.about_block .button_type_link:hover {
  border-bottom: 1px dotted #fff
}

 

JavaScript

$(document).ready(function() {
	$('.about_block .button_type_link').click(function () {
		$(this).parents('.about_block').toggleClass('hidden');
		!0 === $('.about_block').hasClass('hidden') ? $(this).text($(this).data('show_text')) : $(this).text	($(this).data('hide_text'));
	});
});

 

подправите css как Вам угодно...

  • +1 1
Link to comment
Share on other sites

5 часов назад, DomovoyUA сказал:

Пытался сделать через HTML+CSS, пытался сделать через скрипт readmore.min.js.

То ли руки не с того места стоят.. то ли не пойму. Скрипт в хедер темы добавил, скрипт в папку добавил... пытался оформить текст - и абсолютно ничего не происходит..

 

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

Кеш чистили?

Link to comment
Share on other sites


10 часов назад, S_A_P сказал:

HTML

<div class="about_block hidden">
	<div class="about_content">
		<div class="about_text block_content">
			<h1>Интернет-магазин Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин</h1>
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
			Интернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазинИнтернет-магазин
		</div>
		<button class="button_type_link" data-show_text="Читать полностью" data-hide_text="Скрыть" type="button">Читать полностью</button>
	</div>
</div>

 

CSS

.about_block .about_content {
  padding: 8px 38px 28px 38px;
  border: 1px solid #e5e5e5;
  border-radius: 2px;
  box-sizing: border-box
}

.about_block .about_text {
  position: relative;
  margin: 20px 0
}

.about_block.hidden {
  display: block !important;
}

.about_block.hidden .about_text {
  max-height: 120px;
  overflow: hidden
}

.about_block .button_type_link {
  color: #53a545;
  font-size: 16px;
  cursor: pointer;
  background: 0 0;
  border: none;
  padding: 0;
  margin-bottom: 20px;
  border-bottom: 1px dotted;
  text-decoration: none
}

.about_block .button_type_link:hover {
  border-bottom: 1px dotted #fff
}

 

JavaScript

$(document).ready(function() {
	$('.about_block .button_type_link').click(function () {
		$(this).parents('.about_block').toggleClass('hidden');
		!0 === $('.about_block').hasClass('hidden') ? $(this).text($(this).data('show_text')) : $(this).text	($(this).data('hide_text'));
	});
});

 

подправите css как Вам угодно...

 

Спасибо большое за подсказку.. но в статье появилась кнопка "Читать полностью" и не более.. текст как был развернут, так и остался.

Кеш чистил и со стороны админки, и со стороны браузера. Какая-то беда...

Link to comment
Share on other sites


1 час назад, Tom сказал:

Опишите, что вы сделали, для его работы.

Шаблон сайта стоит Ultrastore

1, Скачал readmore.min.js. закинул его по адресу - /catalog/view/theme/oct_ultrastore/js/

 

2. Шаблоне темы прописал к нему путь в файле /catalog/view/theme/oct_ultrastore/template/common/header.twig - Между тегами HEAD

<script type='text/javascript' src="/catalog/view/theme/oct_ultrastore/js/readmore.min.js"></script>

3. В самом шаблоне есть возможность с админки добавлять свой скрипт в настройках шаблона. Добавил туда скрипт :

$(function() { $('#demo').readmore({ moreLink: '<a href="#">Читать больше...</a>', lessLink: '<a href="#">Не хочу больше читать</a>', collapsedHeight: 432, speed: 200, afterToggle: function(trigger, element, expanded) { if(! expanded) { // The "Close" link was clicked $('html, body').animate({scrollTop: $(element).offset().top}, {duration: 100}); } } }); });

 

4. В Модуле "HTML-собержимое" редактор переключил на редактирование кода и обернул текст:

 

<section id="demo">Мой текст</section>

 

5. Очистил кеш темы, очистил кеш модификаторв, очистил кеш браузеров.

Открыл страницу с текстом - посмотрел исходный код страницы - путь скрипта прописан, скрипт в футере прописан, текст обернут в <section id="demo">Мой текст</section>

Но вот текст не сжимает и  кнопки "читать дальше" нету :(

Что еще сделать - я не знаю((

Link to comment
Share on other sites


Шаблон ваш может кешировать результаты. Может вы вносили правки в редактор шаблона итд итп.

Откройте ваш HTML модуль, войдите в режим исходного кода и сделайте как то так например.
<p class="more-text">

Здесь ваш текст , который мы скрываем

</p>

<script type="text/javascript"><!--  
    $('.more-text').readmore({      
    speed: 75,      
    collapsedHeight: 155,      
    moreLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Подробнее</span></a>',      
    lessLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Закрыть</span></a>'
    });  
//--></script>

Выйдете из режима исходного кода и сохраните.

Возможно, что сам скрипт не подключился у вас. Можно просто добавить там же в режиме исходного кода, взяв скрипт с CDN

https://cdnjs.com/libraries/Readmore.js/2.0.2

То есть после //--></script> , добавьте
<script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.0.2/readmore.min.js" integrity="sha512-llWtDR3k09pa9nOBfutQnrS2kIEG7M6Zm7RIjVVLNab1wRs8NUmA0OjAE38jKzKeCg+A3rdq8AVW41ZTsfhu5Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Link to comment
Share on other sites

1 час назад, Tom сказал:

Шаблон ваш может кешировать результаты. Может вы вносили правки в редактор шаблона итд итп.

Откройте ваш HTML модуль, войдите в режим исходного кода и сделайте как то так например.
<p class="more-text">

Здесь ваш текст , который мы скрываем

</p>

<script type="text/javascript"><!--  
    $('.more-text').readmore({      
    speed: 75,      
    collapsedHeight: 155,      
    moreLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Подробнее</span></a>',      
    lessLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Закрыть</span></a>'
    });  
//--></script>

Выйдете из режима исходного кода и сохраните.

Возможно, что сам скрипт не подключился у вас. Можно просто добавить там же в режиме исходного кода, взяв скрипт с CDN

https://cdnjs.com/libraries/Readmore.js/2.0.2

То есть после //--></script> , добавьте
<script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.0.2/readmore.min.js" integrity="sha512-llWtDR3k09pa9nOBfutQnrS2kIEG7M6Zm7RIjVVLNab1wRs8NUmA0OjAE38jKzKeCg+A3rdq8AVW41ZTsfhu5Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

 

 

Попробовал. В исходном коде страницы всё отображается - а текст как не сворачивался, так и не сворачивается.

Вот кусок со исходного страницы

Спойлер
<div class="row row-padding-top">
	<div class="col-12">
		<div class="us-html-box">
						<h1>Интернет-магазин DOMOVOY - покупай с выгодой!</h1>
						<div class="us-html-box-text"><p class="more-text">
</p>
<p style="text-align: justify;">Компания &laquo;Домовой&raquo; начала свою деятельность в прекрасном городе Кременчуг в 2000 году. С небольших торговых площадей, сегодня сеть имеет 8 магазинов и один Центр Строительных материалов в Полтавской области &ndash; в Кременчуге, Светловодске и Горишних Плавнях. В 2018 году также был открыт ЦКИФ, где вы можете купить все для кровли и фасада, заказав услугу монтажа или ремонта. Отдельного внимания заслуживает наш салон &laquo;Желтый Аэроплан&raquo;, ведь только здесь вы сможете заказать дизайн-проект с полной комплектацией стройматериалами в Кременчуге.
</p>
<p style="text-align: justify;">Наша&nbsp;сеть строительных магазинов&nbsp;&ndash; это полноценные склады, на которых поддерживается запас наиболее востребованных товаров. В каждом магазине вас встретят квалифицированные сотрудники. Специалист &laquo;Домового&raquo; поможет в выборе материала, примет и просчитает заказ, а также позаботится о самой выгодной и быстрой доставке необходимого Вам товара. Также&nbsp;<strong>купить стройматериалы</strong>&nbsp;вы можете в одноименном интернет-магазине &laquo;Домовой&raquo;. На сайте представлен ассортимент каждого магазина сети, включая товары ЦСМ и ЦКИФ.
</p>
<p style="text-align: justify;">&laquo;Домовой&raquo; является прямым поставщиком (дилером, дистрибьютором, представителем) ведущих отечественных и европейских производителей строительных материалов, представленных на рынке Украины. Ассортимент сети насчитывает более 200 000 наименований товаров, и мы постоянно пополняем и расширяем каталог товаров для максимально полной комплектации любых строительных объектов.
</p>
<p style="text-align: justify;">Мы собираем и совершенствуем свои знания в сфере полной комплектации и строительства объектов. Любые виды кровельных покрытий, системы утепления зданий и сооружений, фасадная отделка домов, всевозможные комплектующие для водоснабжения, энергоэффективные системы отопления &ndash; это наша родная сфера, в которой мы разбираемся. Качественные стройматериалы Кременчуг оптом ждут вас только в нашей сети &ndash; по самой выгодной цене и в самом большом ассортименте.&nbsp;&nbsp;
</p>
<p style="text-align: justify;">Постоянное участие в реализации строительных проектов различных масштабов зарекомендовало нас в строительной отрасли региона, как надежного и выгодного партнера. &laquo;Домовой&raquo; &ndash; компания, ориентированная на долгосрочные отношения с каждым клиентом. Принципы работы нашей строительной сети &ndash; предложить оптимальное техническое решение, сэкономить бюджет клиента, оптимизировать и улучшить результат строительства или ремонта максимально выгодно и быстро. С помощью нашего интернет-магазина, вы получите самые продуманные и эффективные системы строительных материалов, которые позволят оптимизировать расходы и добиться высокого качества строительства или ремонта.
</p>
<p style="text-align: justify;"><strong>Среди преимуществ покупок у нас:</strong>
</p>
<ul style="text-align: justify;">
  <li>высокое качество всех строительных материалов</li>
  <li>выгодные цены и гибкая система скидок</li>
  <li>регулярные&nbsp;акции и подарки</li>
  <li>самовывоз материалов со склада либо быстрая доставка на объект (свой автопарк)</li>
  <li>техническая поддержка (консультации специалистов, технические решения)</li>
  <li>возможность заказа полного комплекса услуг по строительству и ремонту</li>
</ul>
<p style="text-align: justify;">Центральный офис &laquo;Домового&raquo; и Центр Стройматериалов находятся в г. Кременчуг, но интернет-магазин работает для клиентов по всей Украине.
</p>
<p>
</p>
<script type="text/javascript"><!--  
  $('.more-text').readmore({      
    speed: 75,      
    collapsedHeight: 155,      
    moreLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Подробнее</span></a>',      
    lessLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Закрыть</span></a>'
  });  
  //--></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.0.2/readmore.min.js" integrity="sha512-llWtDR3k09pa9nOBfutQnrS2kIEG7M6Zm7RIjVVLNab1wRs8NUmA0OjAE38jKzKeCg+A3rdq8AVW41ZTsfhu5Q==" crossorigin="anonymous" referrerpolicy="no-referrer">
</script></div>
		</div>
	</div>
</div>

 

 

Link to comment
Share on other sites


Так вы же не обернули текст в класс  more-text. У вас там свой класс есть us-html-box-text, замените им все упоминания в моем сообщении о text-more.

 

Link to comment
Share on other sites

Показал часть исходного кода страницы, не блока. Текст в класс обернут. - http://joxi.ru/52aj3nYCgjB0DA
 

Вот код с HTML модуля -

Спойлер
<p class="more-text">
<p style="text-align: justify;">Компания &laquo;Домовой&raquo; начала свою деятельность в прекрасном городе Кременчуг в 2000 году. С небольших торговых площадей, сегодня сеть имеет 8 магазинов и один Центр Строительных материалов в Полтавской области &ndash; в Кременчуге, Светловодске и Горишних Плавнях. В 2018 году также был открыт ЦКИФ, где вы можете купить все для кровли и фасада, заказав услугу монтажа или ремонта. Отдельного внимания заслуживает наш салон &laquo;Желтый Аэроплан&raquo;, ведь только здесь вы сможете заказать дизайн-проект с полной комплектацией стройматериалами в Кременчуге.
</p>
<p style="text-align: justify;">Наша&nbsp;сеть строительных магазинов&nbsp;&ndash; это полноценные склады, на которых поддерживается запас наиболее востребованных товаров. В каждом магазине вас встретят квалифицированные сотрудники. Специалист &laquo;Домового&raquo; поможет в выборе материала, примет и просчитает заказ, а также позаботится о самой выгодной и быстрой доставке необходимого Вам товара. Также&nbsp;<strong>купить стройматериалы</strong>&nbsp;вы можете в одноименном интернет-магазине &laquo;Домовой&raquo;. На сайте представлен ассортимент каждого магазина сети, включая товары ЦСМ и ЦКИФ.
</p>
<p style="text-align: justify;">&laquo;Домовой&raquo; является прямым поставщиком (дилером, дистрибьютором, представителем) ведущих отечественных и европейских производителей строительных материалов, представленных на рынке Украины. Ассортимент сети насчитывает более 200 000 наименований товаров, и мы постоянно пополняем и расширяем каталог товаров для максимально полной комплектации любых строительных объектов.
</p>
<p style="text-align: justify;">Мы собираем и совершенствуем свои знания в сфере полной комплектации и строительства объектов. Любые виды кровельных покрытий, системы утепления зданий и сооружений, фасадная отделка домов, всевозможные комплектующие для водоснабжения, энергоэффективные системы отопления &ndash; это наша родная сфера, в которой мы разбираемся. Качественные стройматериалы Кременчуг оптом ждут вас только в нашей сети &ndash; по самой выгодной цене и в самом большом ассортименте.&nbsp;&nbsp;
</p>
<p style="text-align: justify;">Постоянное участие в реализации строительных проектов различных масштабов зарекомендовало нас в строительной отрасли региона, как надежного и выгодного партнера. &laquo;Домовой&raquo; &ndash; компания, ориентированная на долгосрочные отношения с каждым клиентом. Принципы работы нашей строительной сети &ndash; предложить оптимальное техническое решение, сэкономить бюджет клиента, оптимизировать и улучшить результат строительства или ремонта максимально выгодно и быстро. С помощью нашего интернет-магазина, вы получите самые продуманные и эффективные системы строительных материалов, которые позволят оптимизировать расходы и добиться высокого качества строительства или ремонта.
</p>
<p style="text-align: justify;"><strong>Среди преимуществ покупок у нас:</strong>
</p>
<ul style="text-align: justify;">
  <li>высокое качество всех строительных материалов</li>
  <li>выгодные цены и гибкая система скидок</li>
  <li>регулярные&nbsp;акции и подарки</li>
  <li>самовывоз материалов со склада либо быстрая доставка на объект (свой автопарк)</li>
  <li>техническая поддержка (консультации специалистов, технические решения)</li>
  <li>возможность заказа полного комплекса услуг по строительству и ремонту</li>
</ul>
<p style="text-align: justify;">Центральный офис &laquo;Домового&raquo; и Центр Стройматериалов находятся в г. Кременчуг, но интернет-магазин работает для клиентов по всей Украине.</p>
</p>
<script type="text/javascript"><!--  
  $('.more-text').readmore({      
    speed: 75,      
    collapsedHeight: 155,      
    moreLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Подробнее</span></a>',      
    lessLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Закрыть</span></a>'
  });  
  //--></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.0.2/readmore.min.js" integrity="sha512-llWtDR3k09pa9nOBfutQnrS2kIEG7M6Zm7RIjVVLNab1wRs8NUmA0OjAE38jKzKeCg+A3rdq8AVW41ZTsfhu5Q==" crossorigin="anonymous" referrerpolicy="no-referrer">
</script>

 

Все равно не хочет. Не понимаю.. Сам шаблон режет.. или что за беда

Link to comment
Share on other sites


7 минут назад, Tom сказал:

Зачем у вас два тэга <p>.   ?

Я не знаю как по другому весь текст обернуть в <p class="more-text"></p>

Статья, которая была у меня уже отформатирована - ее обернул в тэг <p class="more-text"></p>

Link to comment
Share on other sites


Чуть переделал код - вроде бы лучше.. но что-то не то -

Свернутый - http://joxi.ru/EA48DKvUv7nPBA

 

Развернутый - http://joxi.ru/Q2KK8e7iyKMbV2

 Код

Спойлер

<p  class="more-text" style="text-align: justify;">Компания &laquo;Домовой&raquo; начала свою деятельность в прекрасном городе Кременчуг в 2000 году. С небольших торговых площадей, сегодня сеть имеет 8 магазинов и один Центр Строительных материалов в Полтавской области &ndash; в Кременчуге, Светловодске и Горишних Плавнях. В 2018 году также был открыт ЦКИФ, где вы можете купить все для кровли и фасада, заказав услугу монтажа или ремонта. Отдельного внимания заслуживает наш салон &laquo;Желтый Аэроплан&raquo;, ведь только здесь вы сможете заказать дизайн-проект с полной комплектацией стройматериалами в Кременчуге.
</br></br>
 Наша&nbsp;сеть строительных магазинов&nbsp;&ndash; это полноценные склады, на которых поддерживается запас наиболее востребованных товаров. В каждом магазине вас встретят квалифицированные сотрудники. Специалист &laquo;Домового&raquo; поможет в выборе материала, примет и просчитает заказ, а также позаботится о самой выгодной и быстрой доставке необходимого Вам товара. Также&nbsp;<strong>купить стройматериалы</strong>&nbsp;вы можете в одноименном интернет-магазине &laquo;Домовой&raquo;. На сайте представлен ассортимент каждого магазина сети, включая товары ЦСМ и ЦКИФ.
</br></br>
&laquo;Домовой&raquo; является прямым поставщиком (дилером, дистрибьютором, представителем) ведущих отечественных и европейских производителей строительных материалов, представленных на рынке Украины. Ассортимент сети насчитывает более 200 000 наименований товаров, и мы постоянно пополняем и расширяем каталог товаров для максимально полной комплектации любых строительных объектов.
</br></br>
Мы собираем и совершенствуем свои знания в сфере полной комплектации и строительства объектов. Любые виды кровельных покрытий, системы утепления зданий и сооружений, фасадная отделка домов, всевозможные комплектующие для водоснабжения, энергоэффективные системы отопления &ndash; это наша родная сфера, в которой мы разбираемся. Качественные стройматериалы Кременчуг оптом ждут вас только в нашей сети &ndash; по самой выгодной цене и в самом большом ассортименте.&nbsp;&nbsp;
</br></br>
Постоянное участие в реализации строительных проектов различных масштабов зарекомендовало нас в строительной отрасли региона, как надежного и выгодного партнера. &laquo;Домовой&raquo; &ndash; компания, ориентированная на долгосрочные отношения с каждым клиентом. Принципы работы нашей строительной сети &ndash; предложить оптимальное техническое решение, сэкономить бюджет клиента, оптимизировать и улучшить результат строительства или ремонта максимально выгодно и быстро. С помощью нашего интернет-магазина, вы получите самые продуманные и эффективные системы строительных материалов, которые позволят оптимизировать расходы и добиться высокого качества строительства или ремонта.
</br></br>
<strong>Среди преимуществ покупок у нас:</strong>
</br></br>
<ul style="text-align: justify;">
  <li>высокое качество всех строительных материалов</li>
  <li>выгодные цены и гибкая система скидок</li>
  <li>регулярные&nbsp;акции и подарки</li>
  <li>самовывоз материалов со склада либо быстрая доставка на объект (свой автопарк)</li>
  <li>техническая поддержка (консультации специалистов, технические решения)</li>
  <li>возможность заказа полного комплекса услуг по строительству и ремонту</li>
</ul>
</br></br>Центральный офис &laquo;Домового&raquo; и Центр Стройматериалов находятся в г. Кременчуг, но интернет-магазин работает для клиентов по всей Украине.
</p>

<script type="text/javascript"><!--  
  $('.more-text').readmore({      
    speed: 75,      
    collapsedHeight: 155,      
    moreLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Подробнее</span></a>',      
    lessLink: '<a href="#"><span style="border-width:1px;  border-bottom-style:dashed;">Закрыть</span></a>'
  });  
  //--></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Readmore.js/2.0.2/readmore.min.js" integrity="sha512-llWtDR3k09pa9nOBfutQnrS2kIEG7M6Zm7RIjVVLNab1wRs8NUmA0OjAE38jKzKeCg+A3rdq8AVW41ZTsfhu5Q==" crossorigin="anonymous" referrerpolicy="no-referrer">
</script>

 

 

Link to comment
Share on other sites


Ну так где закрыт у вас тэг , там и выводится кнопка.

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

Давно бы открыли ваш текст любым текстовым редактором типа notepad ++ и посмотрели где и как у вас закрывается тот самый тэг p.

Link to comment
Share on other sites

9 минут назад, Tom сказал:

Ну так где закрыт у вас тэг , там и выводится кнопка.

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

Давно бы открыли ваш текст любым текстовым редактором типа notepad ++ и посмотрели где и как у вас закрывается тот самый тэг p.

Так я и делал в редакторе, и проверил где открывается и закрывается тэг - http://joxi.ru/RmzPdYkijB7GkA

Link to comment
Share on other sites


Идеи закончились. Значит так всё это режет у вас или редактор или шаблон.

Попробуйте не вставлять в редактор скрипты и вставьте их в футер например вашего шаблона.

Link to comment
Share on other sites

12 минут назад, DomovoyUA сказал:

Так я и делал в редакторе, и проверил где открывается и закрывается тэг - http://joxi.ru/RmzPdYkijB7GkA

и список <ul> внутри строки <p> Вас, естественно, не смутил?
 

Спойлер

image.png.e3ecbb667161b53d85ab4cbfe749b688.png


Вполне закономерно, что html интерпретатор браузера закроет тег p когда "увидит" список. А после списка он же заметить закрытый p и для корректности исправит код, открыв его предварительно
Пример кода и интерпретатора на скрине ниже
 

Спойлер

image.thumb.png.aa4a5f828cbb1e95bd24e8403be524e1.png

 

Link to comment
Share on other sites

Спойлер

<div class="more-text">

<p style="text-align: justify;">Компания «Домовой» начала свою деятельность в прекрасном городе Кременчуг в 2000 году. С небольших торговых площадей, сегодня сеть имеет 8 магазинов и один Центр Строительных материалов в Полтавской области – в Кременчуге, Светловодске и Горишних Плавнях. В 2018 году также был открыт ЦКИФ, где вы можете купить все для кровли и фасада, заказав услугу монтажа или ремонта. Отдельного внимания заслуживает наш салон «Желтый Аэроплан», ведь только здесь вы сможете заказать дизайн-проект с полной комплектацией стройматериалами в Кременчуге.
</p>
<p style="text-align: justify;">Наша&nbsp;сеть строительных магазинов&nbsp;– это полноценные склады, на которых поддерживается запас наиболее востребованных товаров. В каждом магазине вас встретят квалифицированные сотрудники. Специалист «Домового» поможет в выборе материала, примет и просчитает заказ, а также позаботится о самой выгодной и быстрой доставке необходимого Вам товара. Также&nbsp;<strong>купить стройматериалы</strong>&nbsp;вы можете в одноименном интернет-магазине «Домовой». На сайте представлен ассортимент каждого магазина сети, включая товары ЦСМ и ЦКИФ.
</p>
<p style="text-align: justify;">«Домовой» является прямым поставщиком (дилером, дистрибьютором, представителем) ведущих отечественных и европейских производителей строительных материалов, представленных на рынке Украины. Ассортимент сети насчитывает более 200 000 наименований товаров, и мы постоянно пополняем и расширяем каталог товаров для максимально полной комплектации любых строительных объектов.
</p>
<p style="text-align: justify;">Мы собираем и совершенствуем свои знания в сфере полной комплектации и строительства объектов. Любые виды кровельных покрытий, системы утепления зданий и сооружений, фасадная отделка домов, всевозможные комплектующие для водоснабжения, энергоэффективные системы отопления – это наша родная сфера, в которой мы разбираемся. Качественные стройматериалы Кременчуг оптом ждут вас только в нашей сети – по самой выгодной цене и в самом большом ассортименте.&nbsp;&nbsp;
</p>
<p style="text-align: justify;">Постоянное участие в реализации строительных проектов различных масштабов зарекомендовало нас в строительной отрасли региона, как надежного и выгодного партнера. «Домовой» – компания, ориентированная на долгосрочные отношения с каждым клиентом. Принципы работы нашей строительной сети – предложить оптимальное техническое решение, сэкономить бюджет клиента, оптимизировать и улучшить результат строительства или ремонта максимально выгодно и быстро. С помощью нашего интернет-магазина, вы получите самые продуманные и эффективные системы строительных материалов, которые позволят оптимизировать расходы и добиться высокого качества строительства или ремонта.
</p>
<p style="text-align: justify;"><strong>Среди преимуществ покупок у нас:</strong>
</p>
<ul style="text-align: justify;">
  <li>высокое качество всех строительных материалов</li>
  <li>выгодные цены и гибкая система скидок</li>
  <li>регулярные&nbsp;акции и подарки</li>
  <li>самовывоз материалов со склада либо быстрая доставка на объект (свой автопарк)</li>
  <li>техническая поддержка (консультации специалистов, технические решения)</li>
  <li>возможность заказа полного комплекса услуг по строительству и ремонту</li>
</ul>
<p style="text-align: justify;">Центральный офис «Домового» и Центр Стройматериалов находятся в г. Кременчуг, но интернет-магазин работает для клиентов по всей Украине.
</p></div>
 

Это в текстовый редактор.

А это в футер перед </body></html>

				<script src="/catalog/view/javascript/readmore.min.js" ></script>
				<script type="text/javascript"><!--  
				$('.more-text').readmore({  	
    				speed: 75,  	
    				collapsedHeight: 150,  	
    				moreLink: '<a href="#"><span style="font-size: 14px; background-color:#ED9A22;font-weight: 700;padding: 5px;color: white;">Подробнее</span></a>',  	
    				lessLink: '<a href="#"><span style="font-size: 14px; background-color:#ED9A22;font-weight: 700;padding: 5px;color: white;">Закрыть</span></a>'
				});  
				//--></script>

 

Link to comment
Share on other sites

17 минут назад, DomovoyUA сказал:

Смутил.. Но не особо что-то поменялось - http://joxi.ru/krDVnqDHgawyW2

Очень сложно что-то советовать, не видя редактируемой страницы.
По Вашему нику нашел, конечно, что-то похожее, но там правок не видно.
 

Спойлер

image.thumb.png.a79c34ecaf9446fb0298ab4c24a4e0b6.png

 

Link to comment
Share on other sites

@Tom выше предложил в <div> обернуть. Должно сработать. Просто Вы, как мне кажется, действительно не совсем понимаете что делаете.
Ибо исходя из того html кода, который был выше Вы пытаетесь скрыть ВСЁ! а не какую-то часть текста. Ибо будет непонятно что "Подробнее". С таким кодом это будет выглядеть так:
 

Спойлер

image.thumb.png.164a238c378fedf28159eef77907ded8.png


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

  • +1 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.