Skip to content

How To Use

Editor View

After adding the Advanced Post Block, select the block, and you will see the settings in the sidebar. How sidebar settings will appear for a block.

Advanced Post Block- Sidebar Settings
Advanced Post Block- Sidebar Settings

There are three tabs to configure the Advanced Post BlockGeneral, Elements, and Style. Before check this tab, let’s explore the Template Library

Template Library

The Templates Library gives you ready-made, professionally designed post layouts that you can import into your page with a single click — a much faster starting point than configuring a block from scratch.

Opening the Library

  • Open any post or page in the block editor.
  • Click the Template Library button in the editor’s top toolbar.
  • The Templates Library modal opens, showing all templates available for Advanced Post Block. A tab bar at the top switches between Patterns and your Favorites.

Browsing & Filtering Templates

The left sidebar holds all the filters, and they work together (category + access + search combine):

  • Categories: Browse templates by layout type (Grid, List, Magazine, Masonry, Overlay, and more). Each category shows a live count of how many templates it contains, and the count reflects the active Free/Pro filter.
  • Free / Pro filter: Use the AllFree, and Pro toggles at the top of the sidebar to show only the templates available in your plan. Counts everywhere update to match.
  • Search: Type in the search box to find templates by title, category, or keyword — for example, searching “magazine” finds every template titled, categorized, or tagged with it.
  • Load More: When more templates match than are shown, a Load More button appears at the bottom of the gallery to fetch the next set. The Favorites tab shows everything at once, so it has no Load More.

Previewing a Template

Each card has a live preview of the template:

  • Hover over a card — if the layout is taller than the card, the preview smoothly scrolls to the bottom so you can see the whole design without leaving the modal.
  • Hovering also reveals two controls in the top-right corner: a Preview button and a heart (Favorite) toggle.
  • When a live demo exists, click the Preview button — or the template’s title — to open its demo page in a new tab.

Importing a Template

  • Each card shows its title on the left and an Import button on the right.
  • Click Import — the template’s blocks will be added straight into your page, and the modal closes automatically.
  • The imported blocks are regular Advanced Post Block layouts: select them and customize the query, elements, and styles like any other block.

Favorites

Save the templates you use most so they’re one click away:

  • Click the heart icon in the top-right of any card to favorite it; click again to remove it. A filled red heart means it’s saved.
  • Open the Favorites tab to see everything you’ve favorited in one place. You can search and filter favorites by category just like the main gallery.
  • Favorites are stored per site (in your WordPress database), so they persist across sessions and are shared with everyone editing on that site.

General Settings

The General tab is where you control the layout type, post query, and any layout-specific options.

Layout

The layout button group at the top of the General tab lets you switch between all available display styles at any time. Watch every layout switch update the editor canvas live:

Grid arranges posts in a clean, responsive column-based grid. It’s the default layout and works well for most use cases.

Grid 1 is an alternative grid style with a unique hero-style arrangement of posts — great for editorial and magazine-style listing pages.

Masonry creates a Pinterest-style flowing layout where posts fill vertical gaps naturally. Card heights vary based on content, so no two rows look exactly alike.

Slider converts your posts into a full-featured carousel. Navigation arrows and pagination dots are included. When this layout is active, a dedicated Slider Options section appears below in the sidebar.

Ticker displays posts as a continuously scrolling list — ideal for “Latest Posts” sidebars or announcement strips. When Ticker is active, a dedicated Ticker Options section appears.

News Ticker shows posts in a styled headline ticker strip, similar to news broadcast lower-thirds. Activating this layout adds a News Ticker Options section to the sidebar.

Magazine 1 features a full-width hero post at the top with a scrollable list of additional posts in a sidebar column. An additional First Post Min Height control appears to set the hero image height responsively across desktop, tablet, and mobile.

Magazine 2 has the same hero post treatment but stacks remaining posts in a grid below it, rather than a sidebar. It also includes the First Post Min Height control.

