Configuring Item Page in Materia X2 Theme

Item Page (Single Item) is the main page for posts and static pages. The elements on the item page also vary; consists of Breadcrumb, Post Title, Post Description, Author Name and Profile Image, Publication and Update Date, Share Button, Comment Button, main content, etc.

You can customize it and adjust the elements to be displayed on the Item page easily.

Blog Post Configuration

There are several things that can be set on the item page. Here are some steps and their explanations:

1. Go to Blogger Dashboard, select the Layout menu.
2. Look for the section titled Main Section.
3. Click the edit button (pencil icon) on the Blog Posts (Blog Posts Gadget).
4. A Blog Posts Configuration Popup will appear.
5. Here are a few things that can be set:
   • You can skip Number of posts on main page and Post page link text settings as they are only useful on Index Pages.
   • You can skip the Show date header as this feature can't be used on the Materia X2 Theme.
   • The Show author setting is useful for displaying the Author name. If enabled, the Author format input will appear. You can fill it with text Written by, By or leave it blank.
   • The Show publish time setting is useful for displaying the post's publication date. If enabled, the Publish time prefix input will appear, you can fill it with text Published at, At or leave it blank. A dropdown for the date/time format will also appear, please select it according to your wishes.
   • The Show comment count setting is useful for displaying the number of comments (If there are comments) or text to add comments (If there are no comments). If enabled, the Comment format input will appear. Just skip it, because the input is not used.
   • The Show labels setting is useful for displaying post labels/category. If enabled, the Labels prefix input will appear, you can fill it with text Tags:, Labels: or leave it blank.
   • Just skip the Show email post link setting as it's not being used.
   • The Show share buttons setting is useful for displaying sharing buttons and share links to social media.
   • Just skip the Show location setting as it's not being used.
   • The Show author profile setting is useful for displaying post Author Profile.
   • The Show ads between posts setting is useful for displaying Ads. If enabled, Ad settings from AdSense like Number of posts between ads and Format will appear. Here are the options you can use:
     • Number of posts between ads - For the location of placing ads per post item. We recommend placing an ad in every half of the post that is displayed. For example, if the post item on the index page is set to 4, then you can set the Number of posts between ads to 2.
     • Format - To select the ad size. We recommend using Ad Units - Responsive.
6. If you want to finish the configuration, click the SAVE button at the bottom.

Customizer Settings

There are several Options and Color settings for all elements in the Item Page.

Options for Item Page

There are several Options for the Item Page that can be customized, namely:

Post Breadcrumb

