# Post Template Block Style: Numbered Ranking

> Adds a "Numbered ranking" style to the Post Template block inside Query Loops, which puts a large 1, 2, 3... next to each post, for "Top 10" and "Most popular" lists.

- Type: PHP
- Runs: Run everywhere
- Category: [Block Editor](https://wpide.com/library/category/gutenberg/)
- Tags: block-styles, query-loop, ranking
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/block-style-post-template-ranking/

## Code

```php
add_action( 'init', function () {
    register_block_style( 'core/post-template', array(
        'name'         => 'wpide-ranking',
        'label'        => 'Numbered ranking',
        'inline_style' => '.wp-block-post-template.is-style-wpide-ranking{counter-reset:wpide-rank;}.wp-block-post-template.is-style-wpide-ranking>li{counter-increment:wpide-rank;position:relative;padding-left:3.5rem;}.wp-block-post-template.is-style-wpide-ranking>li::before{content:counter(wpide-rank);position:absolute;left:0;top:0;width:2.6rem;font-size:2.2rem;font-weight:800;line-height:1;text-align:center;opacity:.35;}',
    ) );
} );
```

## Notes

Select the Post Template block (inside the Query Loop) and choose the style. Works best with the List layout.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Post Template Block Style: Numbered Ranking" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
