PHPackages                             lala/list-style - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. lala/list-style

ActiveNeos-package

lala/list-style
===============

Neos Package that adds the option to change the list-style of uls and ols.

0.3.1(3y ago)012.9k↓31.6%2[3 issues](https://github.com/paxuclus/list-style/issues)MITJavaScript

Since May 2Pushed 3y ago1 watchersCompare

[ Source](https://github.com/paxuclus/list-style)[ Packagist](https://packagist.org/packages/lala/list-style)[ RSS](/packages/lala-list-style/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (4)Dependencies (1)Versions (5)Used By (0)

Lala.ListStyle
==============

[](#lalaliststyle)

Neos Package that adds the option to change the list-style of uls and ols.

Warning
-------

[](#warning)

This package is WIP.

Please keep the following caveats in mind:

- This plugin does not support adding classes to the lists. Instead, it will add an attribute `data-list-style-type="circle"` to the list
- When changing the style of a list, the complete list has to be selected in the editor, otherwise the list will be split up into multiple lists with different styles

Installation
------------

[](#installation)

`composer require lala/list-style:dev-master`

Usage
-----

[](#usage)

1. Enable formatting for a property:

```
'Neos.Demo:Content.Text':
  superTypes:
    'Neos.Neos:Content': true
    'Neos.NodeTypes.BaseMixins:TextMixin': true

  properties:
    text:
      ui:
        inline:
          editorOptions:
            formatting:
              # Enable unordered lists
              ul: true
              # Enabled ordered lists
              ol: true
            # Configure available list styles:
            #  true: enable all
            #  false|null: disable all
            #  ol|ul:
            #    true: enable all for list type
            #    false|null: disable all for list type
            #    [style]: true|false|null
            listStyle:
              ul: true
              ol:
                upper-roman: true
                lower-alpha: ~
```

2. Create a list in the editor
3. Select the whole using the cursor
4. Open the dropdown and change the list style

### Enable list styles for a property

[](#enable-list-styles-for-a-property)

In each of the following cases `true` enables the style(s), while `false` and `null` will disable it equally.

- **enable *all* configured styles:**
    `editorOptions.listStyle: true`
- **enable *all* for a list-type:**
    `editorOptions.listStyle.ul: true` or `editorOptions.listStyle.ol: ~`
- **enable individual styles:**
    this can be done with their identifier, e.g. `editorOptions.listStyle.ul.disc`

**Note:** As soon as configuration is available, this will be used, i.e. only specifying `editorOptions.listStyle.ul.square: ~` **will not** enable `ul.*` but `square`. In the same way setting *only* `editorOptions.listStyle.ul: false` will not enable any `ol` styles.

Styling
-------

[](#styling)

Please note that this plugin does not supply list styles on it's own.

There is a `ListStyles.css` file in `Resources/Public` that you can include if needed:

```
prototype(Neos.Neos:Page) {
    head.stylesheets {
        listStyles = Neos.Fusion:Component {
            href = Neos.Fusion:ResourceUri {
                path = 'resource://Lala.ListStyle/Public/ListStyles.css'
            }

            renderer = afx`

            `
        }
    }
}

```

Customization
-------------

[](#customization)

The available list styles can be customized through the Settings:

```
Lala:
  ListStyle:
    styles:
      ul:
        default:
          value: ''
          title: 'Default'
        circle:
          value: 'neos-list-circle'
          title: 'Circle'
        square:
          value: 'neos-list-square'
          title: 'Square'

        # To disable styles, set them to NULL
        # square: ~
      ol:
        default:
          value: ''
          title: 'Default'
        upper-roman:
          value: 'neos-list-upper-roman'
          title: 'Upper Roman'
        lower-alpha:
          value: 'neos-list-lower-alpha'
          title: 'Lower Alpha'
```

The `title` is used as the button label in the backend, the `value` will be the value of the `list-style-type` attribute of the list. Make sure to add styling for your custom list styles.

###  Health Score

27

—

LowBetter than 49% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity26

Limited adoption so far

Community12

Small or concentrated contributor base

Maturity41

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 73.5% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~88 days

Total

4

Last Release

1210d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/124704a0d41c6364ac5773df0c9bedc3a85f902f0826df5f12ff2a4b2a06d520?d=identicon)[paxuclus](/maintainers/paxuclus)

---

Top Contributors

[![paxuclus](https://avatars.githubusercontent.com/u/15905038?v=4)](https://github.com/paxuclus "paxuclus (25 commits)")[![PRGfx](https://avatars.githubusercontent.com/u/3868790?v=4)](https://github.com/PRGfx "PRGfx (6 commits)")[![hphoeksma](https://avatars.githubusercontent.com/u/250683?v=4)](https://github.com/hphoeksma "hphoeksma (3 commits)")

---

Tags

listneosneos-uilistNeosneos-uilist-style

### Embed Badge

![Health badge](/badges/lala-list-style/health.svg)

```
[![Health](https://phpackages.com/badges/lala-list-style/health.svg)](https://phpackages.com/packages/lala-list-style)
```

###  Alternatives

[phootwork/collection

The phootwork library fills gaps in the php language and provides better solutions than the existing ones php offers.

3924.8M15](/packages/phootwork-collection)[shel/neos-colorpicker

A plugin for Neos CMS which provides a colorpicker editor

1494.4k6](/packages/shel-neos-colorpicker)[shel/neos-hyphens

A plugin for Neos CMS which provides hyphens for the inline editor

20200.7k1](/packages/shel-neos-hyphens)[techdivision/ckstyles

Neos package which enables you adding your custom style classes for the CkEditor with a simple Yaml configuration

21166.3k](/packages/techdivision-ckstyles)[sandstorm/lazydatasource

Neos package implementing a lazy data source for the UI; so that the elements are loaded lazily on demand.

1044.5k4](/packages/sandstorm-lazydatasource)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