Accordion turns each post into a collapsible panel that opens on click — ideal for FAQs, documentation, and long lists where you want the titles scannable and the bodies out of the way until they are needed. Selecting it adds an Accordion Options section to the General tab and a matching panel to the Style tab.

Timeline lays the posts out as a dated sequence along a connector line, which makes it a natural fit for milestones, release notes, changelogs, and company history. It runs top-to-bottom or as a horizontal scrolling track, and adds Timeline Options sections to both the General and the Style tab.

Switching layouts is non-destructive — your query settings and element visibility are preserved when you switch between layouts.

Sub Layout

The Sub Layout dropdown controls how each individual post card is structured internally — specifically the relationship between the thumbnail and the text content.

Default stacks the thumbnail above the text content in a standard card format.

Title Meta similar to the Default layout, but restricts content display to only the title and metadata, creating a more focused textual area.

Left Image places the thumbnail to the left of the text content. Well-suited for list-style layouts or narrow content areas.

Right Image mirrors the Left Image layout, placing the thumbnail on the right side.

Left Even Odd alternates the position of thumbnails — left on odd rows, right on even rows — for a more dynamic, editorial feel across a post listing.

Right Even Odd is the reverse of Left Even Odd — thumbnails start on the right and alternate.

Overlay Content overlays all enabled content (title, meta, excerpt, read more) directly on the post image.

Overlay Content Hover overlays all content on the image, but only reveals it when the user hovers over the card, creating an interactive, clean initial view.

Overlay Box overlays a centered content box containing the title and metadata on top of the image. This layout omits the excerpt and read more button for a more minimalist presentation compared to the “Content Box” version.

Overlay Content Box overlays all content (title, meta, excerpt, read more) on top of the thumbnail image inside a semi-transparent box. Useful for hero-style cards.

Overlay Half Content places a content box over only the bottom half of the image, leaving the top of the image visible. Good for cards where you want both the image and text prominent.

Some settings in the Elements and Style tabs may adjust automatically when you switch Sub Layouts to match the new structure.

For Magazine layouts, a second sub-layout dropdown controls the style of the sidebar list items independently from the hero post.

Columns & Spacing

Columns sets how many post cards appear in each row. Click the device icons (desktop, tablet, mobile) to set different column counts per device — for example, 3 columns on desktop, 2 on tablet, and 1 on mobile.

Column Gap controls the horizontal space between cards in the same row, measured in pixels.

Row Gap controls the vertical space between rows of cards, measured in pixels.

Post Equal Height forces all cards in a row to be the same height, regardless of content length. This keeps your grid looking uniform when post content varies in length. Available in Grid and Grid 1 layouts.

Slider Min Height sets a minimum height for the slider container when in Slider layout. Use this to ensure the slider doesn’t collapse when images are missing.

Content/Texts Height controls how the text area inside each card grows. Set to Auto to let it grow naturally with content, or Fill Available Space to stretch the text area to fill the card — particularly useful when using the Read More button pinned to the bottom of a card.

First Post Min Height(Magazine 1 & 2 only) — Sets the minimum height for the large hero post at the top. You can set different values for Desktop, Tablet, and Mobile using the device switcher.

Posts Query

The Posts Query section controls which posts appear in the block.

Post Type lets you choose between Posts, Pages, or any Custom Post Type registered on your site. Custom post types must have show_in_rest: true set during registration to appear in this list.

Query Preset applies a pre-built query configuration with a single click. Presets include Popular (ordered by view count), Random (different posts each page load), Sticky (only sticky posts), and Related (posts related to the one currently being viewed). Selecting a preset overrides any manual query settings below it.

Taxonomy Relation determines how multiple taxonomy filters interact. Set to AND to show only posts that match all selected filters; set to OR to show posts matching any one of the filters.

Select Categories is a token-based search field where you can type the start of a category name and select from matching suggestions. Add as many categories as needed to filter by multiple at once.

Select Tags works the same way as Select Categories, but filters by post tags instead.

