Перейти к публикации

В shortstory нельзя использовать HTML-элемент <p>, есть ли решение?


Рекомендованные сообщения

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

При установке лимита в тег: {short-story limit="555"} в короткой новости, в shortstory, не выводится HTML-элемент <p> и получается такой код:

<div class="short-text" style="padding: 5px 7px 5px 7px;">Welcome to the demo page of DataLife Engine. DataLife Engine is a multi-user news engine with a high functionality. First of all, the engine is designed to create news blogs and websites with a large information context. However, it has a lot of settings that allow you to use it for any purpose. The engine can be integrated into almost any existing design and it has no limatations for making new templates for it. Another key feature of DataLife Engine - is a low load on system resources. Server load will be minimal even when many users will be</div>

В исходном коде новости написано так:

<p>Welcome to the demo page of DataLife Engine. DataLife Engine is a multi-user news engine with a high functionality. First of all, the engine is designed to create news blogs and websites with a large information context. However, it has a lot of settings that allow you to use it for any purpose. The engine can be integrated into almost any existing design and it has no limatations for making new templates for it. Another key feature of DataLife Engine - is a low load on system resources. Server load will be minimal even when many users will be online, and you will not experience any problems with the information displaying. The engine is optimized for search engines. You can read about all the functional features on <a href="https://dle-news.com/" target="_blank" rel="noopener">our page</a>. 

Почему при установке лимита не выводится элемент <p> и возможно ли решить эту проблему, оставив лимит?
Версия CMS 16.0, использую на локальном сервере Open Server.

Изменено пользователем AlexeyFX
Ссылка на сообщение
Поделиться на других сайтах
59 минут назад, AlexeyFX сказал:

Почему при установке лимита не выводится элемент <p> и возможно ли решить эту проблему, оставив лимит?

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

<div class="short-text" style="padding: 5px 7px 5px 7px;">Welcome to the demo page

где нет закрывающего </div> потому как этот код не вошел в указанный лимит. И в итоге вся верстка вашего сайта будет развалена.

Ссылка на сообщение
Поделиться на других сайтах

Я вместо этого "обрезания" использую обрезку по строкам с помощью java.

Что это дает? Установив ,например,лимит в 4-е строки, при изменении ширины экрана автоматически показывает  4-е строки.

Можете попробывать/побаловаться.

Между <head></head> вставляете

Скрытый текст


<script type="text/javascript" >
( function() {

$(document).ready(function(){
    store_contents();
    lazy_update(100);
});

// Lazy update saves performance for other tasks...
var lazy_update = function(delay) {

    window.lazy_update_timeout = setTimeout(function(){

        update_ellipsis();

        $(window).one('resize', function() {
            lazy_update(delay);
        });

    }, delay);
}

var store_contents = function(){

    $('.truncate').each(function(){
        var p = $(this);
        p.data('truncate-storage', p.html());
    });
}

var update_ellipsis = function(){

    $('.truncate').each(function(){

        var p = $(this);
        var max_line_count = p.data('truncate-max-line-count');
        var line_height = p.html('&nbsp').outerHeight();
        var max_height = max_line_count*line_height;
        p.html(p.data('truncate-storage'));
        var p_height = p.outerHeight();

        while(p_height > max_height){

            var content_arr = p.html().split(' ');
            content_arr.pop();
            content_arr.pop();
            content_arr.push('');
            p.html(content_arr.join(' '));
            p_height = p.outerHeight();
        }
    });
}

} )();
</script>

 

Блок с "обрезанием"

Скрытый текст

<article>
<div style="font-weight: bold;">Обрезание по строкам</div>
<div class="truncate" data-truncate-max-line-count="4">
Welcome to the demo page of DataLife Engine. DataLife Engine is a multi-user 
news engine with a high functionality. 
First of all, the engine is designed to create news blogs and websites with a 
large information context. 
However, it has a lot of settings that allow you to use it for any purpose. 
The engine can be integrated into almost any existing design and it has no limatations 
for making new templates for it. Another key feature of 
DataLife Engine - is a low load on system resources. 
Server load will be minimal even when many users will be 
online, and you will not experience any problems with the information displaying. 
The engine is optimized for search engines. 
You can read about all the functional features on 
<a href="https://dle-news.com/" target="_blank" rel="noopener">our page</a>.
</div>
</article>

 

Кол-во отображаемых строк устанавливается в

data-truncate-max-line-count="4"

P.S Идея была взята с движка форума ,на котором здесь находимся...

Изменено пользователем aleksandrhristich
Ссылка на сообщение
Поделиться на других сайтах

Я сделал это через css. Просто добавил max-height: 500px; . Полезно если у вас длинная картинка в посте или их много.

Ссылка на сообщение
Поделиться на других сайтах

Присоединяйтесь к обсуждению

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

Гость
Ответить в тему...

×   Вставлено в виде отформатированного текста.   Вставить в виде обычного текста

  Разрешено не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отобразить как ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

×
×
  • Создать...