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

AlexeyFX · 29 апреля 2023

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

При установке лимита в тег: {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.

Изменено 29 апреля 2023 пользователем AlexeyFX

celsoft · 29 апреля 2023

59 минут назад, AlexeyFX сказал:

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

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

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

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

aleksandrhristich · 29 апреля 2023

Я вместо этого "обрезания" использую обрезку по строкам с помощью 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 Идея была взята с движка форума ,на котором здесь находимся...

Изменено 29 апреля 2023 пользователем aleksandrhristich

Pupsator · 1 мая 2023

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

Войти

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

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

AlexeyFX 5

Ссылка на сообщение

Поделиться на других сайтах

celsoft 6 094

Ссылка на сообщение

Поделиться на других сайтах

aleksandrhristich 108

Ссылка на сообщение

Поделиться на других сайтах

Pupsator 17

Ссылка на сообщение

Поделиться на других сайтах

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

Форум

Активность