Select Taxonomies appears for non-standard post types. It lists all available custom taxonomies with individual token fields for each. Enable a taxonomy and then search for specific terms to filter by.

Select Authors filters posts to only those written by specific authors. Type an author’s name or username and select from suggestions.

Post Per Page is a slider control that sets how many posts to display. Set it to -1 to show all matching posts with no limit — though this disables pagination.

Post Order By changes how posts are sorted. Options include Date, Modified Date, Title (alphabetical), Menu Order, Random, Post ID, Name/Slug, Comment Count, and Post In (follows the exact Include Posts list order).

Post Order sets the sort direction to Ascending or Descending.

Search Query filters results to only posts matching a specific search term — equivalent to running a WordPress site search.

Post Offset skips the first N posts in the results. For example, setting it to 2 skips the two most recent posts. This is useful for building “more posts” sections beneath a separately displayed featured post. Note: Offset does not work when Post Per Page is -1.

Include Posts takes a comma-separated list of post IDs to specifically include (e.g. 14,25,36). Combined with Order By: Post In, posts appear in exactly that order.

Exclude Posts takes a comma-separated list of post IDs to exclude from results entirely.

Exclude Current Post automatically removes the post currently being viewed from query results. This prevents duplication when using the block inside single post templates.

Exclude Sticky Posts removes sticky posts from the query results. By default, WordPress includes sticky posts, regardless of other query settings.

Load More & Pagination

This panel is available for Grid, Grid 1, and Masonry layouts when Post Per Page is not set to -1.

Type selects the pagination style. Choose from:

  • None — The block shows the first page of results only, with no way to navigate.
  • Pagination — Shows numbered page links below the post grid. Readers can click any page number to jump to it.
  • Navigation — Shows simple Previous and Next buttons to step through pages one at a time.
  • Infinity Scroll — New posts load automatically as the reader scrolls down the page.
  • Load More Button — Shows a button below the grid that loads the next batch of posts when clicked.

Alignment positions the pagination control to the left, center, or right.

Back to Top on Change (Pagination and Navigation only) — Scrolls the page back up to the top of the block whenever the reader navigates to a new page. The Top Offset sub-setting lets you set exactly how far from the top to land (in pixels).

Previous Label / Next Label (Pagination and Navigation only) — Customizes the text shown on the previous and next navigation buttons.

Trigger Offset (Infinity Scroll only) — The distance from the bottom of the page at which new posts begin loading. A positive number loads posts earlier (before the reader reaches the bottom); a negative number delays loading until they’ve scrolled past the bottom edge.

Show Spinner (Infinity Scroll only) — Displays a loading animation while the next set of posts is being fetched.

Loading Label (Infinity Scroll only) — Text shown alongside the spinner. Leave empty to show only the spinner icon.

Button Label (Load More Button only) — The text displayed on the load more button. Default is “Load More”.

Colors sets the text and background colors for pagination buttons.

Active/Hover Colors sets the colors applied when a button is active (current page) or hovered.

Padding controls the internal spacing inside each pagination button.

Space Between sets the gap between individual pagination buttons or page number links.

Slider Options

This panel appears only when the Slider layout is selected.

Enable Loop makes the slider wrap around infinitely — after the last slide, it returns to the first without jumping.

Enable Touch Move allows readers to swipe through slides on touchscreen devices.

Enable Autoplay turns on automatic slide advancement. When enabled, an Autoplay Delay slider appears to control the pause between slides (in seconds).

Speed controls how long the transition animation between slides takes to complete, measured in seconds. A smaller value means faster transitions.

Effect changes the slide transition animation. Choose from Slide, Fade, Cube, Coverflow, Flip, and Creative. Note: Fade and other single-slide effects only work correctly when Columns is set to 1.

Pagination section:

  • Show Pagination toggles the dot/bullet navigation indicators at the bottom of the slider.
  • Enable Pagination Clickable makes the dots clickable so readers can jump to any slide directly.
  • Enable Pagination Dynamic Bullets makes the active bullet larger than the others, giving a visual indicator of progress.

