Service

The Service Widget allows you to showcase your services in a clean, modern, and fully customizable layout with icon support, descriptions, animation, and links.

🚀 How to Enable the Service Widget

To start using the Image Widget, follow these steps:

1. Navigate to your WordPress dashboard.
2. Go to Themepul Pack → Widgets.
3. Locate the service widget from the list.
4. Toggle the switch to “On” to enable it.
5. The widget is now available in the Elementor editor.

🔍 Step 1: Add the Widget

• Search for “Service” in the Elementor widget panel.
• Drag the Service widget (TP icon) into your desired section.

🧩 Step 2: Choose a Style

• Under the Content → Styles panel, select a prebuilt layout from the grid.
• Each style provides different visual arrangements (icon top, side, boxed, overlay, etc.).
• Hover on a style to preview it.

✍️ Step 3: Add Service Items

Under Service Content, you can manage each service card using the Repeater List.

✅ For each item:

• Show Count: Toggle to show a numeric order (1, 2, 3…).
• Icon: Choose an icon from the library or upload an SVG.
• Show Subtitle: Optionally enable a subtitle field.
• Title: Add your service title (e.g., “Development Services”).
• Enable Title Link: Toggle to make the title clickable.
• Title Link URL: Add the URL for the service detail page.
• Description: Write a short summary or feature of the service.
• Enable Button: Toggle to show a “Read More” or CTA button.
• Show Icon for Button: Add a small icon next to the button text.
• Button Text & URL: Customize the button label and destination link.

🎨 Step 4: Customize Content Appearance

Under Service Content:

• Icon Animation: Choose from Bounce, Slide, Zoom, Flip, etc.
• Color Shape: Optional shape background on hover.
• Image Shape: Enable hover effect shape or custom image.

Layout Options:

• Columns on Desktop/iPad Pro/Tablet: Set number of items per row based on device screen size (e.g., 3/3/2).

🛠️ Step 5: Style Options

Switch to the Style Tab to control design details.

🔲 Box Styling

• Alignment (left/center/right)
• Background Type
• Border Type & Radius
• Box Shadow
• Margin / Padding

💠 Icon

• Size, color, background, spacing, and hover effects.

📝 Card Content

• Typography for title, subtitle, and description
• Color settings for text and background

🔢 Count

• Styling options for numeric count (if enabled)

🔘 Button

• Button size, text color, and background color
• Hover effects
• Border radius and shadow