This setting is useful for enabling or disabling breadcrumbs on post pages. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Breadcrumb (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Breadcrumbs will be disabled.
   • 2px: Enabled - Breadcrumbs will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Description

This setting is useful for enabling or disabling the Post Summary or Post Description on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Description (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Summary will be disabled.
   • 2px: Enabled - Post Summary will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Author Name

This setting is useful for enabling or disabling the Post Author Name on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Author Name (Disable | Name | Name and Prefix), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Author Name will be disabled.
   • 2px: Name - Post Author Name will be enabled.
   • 3px: Name and Prefix - Post Author Name will be enabled and Post Author Prefix will be displayed.
5. Click the Save button (diskette icon) in the lower right corner.

Post Author Image

This setting is useful for enabling or disabling the Post Author Image on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Author Image (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Author Image will be disabled.
   • 2px: Enable - Post Author Image will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Author Image Corner Radius

This setting is useful for setting the rounded corner radius for the Post Author Image. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Option named Post Author Image Corner Radius, drag the slider right or left until you find the corner radius you want.
5. Click the Save button (diskette icon) in the lower right corner.

Post Author Image Resolution

This setting is useful for adjusting the resolution of post author image. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Author Image Resolution (Low | Medium | High), drag the slider right or left. Here is the explanation:
   • 1px: Low - Low Resolution Post Author Image (Recommended).
   • 2px: Medium - Medium Resolution Post Author Image.
   • 3px: High - High Resolution Post Author Image.
5. Click the Save button (diskette icon) in the lower right corner.

Post Timestamp

This setting is useful for enabling or disabling the Published and Updated Timestamp on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Timestamp (Disable | Published | Published and Updated), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Published Timestamp will be disabled.
   • 2px: Published - Post Published Timestamp will be enabled.
   • 3px: Published and Updated - Post Published and Updated Timestamp will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Timestamp Prefix

This setting is useful for enabling or disabling the Timestamp Prefix on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Timestamp Prefix (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Timestamp Prefix will be disabled.
   • 2px: Enable - Post Timestamp Prefix will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Sharer

This setting is useful for enabling of disabling the post sharer on the post page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Sharer (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Share will be disabled.
   • 2px: Enable - Post Share will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Label List

This setting is useful to enable or disable Label List on post page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Label List (Disable | Enable | Enable with Prefix), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Label List will be disabled.
   • 2px: Enable - Label List will be enabled.
   • 3px: Enable with Prefix - Label List will be enabled with Prefix.
5. Click the Save button (diskette icon) in the lower right corner.

Post About Author

This setting is useful to enable or disable About Post Author on post page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post About Author (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - About Author will be disabled.
   • 2px: Enable - About Author will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post About Author Image

This setting is useful to enable or disable About Post Author Image on post page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post About Author Image (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - About Author Image will be disabled.
   • 2px: Enable - About Author Image will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post About Author Image Corner Radius

This setting is useful for providing rounded corners on each side of the Post About Author Image on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Option named Post About Author Image Corner Radius, drag the slider right or left until you find the corner radius you want.
5. Click the Save button (diskette icon) in the lower right corner.

Post About Author Description

This setting is useful to enable or disable About Post Author Description on post page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post About Author Description (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - About Author Description will be disabled.
   • 2px: Enable - About Author Description will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment

This setting is useful to enable or disable Post Comment on item page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Comment will be disabled.
   • 2px: Enable - Post Comment will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Style

This setting is useful to set the Post Comment Style on item page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Style (Default | Modal), drag the slider right or left. Here is the explanation:
   • 1px: Default - Post Comment Style will be default (Standard).
   • 2px: Modal - Post Comment Style will be Modal.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Modal Open Button Style

This setting is useful for enabling or disabling the button to open the Comments Modal (Join the Conversation Button). Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Modal Open Button Style (Default | Raised | Unelevated | Outline), drag the slider right or left. Here is the explanation:
   • 1px: Default - Default Post Comment Modal Open Button.
   • 2px: Raised - Normal Post Comment Modal Open Button with shadow.
   • 3px: Unelevated - Normal Post Comment Modal Open Button without shadow.
   • 4px: Outline - Outlined Post Modal Open Comment Button.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Dots

This setting is useful for enabling or disabling the number of comments with the Notification Dot style on the Comments Button. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Dots (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Comment Dots will be disable.
   • 2px: Enable - Post Comment Dots will be enable.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Sort

This setting is useful for enabling or disabling the Post Comments sort button. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Sort (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Comment Sort will be disable.
   • 2px: Enable - Post Comment Sort will be enable.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Messages

This setting is useful for enabling or disabling the Post Comments Messages. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Messages (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Comment Messages will be disable.
   • 2px: Enable - Post Comment Messages will be enable.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Shadow Thickness

This setting is useful for adjusting the thickness of the Shadow on the Post Commment Items. Shadow thickness is measured in dp units.

There are three options that you can choose from, including 2dp (Thin), 4dp (Medium) and 6dp (Thick). Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Shadow Thickness (Thin | Medium | Thick), drag the slider right or left. Here is the explanation:
   • 1px: Thin - Post Comment with Shadow Thickness 2dp (Thin).
   • 2px: Medium - Post Comment with Shadow Thickness 4dp (Thin).
   • 3px: Thick - Post Comment with Shadow Thickness 6dp (Thin).
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Author Link

This setting is useful for enabling or disabling Blogger Profile Links in Commenters. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Author Link (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Comment Author Link will be disable.
   • 2px: Enable - Post Comment Author Link will be enable.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Author Image

This setting is useful to enable or disable Post Comment Author Image on item page. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Author Image (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Comment Author Image will be disabled.
   • 2px: Enable - Comment Author Image will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Author Image Corner Radius

This setting is useful for setting the rounded corner radius for the Post Author Image. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Option named Post Comment Author Image Corner Radius, drag the slider right or left until you find the corner radius you want.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Timestamp

This setting is useful for enabling or disabling the Comment Published and Updated Timestamp on the post page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Timestamp (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Comment Published Timestamp will be disabled.
   • 2px: Enable - Comment Published Timestamp will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Comment Button Style

This setting is useful for changing the appearance of the comment button. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Comment Button Style (Default | Raised | Unelevated | Outline), drag the slider right or left. Here is the explanation:
   1. 1px: Default - Default Post Comment Button.
   2. 2px: Raised - Normal Post Comment Button with shadow.
   3. 3px: Unelevated - Normal Post Comment Button without shadow.
   4. 4px: Outline - Outlined Post Comment Button.
5. Click the Save button (diskette icon) in the lower right corner.

Post Next - Previous Button

This setting is useful for enabling or disabling the pagination button (Next/Previous) on the Posts page. Here are some steps to customize and some explanations:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Next - Previous Button (Disable | Enable), drag the slider right or left. Here is the explanation:
   • 1px: Disable - Post Pagination will be disabled.
   • 2px: Enable - Post Pagination will be enabled.
5. Click the Save button (diskette icon) in the lower right corner.

Post Next - Previous Button Style

This setting is useful for changing the appearance of the post pagination button. Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Look for the Slider setting named Post Next - Previous Button Style (Default | Raised | Unelevated | Outline), drag the slider right or left. Here is the explanation:
   1. 1px: Default- Default Post Pagination Button.
   2. 2px: Raised- Normal Post Pagination Button with shadow.
   3. 3px: Unelevated- Normal Post Pagination Button without shadow.
   4. 4px: Outline- Outlined Post Pagination Button.
5. Click the Save button (diskette icon) in the lower right corner.

Post FAB Position

This setting is useful for changing the position of the Floating Action Button (FAB) especially on Index pages. If you want to customize it, you can follow these steps:

1. Go to Blogger Dashboard and select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Index Options.
4. Look for the Slider setting named Posts FAB Position (Left | Center | Right), drag the slider right or left. Here is the explanation:
   • 1px: Left - The FAB position will moved to the left side (In RTL mode, it will moved to the right side).
   • 2px: Center - The FAB position will moved to the center of screen.
   • 3px: Right - The FAB position will moved to the right side (In RTL mode, it will moved to the left side).
5. Click the Save button (diskette icon) in the lower right corner.

Color Settings for Item Page

There are several color settings for the Item Page that can be customized, namely:

• Post Breadcrumb Color - To set Post Breadcrumb color.
• Post Breadcrumb Hover Color - To set Post Breadcrumb Hover color.
• Post Title Color - To set Post title color.
• Post Description Color - To set Post summary or post description Color.
• Post Key Color - To set Post Key Color.
• Post Meta Color - To set Post Meta color (Author Name, Publish and Update Date, Comment Button and Share Button).
• Post Link Color - To set Post Link color.
• Post Border Color - To set Post Border color.
• Post Text Color - To set Post Text color (Main content).
• Post Label List Text Color - To set Post Label List color.
• Post Label List Border Color - To set Post Label List Border color.
• Post Label List Hover Color - To set Post Label List Hover color.
• Post About Author Border Color - To set Post About Author Border color.
• Post About Author Name Color - To set Post About Author Name color.
• Post About Author Description Color - To set Post About Author Description color.
• Post Comment Message Color - To set Post Comment Message color.
• Post Comment Background Color - To set Post Comment Background color.
• Post Comment Shadow Color - To set Post Comment Shadow color.
• Post Comment Border Color - To set Post Comment Border color.
• Post Comment Author Name Color - To set Post Comment Author Name color.
• Post Comment Author Name Hover Color - To set Post Comment Author Name color when hovered.
• Post Comment Meta Color - To set Post Comment Meta color.
• Post Comment Content Color - To set Post Comment Content color.
• Post Comment Content Link Color - To set Post Comment Content Link color.
• Post Comment Button Color - To set Post Comment Button color.

Here are some steps to customize it:

1. Go to Blogger Dashboard, select the Theme menu.
2. Click the CUSTOMIZE button.
3. Click Advanced Dropdown, click Default Options Dropdown and Select Item Options.
4. Find a color setting and select the color you want to change.
5. Click the Save button (diskette icon) in the lower right corner.

Those are some steps to configure the Item Pages (Single Items) in the Materia X2 Theme. If you have any questions, please write them in the comments section below.

If you want to report some bugs, you can write them in the comments section on the Bug Report page and if you want to request new features or want to provide feedback, please write them in the comments section on the Request and Feedback page.