Preview Next Button section:

  • Show Preview Next Button toggles visibility of the previous and next navigation arrows.

Ticker Options

This panel appears only when the Ticker layout is selected.

Direction controls which way the ticker scrolls. Up scrolls posts upward (default); Down scrolls posts downward.

Speed controls how fast posts scroll. You can use word values like slow, medium, or fast, or enter a specific time in milliseconds for precise control.

Interval sets the pause duration between each post transition, in milliseconds. For example, 2000 means posts stay visible for 2 seconds before transitioning.

Height sets a fixed height for the ticker container in pixels. Set it to 0 to use automatic height based on content size.

Post Visible determines how many posts are visible at once when height is set to 0. Set to 0 to show all posts simultaneously.

Ticker Mouse Pause pauses the scrolling animation whenever a reader hovers over the ticker, giving them time to read a headline without it moving away.

News Ticker Options

This panel appears only when the News Ticker layout is selected.

Label sets the text of the prefix badge that appears before the ticker content — typically something like “Trending Now” or “Breaking News”.

Theme selects the visual color theme for the ticker strip, controlling the background and label accent colors.

Type defines the ticker’s animation behavior:

  • Vertical scrolls posts up or down one at a time.
  • Horizontal slides posts left or right one at a time.
  • Marquee continuously scrolls all posts in a seamless loop, like a classic news crawl.
  • Typewriter reveals each post title letter by letter.

Direction controls which direction the ticker moves — Up or Down for Vertical type, Left or Right for Horizontal and Marquee types.

Speed (ms) controls how long the transition between posts takes, in milliseconds. Lower values mean faster transitions.

Animation applies a transition effect when moving between posts. Choose from Slide, Fade In, or Fade Out. This option is not available for Marquee and Typewriter types, which use their own continuous animation.

Pause on Hover stops the ticker animation when the reader moves their cursor over it, allowing them to comfortably read the current headline.

Accordion Options

This panel appears only when the Accordion layout is selected.

Max Width caps the width of the whole accordion and centres it on the page. Leave it empty for full width — useful when the accordion sits inside a wide container but you want the panels to stay a comfortable reading width.

Theme picks a preset accordion design. Colors, border, background, shadow and typography all stay driven by the standard controls, so a theme only changes the structure:

  • Classic — a single dividing line under each item, no card chrome.
  • Card Stack — every item is its own rounded, bordered card with a gap between them.
  • With Thumbnail — shows each post’s featured image in the header, beside the title.
  • Numbered FAQ — prefixes each header with a running number, for question lists.
  • Split Panel — a wider, two-column feel with the header separated from the body.
  • Minimal Lines — a hairline rule above each item and no other chrome.

Thumbnail Size (With Thumbnail theme only) sets both the width and the height of the header thumbnail. Changing it also re-indents the body copy so it stays aligned under the title rather than under the image.

Open Mode decides how many panels can be open at once. Single closes the previous panel whenever a new one is opened; Multiple lets readers keep several open at the same time.

Open First Item By Default expands the first post when the page loads, so the accordion never starts fully collapsed.

Show Expand Icon toggles the open/close indicator in each header. Turning it off leaves the header text as the only affordance.

Icon Position places that indicator on the Left or the Right of the header.

Indicator Icon chooses the icon pair used for the indicator. The first icon shows while the panel is open and the second while it is closed — Plus/Minus, Arrow, Long Arrow, Sort, Chevron, Circle Chevron, Caret, Angle, and more.

Animation Speed (ms) sets how long a panel takes to expand or collapse, from 100 ms to 1000 ms. Lower is snappier.

The panel body’s background comes from Content Background, each item’s border and shadow from the Article panel, and the body padding from Content Padding — the open state reuses Hover Border. Header-specific styling lives in the Style tab’s Accordion Options panel.

Timeline Options

This panel appears only when the Timeline layout is selected.

Max Width caps the width of the timeline and centres it. Leave it empty for full width.

