Site & theme widget

Post Info

Author, date, categories, reading time and more, in a neat row with icons.

Build it with your AI

“Show the category, the date and the reading time above the post title.”

Live demo

See it working

This is the real widget, not a picture

The category and date line in each card is a Post Info widget inside a loop.

Settings

17 settings in three tabs

Every setting below is in the editor — and available to your AI through get_widget_schema.

Content

5 settings

Meta data

Items

Layout

Separator

Terms separator

Alignment

Design

12 settings

Items

Typography

Text color

Link color

Link hover color

Space between items

Separator color

Divider color

Icons & avatar

Icon color

Icon size

Icon spacing

Avatar size

Avatar radius

Behaviour

shared

On every element

Spacing & position

Background & border

Animations

Motion & effects

Scroll & mouse effects

Visibility

Conditions

Interactions

Attributes & CSS

Build it with AI

Just describe what you want

Your AI looks up the Post Info settings over MCP and writes the element for you — real, editable and on brand.

Claude · connected to your site

You

Show the category, the date and the reading time above the post title.

Claude · using Uncoder

Done — it’s on your site and fully editable.

  • Post Info added where you asked
  • Styled with your Design System
  • Checked on tablet and mobile
  • get_widget_schema
  • edit_elements
  • audit_page

What the AI writes

post-info.jsonJSON
{
  "type": "loop-grid",
  "settings": {
    "loop_template": "<Post card template id>",
    "columns": 3,
    "columns_tablet": 2,
    "columns_mobile": 1,
    "query": {
      "source": "posts",
      "post_type": "post",
      "posts_per_page": 3,
      "orderby": "date",
      "order": "desc",
      "terms": ["category:5", "category:6", "category:7"]
    },
    "column_gap": { "size": 16, "unit": "px" },
    "row_gap": { "size": 16, "unit": "px" }
  }
}

Free · GPL · No account

Your next site is one prompt away

Install Uncoder, connect your AI and describe what you want. Every page it builds stays yours to edit.