Skip to content
Villyit
Villyit
  • Helpdesk
    • Veynix
  • Contact
  • Theme Support

Kicks getting started

1
  • Getting Started

Kicks general settings

11
  • Badges
  • Breadcrumb
  • Button
  • Colors
  • Currency Format
  • Layout
  • Logo
  • Product
  • Search
  • Social Media
  • Typography

Kicks header

2
  • Announcement Bar
  • Header

Kicks popups

1
  • Newsletter Popup

Kicks footer

1
  • Footer

Kicks blocks

13
  • Brand avatar badge
  • Breadcrumbs
  • Button
  • Column
  • Countdown
  • Group
  • Heading
  • Image
  • Rating
  • Rich text
  • Slide
  • Subheading
  • Text

Kicks Blogs Articles

4
  • Article
  • Blog post
  • Main blog
  • Related post

Kicks Cart

2
  • Cart Drawer
  • Main Cart

Kicks Collections

4
  • Collection list
  • Main Collection Banner
  • Main Collection List
  • Main Collection

Kicks Pages

4
  • Main 404
  • Main page
  • Main password
  • Main search

Kicks Product

6
  • Featured Product
  • Main product
  • Product Bundle
  • Related Product
  • Product Recommendations
  • Recently Viewed Product

Kicks Sections

25
  • Banner
  • Before After Image
  • Brand story
  • Client logo
  • Contact form
  • Contact information
  • Countdown
  • FAQ
  • Featured collection
  • Hero image
  • Image gallery
  • Image showcase
  • Image with features
  • Image with text
  • Interactive showcase
  • Multicolumn
  • Newsletter
  • Our story
  • Promotional image
  • Rich text
  • Shoppable Videos
  • Shop the look
  • Slideshow
  • Testimonials
  • Video
View Categories
  • Home
  • Helpdesk
  • Kicks
  • Kicks blocks
  • Brand avatar badge

Brand avatar badge

1 min read

The block renders one clickable badge made of two parts, side by side (or stacked, depending on text alignment):

  1. An avatar stack — up to five images, each cropped into an 80×80 circle and layered so they overlap slightly, like a stack of profile photos or brand logo bubbles.
  2. A text label next to the stack (defaults to “10+ BRANDS”).

The whole thing — stack and text together — is one <a> link, so clicking anywhere on the badge (the images or the text) follows the same URL. This makes it a compact, glanceable trust/social-proof element rather than a bio callout: think “as stocked by these 10+ brands” or “over 500 five-star reviews” sitting next to a heading, rather than a founder photo with a name underneath.

  • Link: Where the entire badge (images + text) links to when clicked — e.g. a brands/partners page, a reviews page, or an about/press page.
  • Button text: The label shown beside the avatar stack. This is also used as the link’s accessible name for screen readers (see Accessibility below), so it should always describe what the badge represents, not just decorative copy.
  • Brand image: Up to five individual images, each rendered as one circle in the stack. You don’t need to fill all five — the block only renders however many you provide (see “Partial and empty states” below).
  • Text align: Controls the alignment of the whole badge (avatar stack + text together) within its container — this is a layout/alignment setting for the block as a whole, not independent alignment of the text versus the images.
Updated on September 8, 2026
Share This Article :
  • Facebook
  • X
  • LinkedIn
  • Pinterest
© 2026 Villyit . All Rights Reserved.