Direction is the top-level choice. Vertical stacks the milestones down a rail; Horizontal lays them along a track that scrolls sideways, which suits a compact “our story” strip.

Orientation decides which side of the line the posts sit on. Vertical reads as left/right, horizontal as above/below:

  • Start Side keeps every post on the starting side of the line.
  • End Side keeps every post on the far side.
  • Even-Odd alternates them, starting with the first post on the starting side.
  • Odd-Even alternates the other way round, starting on the far side.

Group By (Vertical only) breaks the run into Year or Month sections, each with its own heading. Consecutive posts that share a period are grouped together, and the query order is never changed — so it works best with posts ordered by date.

Date Position decides where each post’s date is printed:

  • Inline (With Meta) leaves it in the meta row inside the card, styled by the Meta Data panel.
  • Gutter lifts it out of the card and sets it across the line from the post, next to its own marker.
  • Badge does the same but draws it as a pill with its own background.

The date is never printed twice — choosing Gutter or Badge removes it from the meta row automatically.

Dot Style is how each marker is drawn on the line: FilledOutline, or Ring.

Dot Position moves the marker along its own post, so it can line up with the title or sit further down a tall card. Vertical reads as Start (the first line of text), Center, and End (the bottom); horizontal reads as left, middle, and right. The connector line keeps its full length whichever you choose, and a Gutter or Badge date travels with the marker.

Dot Size sets the marker’s diameter. The gutter beside the card widens with it, so a large dot never crowds the content.

Line Width sets the thickness of the connector line.

The cards themselves are ordinary post cards: Sub Layout shapes them, Content Background fills them, the Article panel draws their border and shadow, and Content Padding sets their padding. Item spacing uses Gap in the Layout panel. Line, dot, date, and heading colors live in the Style tab’s Timeline Options panel.

Elements Settings

The Elements tab controls which pieces of post content are shown inside each card, and how they behave. Select the Elements tab. Then you will see the following options.

Reordering Elements

The Sort Element control allows you to change the vertical order of the title, metadata, and excerpt within your post cards. This is useful for creating unique layouts, such as placing the publication date or author name above the headline or below the excerpt.

Feature Image

Show Feature Image is the main toggle for the post thumbnail. Turn it off to hide images entirely and display text-only cards.

Enable Link makes the feature image a clickable link to the full post. This is separate from the title link and can be used together with it. This option is hidden when an Overlay sub-layout is active.

Size selects the image size to use. Options include Thumbnail, Medium, Large, Full Size, and any custom sizes registered by your theme or other plugins. Smaller sizes load faster; Full Size gives the best visual quality.

Width sets a custom width for the post image. Accepts values in px, %, or em. This option is hidden when an Overlay sub-layout is active.

Height sets a custom height for the post image. Accepts values in px, %, or em. For specific aspect ratios, set the height to a percentage value: 100% (1:1), 56.25% (16:9), 75% (4:3), 66.67% (3:2), or 42.85% (21:9). This option is hidden when an Overlay sub-layout is active.

Fitting controls how images fill their container. Cover stretches and crops the image to fill the space completely. Contain fits the whole image within the container without cropping, which may leave empty space around the image.

Lazy Load enables native lazy loading for the feature images. When turned on, images are only loaded as the reader scrolls them into view, improving page load performance.

Default Image lets you set a placeholder image URL that is shown when a post doesn’t have a featured image assigned. Upload an image or paste a URL directly.

Title

Show Title toggles the post title on or off. Hiding the title is useful for image-only or teaser card designs.

Enable Title Link wraps the title text in an anchor tag linking to the full post. When disabled, the title is plain text only.

Title Tag selects the HTML tag used for the post title. Options include H1 through H6, div, span, and p. Choosing the right heading level helps maintain proper heading hierarchy for accessibility and SEO.

Title Limit restricts how much of the title text is displayed:

  • Limit Type chooses the unit of measurement — Word truncates by word count, Character truncates by character count.
  • Limit Value sets the maximum number of words or characters to show. Values range from 1 to 500.
  • Show Ellipsis appends ... to the end of a truncated title, signaling that the full title is longer.

