Блог

По мере увеличения разрешения монитора у нас остается все больше и больше горизонтального пространства (ширина) и все меньше вертикального пространства (большинство мониторов в настоящее время 16: 9 или 16: 10, некоторые даже 21: 9). Поэтому нам требуется способность делать длинные тексты более подходящими для большей ширины. Столбцы, похожие на газету, являются растущей тенденцией.

Как поддерживать их в CMS? В настоящее время у меня есть реализация, в которой текст помещается внутри s, и эти разделы затем украшаются определенными классами, например, системными CSS-файлами Blueprint (span-5, span-8 и т. Д.)

Это работает, но не обеспечивает отличного пользовательского опыта. Большинство RTES не могут отображать их или требуют, чтобы CSS сайта был связан. Это приводит ко всем другим классам и настройкам CSS, что не является оптимальным.

Я также реализовал возможность для пользователя создавать элемент текстового содержимого, который обычно содержит только один фрагмент текста (например, один столбец), и пользователь может добавлять их динамически на страницу (точно так же, как добавление / удаление виджетов). Проблема с этим решением заключается в том, что почти каждый абзац становится отдельным элементом текстового содержимого, в результате чего количество этих текстов растет и становится неуправляемым.

Пожалуйста, разместите свои варианты в качестве ответов. На самом деле я ищу довольно всеобъемлющий и инновационный способ сделать это, потому что ни один из CMS, которые я пробовал, не решил эту проблему (DotNetNuke, BlogEngine.net , Ruby’s Refinery CMS, …)

У вас есть несколько доступных вариантов, не прибегая к серверным реализациям. Некоторые браузеры поддерживают директиву CSS3 для предоставления нескольких столбцов.

 #div {
    column-count: 2;
}
 

Свойства, доступные через CSS, являются:

• ‘количество столбцов», чтобы определить количество столбцов, в которые будет передаваться содержимое элемента.
• ‘ширина столбца’, чтобы описать оптимальную ширину каждого столбца.
• ‘column-gap’, чтобы установить отступ между столбцами.
• ‘правило столбца’, чтобы определить границу между столбцами.

Это самый простой подход, но он не гарантирует одинаковый опыт везде. Существуют также решения на JavaScript, которые могут создавать столбцы на основе текста.

Вот как пример одного из них: http://www.csscripting.com/css-multi-column /

Итак, я бы рекомендовал прогрессивный подход к улучшению. Используйте опции CSS3, если они доступны, JavaScript, если нет, и вернитесь к одному широкому столбцу в противном случае.

Дополнительная информация: http://www.alistapart.com/articles/css3multicolumn

Это определенно то, с чем DotNetNuke может справиться, особенно с изменениями, внесенными в DNN 6.1. Изменения предназначены для мобильных устройств, но это не значит, что вы не можете просто использовать эту функциональность для предоставления различных представлений контента в зависимости от ширины доступного экрана.