https://angry-gates-bead98.netlify.app/assets/js/947fc19c.fed3d433.js

1"use strict";(globalThis.webpackChunkdocs=globalThis.webpackChunkdocs||[]).push([[14135],{15680(l,e,t){t.d(e,{xA:()=>i,yg:()=>d});var n=t(96540);function s(l,e,t){return e in l?Object.defineProperty(l,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):l[e]=t,l}function o(l,e){var t=Object.keys(l);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(l);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable}))),t.push.apply(t,n)}return t}function a(l){for(var e=1;e<arguments.length;e++){var t=null!=arguments[e]?arguments[e]:{};e%2?o(Object(t),!0).forEach((function(e){s(l,e,t[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(l,Object.getOwnPropertyDescriptors(t)):o(Object(t)).forEach((function(e){Object.defineProperty(l,e,Object.getOwnPropertyDescriptor(t,e))}))}return l}function r(l,e){if(null==l)return{};var t,n,s=function(l,e){if(null==l)return{};var t,n,s={},o=Object.keys(l);for(n=0;n<o.length;n++)t=o[n],e.indexOf(t)>=0||(s[t]=l[t]);return s}(l,e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(l);for(n=0;n<o.length;n++)t=o[n],e.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(l,t)&&(s[t]=l[t])}return s}var u=n.createContext({}),g=function(l){var e=n.useContext(u),t=e;return l&&(t="function"==typeof l?l(e):a(a({},e),l)),t},i=function(l){var e=g(l.components);return n.createElement(u.Provider,{value:e},l.children)},y={inlineCode:"code",wrapper:function(l){var e=l.children;return n.createElement(n.Fragment,{},e)}},p=n.forwardRef((function(l,e){var t=l.components,s=l.mdxType,o=l.originalType,u=l.parentName,i=r(l,["components","mdxType","originalType","parentName"]),p=g(t),d=s,m=p["".concat(u,".").concat(d)]||p[d]||y[d]||o;return t?n.createElement(m,a(a({ref:e},i),{},{components:t})):n.createElement(m,a({ref:e},i))}));function d(l,e){var t=arguments,s=e&&e.mdxType;if("string"==typeof l||s){var o=t.length,a=new Array(o);a[0]=p;var r={};for(var u in e)hasOwnProperty.call(e,u)&&(r[u]=e[u]);r.originalType=l,r.mdxType="string"==typeof l?l:s,a[1]=r;for(var g=2;g<o;g++)a[g]=t[g];return n.createElement.apply(null,a)}return n.createElement.apply(null,t)}p.displayName="MDXCreateElement"},1173(l,e,t){t.r(e),t.d(e,{assets:()=>u,contentTitle:()=>a,default:()=>y,frontMatter:()=>o,metadata:()=>r,toc:()=>g});var n=t(58168),s=(t(96540),t(15680));const o={title:"Posts Carousel",sidebar_label:"Posts Carousel",icon:"gallery-horizontal",description:"Use Posts Carousel to display a sliding carousel of WordPress posts with configurable layout, content, and slider controls."},a=void 0,r={unversionedId:"layouts/modules/post-carousel",id:"layouts/modules/post-carousel",title:"Posts Carousel",description:"Use Posts Carousel to display a sliding carousel of WordPress posts with configurable layout, content, and slider controls.",source:"@site/beaver-builder/layouts/modules/post-carousel.mdx",sourceDirName:"layouts/modules",slug:"/layouts/modules/post-carousel",permalink:"/beaver-builder/layouts/modules/post-carousel",draft:!1,tags:[],version:"current",frontMatter:{title:"Posts Carousel",sidebar_label:"Posts Carousel",icon:"gallery-horizontal",description:"Use Posts Carousel to display a sliding carousel of WordPress posts with configurable layout, content, and slider controls."},sidebar:"beaverbuilder",previous:{title:"Popup",permalink:"/beaver-builder/layouts/modules/popup"},next:{title:"Posts",permalink:"/beaver-builder/layouts/modules/post-grid"}},u={},g=[{value:"Usage",id:"usage",level:2},{value:"Module Settings",id:"module-settings",level:2},{value:"Slider Tab",id:"slider-tab",level:3},{value:"Layout Tab",id:"layout-tab",level:3},{value:"Style Tab",id:"style-tab",level:3},{value:"Query Tab",id:"query-tab",level:3},{value:"Advanced tab",id:"advanced-tab",level:2}],i={toc:g};function y(l){let{components:e,...t}=l;return(0,s.yg)("wrapper",(0,n.A)({},i,t,{components:e,mdxType:"MDXLayout"}),(0,s.yg)("p",null,"Use Posts Carousel to display a sliding carousel of WordPress posts with configurable layout, content, and slider controls."),(0,s.yg)("h2",{id:"usage"},"Usage"),(0,s.yg)("p",null,"Use Posts Carousel to display queried WordPress posts in a horizontal sliding c

1arousel built on bxSlider. The module renders each post as a slide that can include the featured image, post title, post info such as author and date, post content or excerpt, an optional more link, and an optional icon. Slider behavior, autoplay, transition direction, navigation arrows, dots, and play/pause controls are all configured per instance."),(0,s.yg)("p",null,"Use Posts Carousel on home pages, blog landing pages, and template parts that need to surface multiple posts in a compact area. It fits featured-content sections, related-post strips, product or portfolio highlights driven by a custom post type, and any layout where a static grid takes up too much space."),(0,s.yg)("h2",{id:"module-settings"},"Module Settings"),(0,s.yg)("p",null,"The Posts Carousel module settings control the slider behavior, the post query, the layout of each slide, and the styling of the carousel items, text, and navigation arrows."),(0,s.yg)("h3",{id:"slider-tab"},"Slider Tab"),(0,s.yg)("p",null,"The Slider tab configures the carousel layout, autoplay, transition behavior, and slider controls."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Layout")," ",(0,s.yg)("small",null,"Default: Grid")),(0,s.yg)("p",null,"Selects the visual layout used for each slide."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Grid:")," Renders each post as a card with the featured image, title, info, and content stacked. This layout exposes the ",(0,s.yg)("strong",{parentName:"li"},"Content")," section, ",(0,s.yg)("strong",{parentName:"li"},"Post Content")," style section, and ",(0,s.yg)("strong",{parentName:"li"},"More Link")," style section."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Gallery:")," Overlays the post title and info on top of the featured image with a hover transition. This layout exposes the ",(0,s.yg)("strong",{parentName:"li"},"Icons")," section and the ",(0,s.yg)("strong",{parentName:"li"},"Post Hover Transition")," field."))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Auto Play")," ",(0,s.yg)("small",null,"Default: Yes")),(0,s.yg)("p",null,"Starts the carousel automatically on page load. Options are ",(0,s.yg)("strong",{parentName:"p"},"Yes")," and ",(0,s.yg)("strong",{parentName:"p"},"No"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Loop")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Continues the carousel from the first slide after the last slide. Options are ",(0,s.yg)("strong",{parentName:"p"},"Yes")," and ",(0,s.yg)("strong",{parentName:"p"},"No"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Delay")," ",(0,s.yg)("small",null,"Default: 5")),(0,s.yg)("p",null,"The delay between slide transitions, in seconds.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Transition Direction")," ",(0,s.yg)("small",null,"Default: Right To Left")),(0,s.yg)("p",null,"Sets the direction the carousel slides."),