Meta Data

The Meta Data panel is divided into several sub-sections, each in its own collapsible panel and independently configurable.

Separator sets a custom character to display between meta data items (e.g., |·-). Leave empty for no separator.

Gap controls the spacing between individual meta data items. Accepts values in px, em, or rem.

Sort Meta Data allows you to change the display order of meta data items by dragging and dropping. All enabled meta items — Author, Date, Category, Reading Time, Comment, View Count, and any custom taxonomies — can be rearranged to match your preferred order.

Author

Show Author displays the post author name below the title. When enabled:

  • Author Link wraps the author name in a link to the author’s post archive page.
  • Author Icon lets you upload a custom icon image to replace the default author icon.

Date

Show Date displays the post publication date. When enabled:

  • Date as Time Ago shows the date in a relative format (e.g., “2 hours ago”, “3 days ago”) instead of an absolute date string.
  • Date Format lets you choose how the date is displayed when Date as Time Ago is disabled. Choose from preset formats or enter a custom PHP date format string — for example M j, Y produces “Apr 5, 2026”.
  • Date Icon lets you upload a custom icon image for the date field.

Category

Show Category displays the category or categories assigned to the post. When enabled:

  • Category Position controls where categories appear. With Meta places category badges inside the metadata row; On Image places them overlaid on top of the feature image; Above Content places them as a standalone row above the post content area.
  • On Image Position (visible when Category Position is set to “On Image”) — Selects the corner of the image where category badges are placed. Options are Top Left, Top Right, Bottom Right, and Bottom Left.
  • Category Icon lets you upload a custom icon to display alongside the category name. Only visible when Category Position is set to With Meta.

Taxonomies

For custom post types or posts that include additional taxonomies (for example, tags or custom taxonomies), each available taxonomy is shown as its own toggle. Enable a taxonomy to display it in the metadata row, and optionally upload a custom icon for it.

Reading Time

Show Reading Time displays an estimated reading time, calculated from the post body content. When enabled:

  • Show Reading Time Seconds adds seconds to the display (e.g., “3 min 24 sec” instead of “3 min”).
  • Reading Time Label customizes the text shown after the number (e.g., “min read”, “minute read”).
  • Reading Time Icon lets you upload a custom icon for the reading time field.

Reading time is only shown on posts that have actual body content.

Comment

Show Comment displays the number of comments on the post. The comment count is only shown when comments are open and enabled for a post.

  • Comment Icon lets you upload a custom icon for the comment count.

View Count

Show View Count displays the total number of views for each post. When enabled:

  • View Icon lets you upload a custom icon for the view count field.

Excerpt

Show Excerpt toggles the post excerpt. When off, no teaser text appears below the title/meta.

Excerpt From selects the source of the excerpt text. Excerpt pulls from the manual excerpt field; Content pulls from the post body; SEO Meta pulls from the meta description set by a supported SEO plugin (currently supports Yoast SEO, Rank Math, and All in One SEO).

Excerpt Length is a slider that controls how many words of the excerpt to show. Set to -1 to show the full excerpt, content, or SEO meta without truncation. The default is typically 20–30 words.

Show Ellipsis appends ... to the end of a truncated excerpt, signaling to readers that there’s more content to read.

Read More

Show Read More toggles the call-to-action button that links to the full post.

Position controls where the button appears relative to other card content. Inline places it directly after the excerpt text. Bottom anchors the button to the very bottom of the card — for this to work reliably, set Content/Texts Height to “Fill Available Space” in the General settings.

Read More Label is the button’s visible text. Change it to anything you like — “Learn More”, “Continue Reading”, “View Post”, etc.

Open link in new tab opens the post URL in a new browser tab instead of navigating in the current tab.

Select Icon lets you pick an icon to display alongside the button label. Choose from built-in arrow and chevron icons, or select the custom option to upload your own.

