10Web Help Center

Hi, how can we help?

Post Info

Copy article URL

in this article

Display metadata dynamically using the Post Info widget in the 10Web Builder. 

1.png

The Content Tab

Meta Data

Copy, delete, reorganize, and edit all the metadata you wish to display on your post info block.  Click the Copy button to duplicate an item. 

2.png

Click the X to delete an item.

3.png

Click Add Item button to add a new item.

4.png

Drag and drop before or after other items to customize the order or the items.

5.png

Click on an item to start editing. 

Type: Choose the type of metadata.

6.png

Author

Before: Fill in text to display before the metadata. 

Avatar: Option to set the author's avatar by setting the toggle to yes. 

Link: Link to the author’s archive by setting the toggle to yes. 

Icon: From the drop down menu set an icon to default, none, or custom.

Date

Date Format: Select the format in which to display the date or choose to custom create your own format. 

Before: Fill in text to display before the metadata. 

Link: Link to the date’s archive by setting the toggle to yes. 

Icon: From the drop down menu set an icon to default, none, or custom.

Time

Time Format: Select the format in which to display the time or choose to custom create your own. 

Before: Fill in text to display before the metadata. 

Icon: From the drop down menu set an icon to default, none, or custom.

Comments

Before: Fill in text to display before the metadata. 

Custom Format: Set the toggle to yes to customize the phrasing for comments. 

Link: Link to the comments archive by setting the toggle to yes. 

Icon: From the drop down menu set an icon to default, none, or custom.

The Style Tab

List

Space Between: Set the distance between the metadata. 

Alignment: Align metadata to the right, center, or left.

Divider: Choose to set dividers between metadata by clicking the toggle on. 

Divider Options

Style: Choose the look of the divider.

Weight: Set the thickness of the divider. 

Height: Set the height of the divider.

Color: Customize the color of the divider. 

Icon

Color: Customize the color of metadata icons.

Size: Set the size of the metadata icons. 

Text

Text Indent: Set the spacing of the text relative to it’s icon. 

Text Color: Customize the color of the text. 

Typography: Customize typographical settings of the text.

The Advanced Tab

In the advanced tab adjust the padding, apply Z-index to your elements, set conditions, motion effects, responsiveness, and more.

Next Up: Post Navigation

in this article