1(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Right To Left:")," Advances slides toward the left."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Left To Right:")," Advances slides toward the right."))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Transition Speed")," ",(0,s.yg)("small",null,"Default: 1")),(0,s.yg)("p",null,"The duration of the transition animation between slides, in seconds.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Slider Controls")),(0,s.yg)("p",null,"The Slider Controls section configures the navigation elements shown with the carousel."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Slider Controls")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Show Dots")," ",(0,s.yg)("small",null,"Default: Yes")),(0,s.yg)("p",null,"Shows or hides the pagination dots beneath the carousel.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Show Arrows")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Shows or hides the previous and next arrows on the sides of the carousel. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Yes")," reveals the ",(0,s.yg)("strong",{parentName:"p"},"Nav Arrows")," section in the Style tab.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Show Play/Pause")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Shows or hides a play and pause control for the carousel.")))),(0,s.yg)("h3",{id:"layout-tab"},"Layout Tab"),(0,s.yg)("p",null,"The Layout tab controls how many posts appear, how each slide is sized and spaced, and what content each slide includes."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Posts")),(0,s.yg)("p",null,"The Posts section controls the number of slides, slide sizing, and the per-slide hover transition used for the ",(0,s.yg)("strong",{parentName:"p"},"Gallery")," layout."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Posts")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Number of Posts")," ",(0,s.yg)("small",null,"Default: 10")),(0,s.yg)("p",null,"The total number of posts to load into the carousel.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Number of Posts to Move")," ",(0,s.yg)("small",null,"Default: 1")),(0,s.yg)("p",null,"The number of slides advanced on each transition.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Max Width")," ",(0,s.yg)("small",null,"Default: 300")),(0,s.yg)("p",null,"The maximum width of each slide, in pixels.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Spacing")," ",(0,s.yg)("small",null,"Default: 30")),(0,s.yg)("p",null,"The horizontal space between slides, in pixels.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Equalize Column Heights (Grid Only)")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Forces all visible slides to share the same height. This field appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Hover Transition (Gallery Only)")," ",(0,s.yg)("small",null,"Default: Fade")),(0,s.yg)("p",null,"The animation used when hovering each slide in the ",(0,s.yg)("strong",{parentName:"p"},"Gallery")," layout."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Fade:")," Fades the overlay in on hover."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Slide Up:")," Slides the overlay up into view."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Slide Down:")," Slides the overlay down into view."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Scale Up:")," Scales the overlay up into view."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Scale Down:")," Scales the overlay down into view."))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Featured Image")),(0,s.yg)("p",null,"The Featured Image section controls whether each slide displays the post's featured image and how the image is sized and cropped."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Featured Image")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Image")," ",(0,s.yg)("small",null,"Default: Show")),(0,s.yg)("p",null,"Shows or hides the featured image on each slide. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Show")," reveals the ",(0,s.yg)("strong",{parentName:"p"},"Size")," and ",(0,s.yg)("strong",{parentName:"p"},"Crop")," fields."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Image Settings")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Size")," ",(0,s.yg)("small",null,"Default: medium")),(0,s.yg)("p",null,"The registered WordPress 