Upload Icon (visible when the custom icon option is selected) — Lets you upload a custom icon image or paste a URL for the Read More button icon.

Icon Gap controls the spacing between the icon and the button label text. Accepts values in px, em, or rem.

Icon Position places the icon to the Left or Right of the button label text.

Style

The Style tab controls the visual appearance of every element — typography, colors, spacing, and borders. Most style panels are only visible when the corresponding element is enabled in the Elements tab.

Article Style

These settings apply to the outer card wrapper. A Normal / Hover tab switcher lets you configure different looks for the default state and the hover state.

Normal tab:

  • Border opens the border editor where you can set the border style (solid, dashed, dotted), width, color, and corner radius (border-radius) for rounded corners.
  • Shadow adds a box shadow to the card.

Hover tab:

  • Hover Border sets the border style, width, color, and corner radius when a reader hovers over the card.
  • Hover Shadow sets the box shadow when the card is hovered.

Content Style

These settings apply to the inner content area of each post card.

Text Align sets the horizontal alignment of all text inside the card — Left, Center, Right, or Justify.

Background opens a color picker for the card background. Choose a solid color, a gradient, or an image background.

Hover Background sets a different background color, gradient, or image that appears when the reader hovers over the card.

Padding controls the internal spacing between the card edge and its content. You can set Top/Bottom and Left/Right values independently, or use the linked mode to set all sides at once.

Feature Image Style

These settings control the visual appearance of the post thumbnail. A Normal / Hover tab switcher lets you configure different looks for the default state and the hover state.

Normal tab:

  • Grayscale converts the image to grayscale (black and white) in its default state.
  • Border sets a border around the image using the WordPress border box control (style, width, color per side).
  • Radius sets the corner border-radius for the image independently on each corner.
  • Shadow adds a box shadow to the image.
  • Margin controls the outer spacing around the image.

Border, Radius, Shadow, and Margin are hidden when an Overlay sub-layout is active.

Hover tab:

  • Hover Grayscale converts the image to grayscale when the reader hovers over the card.
  • Animation applies a hover transition effect to the image. Options are None, Zoom In, Zoom Out, and Scale Up.
  • Hover Radius sets a different corner border-radius on hover — useful for animating from square to rounded corners.
  • Hover Shadow sets the box shadow when the image is hovered.

Hover Radius and Hover Shadow are hidden when an Overlay sub-layout is active.

Title Style

Typography opens a typography panel where you can control font family, font size (independently for Desktop, Tablet, and Mobile), font weight, font style (normal/italic), line height, letter spacing, and text transform (none, uppercase, capitalize).

Text Align sets the horizontal alignment of the title text independently from the card’s global text alignment.

Color sets the text color for the title.

Hover Color sets the title text color when a reader hovers over the card.

Margin sets the outer spacing around the title element — useful for adjusting the gap between the title and other elements like the meta data or excerpt.

Meta Data Style

Typography controls the font size, weight, style, and transform for all meta text (author, date, category, etc.) at once.

Normal / Hover tab switcher organizes the color options:

Normal tab:

  • Text Color sets the color for non-linked meta text like the publication date.
  • Link Color sets the color for linked meta items like the author name and category labels.
  • Icon Color applies a color to all meta icons across author, date, category, and other meta fields.
  • Separator Color sets the color of the separator character between meta items.

Hover tab:

  • Text Hover Color sets the meta text color when hovered.
  • Link Hover Color sets the linked meta text color when hovered.
  • Icon Hover Color sets the meta icon color when hovered.

Margin sets spacing around the entire meta data row.

Categories Badge Style

This sub-panel appears when Category Position is set to “On Image” or “Above Content” in the Elements tab.

Colors controls the text and background colors of the category badges.

Padding sets the internal spacing inside each badge.

Border Radius rounds the corners of the badges.

Margin controls the outer spacing around the badges.

Excerpt Style

Text Align sets the alignment of the excerpt text independently from the card’s global text alignment.

Typography controls the font family, size, weight, line height, and other properties for the excerpt.

