The Services V1 widget provides a streamlined way to showcase your business offerings by pulling data directly from the “Services” post type. It features a clean grid layout with integrated thumbnails and customizable action buttons.

Content Settings #

This section defines the data query and the core structure of the services grid.

• Show Thumbnail: A toggle to display or hide the featured image associated with each service.
• Alignment: Choose between Left, Center, or Right alignment for the service content.
• Number of Services: Specify the total number of service posts to display (e.g., 3).
• Filter by Category: Select specific categories to pull from or choose Show All Categories.
• Order By: Sort services by specific metadata like Date.
• Order: Set the display order to DESC (Descending) or ASC (Ascending).
• Columns Per Row: Define how many service items appear in a single row.
• Gap Between Items: Use the slider to adjust the horizontal and vertical spacing between service cards (e.g., 20px).
• Gap Between Content: Adjust the internal spacing between the title, description, and other text elements (e.g., 8px).
• Subtitle: Enable or disable the display of the service subtitle/meta text.

Button Settings #

Configure the call-to-action button that appears on each service card.

• Button Text: Manually enter the label for your action button (e.g., Learn More).

Style Tab: Image #

This section controls the appearance and scaling of the featured thumbnails within the Services V1 grid.

• Image Aspect Ratio: Choose the proportional relationship between the image width and height (e.g., 16:9) to maintain consistency across all cards.
• Object Fit: Define how the image is resized to fit its container, such as Cover to fill the area while preserving aspect ratio.
• Object Position: Set the focal point of the image (e.g., Center Center) to ensure the most important part of the visual remains visible.

Typography #

This section allows you to customize the text appearance for the Title and Subtitle elements within the Services V1 widget.

Title #

• Typography: Access global font settings, including family, size, weight, and line height, to define the look of the service title.
• Color: Set a specific color for the title text.

Subtitle #

• Typography: Configure separate font settings for the subtitle to maintain a distinct visual hierarchy.
• Color: Choose a color for the subtitle text.

Service Item #

The Service Item section provides controls to style the individual service card containers, including their background, spacing, and borders.

• Background Type: Choose between Classic (solid color/image) or Gradient to set the card’s background.
• Item Padding: Control the internal spacing between the card boundaries and the content. The current configuration is set to 20px on all sides.
• Border Type: Select a border style (e.g., Default) to outline each service card.
• Border Radius: Adjust the roundness of the card’s corners. It is currently set to a uniform 10px radius.
• Box Shadow: Apply a shadow effect to the container to add depth and visual separation from the page background.

Style Tab: Button Style (Services V1) #

The Button Style section offers comprehensive design controls for the action buttons within each service card, allowing for distinct looks in Normal and Hover states.

• Typography: Click the pencil icon to define the font family, size, and weight for the button text.
• Text Color: Set the specific color for the button label.
• Background Type: Choose between a Classic (solid color) or Gradient background for the button container.
• Background Color: Select the primary color for the button’s background.
• Padding: Control the internal spacing of the button to adjust its overall size. The current configuration is set to 10px (Top/Bottom) and 14px (Right/Left).
• Border Type: Select a border style, such as Default, to outline the button.
• Border Radius: Adjust the roundness of the button corners. A radius of 3px is currently applied to all sides.