Website Building Using Heading and Image Tool in Elementor

Introduction to Elementor

Elementor is a powerful drag-and-drop page builder for WordPress that allows users to create visually appealing websites without coding. Two essential elements in Elementor are the Heading and Image widgets, which help structure content and enhance visual appeal.

Adding and Customizing Headings in Elementor

Step 1: Adding a Heading Widget

1. Open Elementor by editing a page or post in WordPress.

2. Drag and drop the Heading widget from the elements panel to the desired section.

3. Click on the heading to edit the text.

Step 2: Customizing the Heading

• Text Content: Modify the heading text as per your website content.

• HTML Tag: Choose from H1, H2, H3, H4, H5, H6 based on the content hierarchy.

• Alignment: Align the text to the left, center, or right.

• Typography: Adjust the font family, size, weight, and letter spacing.

• Text Color: Change the heading color under the Style tab.

• Advanced Customization: Add margins, padding, or animations under the Advanced tab.

Adding and Customizing Images in Elementor

Step 1: Adding an Image Widget

1. Drag and drop the Image widget into the desired section.

2. Click on the Choose Image option and upload or select an image from the media library.

Step 2: Customizing the Image

• Size: Adjust the image size (thumbnail, medium, large, or custom).

• Alignment: Position the image to the left, center, or right.

• Caption: Add a description under the image.

• Linking: Set the image to open a new link when clicked (optional).

• Border & Shadow: Customize borders, corners, and shadow effects under the Style tab.