Color sets the excerpt text color.

Hover Color sets the excerpt text color when a reader hovers over the card.

Margin controls the spacing above and below the excerpt text block.

Read More Style

Button Align positions the Read More button to the left, center, or right within the card.

Typography sets the font size, weight, and text transform for the button label text.

Padding controls the internal spacing inside the button, creating larger or smaller click areas.

Normal / Hover tab switcher organizes the color, border, and shadow options:

Normal tab:

  • Colors has two color pickers — one for the button text and one for the button background — both in their normal (non-hovered) state.
  • Border adds a border around the button and lets you set the border-radius for rounded corners. A border-radius of 100px creates a fully pill-shaped button.
  • Shadow adds a box shadow to the button.

Hover tab:

  • Hover Colors sets the button text and background colors when a reader’s cursor moves over the button.
  • Hover Border sets the border style, width, color, and corner radius on hover.
  • Hover Shadow sets the box shadow when the button is hovered.
  • Hover Animation applies a transition effect when hovering. Options are None, Zoom In, Zoom Out, and Pulse.

Slider Style

This panel appears only when the Slider layout is active and at least one of the Pagination or Prev/Next Button is enabled.

Pagination Bullets Color sets the fill color of the slide indicator dots.

Pagination Width and Pagination Height control the size of each bullet. Set both to the same value for circular dots, or make them different for oblong shapes.

Pagination Border — Opens the border editor for bullets. Use a border-radius of 50% for perfect circles.

Preview Next Button Color sets the icon color for the previous and next navigation arrow buttons.

Accordion Style

This panel appears only when the Accordion layout is active. It is labelled Accordion Options in the Style tab.

Header Background fills the clickable header row. The Normal and Hover tabs let you set a different fill for the row the reader is pointing at.

Header Padding sets the space inside each header row, around the title and the indicator. Use the linked/unlinked toggle to set the vertical and horizontal values together or each side on its own.

Indicator Color sets the color of the expand/collapse icon while the panel is closed.

Indicator Active Color sets its color while the panel is open, so the open item can read differently at a glance.

Number Color (Numbered FAQ theme only) sets the color of the running number in front of each header.

Hover Animation applies a motion effect to the whole item on hover — Lift Up raises it slightly, Zoom In scales it up a little, or None leaves it still.

The panel body’s background comes from Content Background, the item’s border and shadow from the Article panel — where Hover Border doubles as the open state — and the body padding from Content Padding.

Timeline Style

This panel appears only when the Timeline layout is active. It is labelled Timeline Options in the Style tab.

Line Color sets the color of the connector line running through the markers.

Dot Color sets the fill of each marker. It also acts as the timeline’s accent color, so it drives the focus ring on the horizontal track’s scroll container.

Dot Active Color sets the marker color for the item the reader is hovering or has focused, so the current milestone stands out from the rest of the run.

Date Color (Gutter date position) sets the color of the date printed across the line from each post.

Date Colors (Badge date position) sets a color and a background for the date, because the Badge position draws it as a pill. The background accepts a solid color or a gradient. Clearing it falls back to the line color.

Group Heading Color (when Group By is set to Year or Month) sets the color of the section heading above each group.

The date is styled by the Meta Data panel instead when Date Position is left on Inline, so this panel only offers a date color once the date has been lifted out into the gutter or onto a badge.

Advanced

Shortcode

After publishing a page containing the Advanced Post Block, you can embed the same block anywhere on your site using the shortcode:

[apb id=123]
Replace 123 with the ID of the apb post type containing the block.

Custom Query Filter

Use the apb_query filter to programmatically modify the block’s WordPress query arguments. This gives you full access to any WP_Query parameter beyond what the UI exposes.

Example:

add_filter( 'apb_query', function( $args ) {
    // Show only posts with a specific meta value
    $args['meta_key']   = '_is_featured';
    $args['meta_value'] = '1';
    return $args;
} );

Was this page helpful?

Last updated 08/16/2026

Badge Icon Save 90%