1image size used for the featured image.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Crop")," ",(0,s.yg)("small",null,"Default: Landscape")),(0,s.yg)("p",null,"The crop ratio applied to the featured image."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"None:")," Uses the original aspect ratio from the selected size."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Landscape:")," Crops to a wide landscape ratio."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Panorama:")," Crops to a wider panoramic ratio."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Portrait:")," Crops to a tall portrait ratio."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Square:")," Crops to a 1:1 square."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Circle:")," Crops to a 1:1 square and applies a circular mask."))))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Icons (Gallery Only)")),(0,s.yg)("p",null,"The Icons section adds an optional icon to each slide. This section appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Gallery"),"."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Icons")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Use Icon for Posts")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Shows or hides an icon on each slide. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Yes")," reveals the icon configuration fields."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Icon Settings")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Icon")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The icon displayed on each slide.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Icon Position")," ",(0,s.yg)("small",null,"Default: Above Text")),(0,s.yg)("p",null,"The position of the icon relative to the post text."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Above Text:")," Places the icon above the title and info."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Below Text:")," Places the icon below the title and info."))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Icon Size")," ",(0,s.yg)("small",null,"Default: 24")),(0,s.yg)("p",null,"The size of the icon, in pixels.")))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Info")),(0,s.yg)("p",null,"The Post Info section controls the author and date metadata shown on each slide."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Info")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Author")," ",(0,s.yg)("small",null,"Default: Show")),(0,s.yg)("p",null,"Shows or hides the post author on each slide.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Date")," ",(0,s.yg)("small",null,"Default: Show")),(0,s.yg)("p",null,"Shows or hides the post date on each slide. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Show")," reveals the ",(0,s.yg)("strong",{parentName:"p"},"Date Format")," field."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Date Format")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Date Format")," ",(0,s.yg)("small",null,"Default: Default")),(0,s.yg)("p",null,"The format used for the post date. ",(0,s.yg)("strong",{parentName:"p"},"Default")," uses the WordPress site date format. The remaining options are PHP date formats such as ",(0,s.yg)("inlineCode",{parentName:"p"},"M j, Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"F j, Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"m/d/Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"m-d-Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"d M Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"d F Y"),", ",(0,s.yg)("inlineCode",{parentName:"p"},"Y-m-d"),", and ",(0,s.yg)("inlineCode",{parentName:"p"},"Y/m/d"),".")))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Content (Grid Only)")),(0,s.yg)("p",null,"The Content section controls the post content and more link shown on each slide. This section appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid"),"."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Content")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Content")," ",(0,s.yg)("small",null,"Default: Hide")),(0,s.yg)("p",null,"Shows or hides the post excerpt on each slide. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Show")," reveals the ",(0,s.yg)("strong",{parentName:"p"},"Content Length")," field and the ",(0,s.yg)("strong",{parentName:"p"},"Post Content")," section in the Style tab."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Content Length")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Content Length")),(0,s.yg)("p",null,"The maximum number of words shown in the excerpt. Leave empty to use the WordPress default excerpt length.")))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"More Link")," ",(0,s.yg)("small",null,"Default: Hide")),(0,s.yg)("p",null,"Shows or hides a read-more link below the excerpt. Setting this to ",(0,s.yg)("strong",{parentName:"p"},"Show")," reveals the ",(0,s.yg)("strong",{parentName:"p"},"More Link Text")," field and the ",(0,s.yg)("strong",{parentName:"p"},"More Link")," section in the Style tab."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"More Link Text")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"More Link Text")," ",(0,s.yg)("small",null,"Default: Read More")),(0,s.yg)("p",null,"The text displayed on the more link.")))))),(0,s.yg)("h3",{id:"style-tab"},"Style Tab"),(0,s.yg)("p",null,"The Style tab controls colors and typography for the slide background, post title, post info, post content, more link, and navigation arrows."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Carousel Item")),(0,s.yg)("p",null,"The Carousel Item section sets the slide background and the icon colors used in the ",(0,s.yg)("strong",{parentName:"p"},"Gallery")," layout."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Carousel Item")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Backgroun

1d Color")," ",(0,s.yg)("small",null,"Default: #ffffff; Supports: Field Connections")),(0,s.yg)("p",null,"The color applied to the overlay behind the text on each slide.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Icon Color (Gallery Only)")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the post icon. This field appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Gallery")," and ",(0,s.yg)("strong",{parentName:"p"},"Use Icon for Posts")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Yes"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"DuoTone Icon Primary Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"For Font Awesome DuoTone icons only: the primary color applied to the icon.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"DuoTone Icon Secondary Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"For Font Awesome DuoTone icons only: the secondary color applied to the icon.")))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Title")),(0,s.yg)("p",null,"The Post Title section styles the post title text on each slide."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Title")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the post title.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Hover Color (Grid Only)")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the post title on hover and focus. This field appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography")," ",(0,s.yg)("small",null,"Supports: Responsive")),(0,s.yg)("p",null,"The font settings for the post title."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography settings")),(0,s.yg)("p",null,"Typography settings control font family, size, weight, line height, letter spacing, text transform, and responsive text styling where available."))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Info")),(0,s.yg)("p",null,"The Post Info section styles the author and date text on each slide."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Info")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the post info text.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Link Color (Grid Only)")," ",(0,s.yg)("small",null,"Default: #cccccc; Supports: Field Connections")),(0,s.yg)("p",null,"The color of links inside the post info, such as the author link. This field appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Link Hover Color (Grid Only)")," ",(0,s.yg)("small",null,"Default: #ffffff; Supports: Field Connections")),(0,s.yg)("p",null,"The color of post info links on hover and focus. This field appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid"),".")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography")," ",(0,s.yg)("small",null,"Supports: Responsive")),(0,s.yg)("p",null,"The font settings for the post info text."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography settings")),(0,s.yg)("p",null,"Typography settings control font family, size, weight, line height, letter spacing, text transform, and responsive text styling where available."))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Content (Grid Only)")),(0,s.yg)("p",null,"The Post Content section styles the excerpt text on each slide. This section appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid")," and ",(0,s.yg)("strong",{parentName:"p"},"Content")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Show"),"."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Content")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the post content text.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Link Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of links inside the post content.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Link Hover Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of post content links on hover and focus.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography")," ",(0,s.yg)("small",null,"Supports: Responsive")),(0,s.yg)("p",null,"The font settings for the post content text."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography settings")),(0,s.yg)("p",null,"Typography settings control font family, size, weight, line height, letter spacing, text transform, and responsive text styling where available."))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"More Link (Grid Only)")),(0,s.yg)("p",null,"The More Link section styles the read-more link on each slide. This section appears when ",(0,s.yg)("strong",{parentName:"p"},"Layout")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Grid")," and ",(0,s.yg)("strong",{parentName:"p"},"More Link")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Show"),"."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"More Link")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the more link text.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Hover Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the more link on hover and focus.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography")," ",(0,s.yg)("small",null,"Supports: Responsive")),(0,s.yg)("p",null,"The font settings for the more link text."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Typography settings")),(0,s.yg)("p",null,"Typography settings control font family, size, weight, line height, letter spacing, text transform, and responsive text styling where available."))))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Nav Arrows")),(0,s.yg)("p",null,"The Nav Arrows section styles the previous and next arrow controls. This section appears when ",(0,s.yg)("strong",{parentName:"p"},"Show Arrows")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Yes")," in the Slider tab."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Nav Arrows")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Arrows Backgroun

1d Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The background color of the arrow controls.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Arrows Background Style")," ",(0,s.yg)("small",null,"Default: Circle")),(0,s.yg)("p",null,"The shape used behind each arrow."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Circle:")," Renders the arrow background as a circle."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Square:")," Renders the arrow background as a square."))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Arrows Color")," ",(0,s.yg)("small",null,"Supports: Field Connections")),(0,s.yg)("p",null,"The color of the arrow icons.")))),(0,s.yg)("h3",{id:"query-tab"},"Query Tab"),(0,s.yg)("p",null,"The Query tab configures the data source used to populate the carousel."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Source")," ",(0,s.yg)("small",null,"Default: Custom Query")),(0,s.yg)("p",null,"Selects whether the carousel runs its own query or inherits the main page query."),(0,s.yg)("ul",null,(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Custom Query:")," Builds a query inside the module using the ",(0,s.yg)("strong",{parentName:"li"},"Custom Query")," and ",(0,s.yg)("strong",{parentName:"li"},"Filter")," sections below."),(0,s.yg)("li",{parentName:"ul"},(0,s.yg)("strong",{parentName:"li"},"Main Query:")," Reuses the main WordPress query for the current page, such as an archive or search results page."))),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Custom Query")),(0,s.yg)("p",null,"The Custom Query section configures the query used when ",(0,s.yg)("strong",{parentName:"p"},"Source")," is set to ",(0,s.yg)("strong",{parentName:"p"},"Custom Query"),"."),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Custom Query")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Post Type")," ",(0,s.yg)("small",null,"Default: Post")),(0,s.yg)("p",null,"Selects one or more post types to query for the carousel.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Ordering settings")),(0,s.yg)("p",null,"Ordering settings control how queried posts or items are sorted, such as by date, title, menu order, or custom ordering options where available.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Offset")," ",(0,s.yg)("small",null,"Default: 0")),(0,s.yg)("p",null,"Skips the specified number of posts that match the query before returning results.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Exclude Current Post")," ",(0,s.yg)("small",null,"Default: No")),(0,s.yg)("p",null,"Excludes the post being viewed from the carousel results. Useful in single templates that show related posts.")),(0,s.yg)("details",null,(0,s.yg)("summary",null,(0,s.yg)("strong",null,"Filtering settings")),(0,s.yg)("p",null,"Filtering settings control which posts, terms, authors, or content types are included or excluded from the module output.")))),(0,s.yg)("h2",{id:"advanced-tab"},"Advanced tab"),(0,s.yg)("p",null,"The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations."),(0,s.yg)("p",null,"See the ",(0,s.yg)("a",{parentName:"p",href:"/beaver-builder/layouts/advanced-tab/"},"Advanced tab")," section for more information."))}y.isMDXComponent=!0}}]);