ヒーロー部門

The hero section has two parts, the header and the body.

ヘッダー

ステップ-1

Let’s first insert the Scroll Navigation ウィジェット Element Pack on our page. This will be the front navigation system for our website. Change the name of the menu items as you prefer from the content tab.

ステップ2

Insert the shop name/logo on the top left corner of the header. We inserted the Heading ウィジェット Elementor and put the shop name in texts.

ステップ3

Finish the header design of the pet shop website by using a gradient background color from the section settings. Don’t forget to put a 検索 widget on the top-right corner.

ボディ

ステップ-1

For the body of the hero section, simply insert the スライドショー widget. The widget lets you combine stunning background images, texts, and a CTA.

ステップ2

To add more style to the slider image, you can try to curl up the edges. To do that, you need to go to the section settings> Shape divider> and choose Curve from the Option タイプ.

特集セクション

After the hero section, we need to design the features section. This part will highlight our service capabilities and deliver deeper info about our pet shop website.

Now, more features will bring out more info spontaneously. But no need to overdo it. So, we will stick to 2 sections for displaying features.

Section-1

ステップ-1

Create a double-column section. Insert the Heading widget on the left column.

ステップ2

Put a Divider widget under the title to boost its look. Place a short description of the company below.

ステップ3

Placing the 高度なアイコンボックス widget on the right side of the column for pet descriptions.

Section-2

ステップ-1

With a decent background image, create a multi-column section and fill it with more shop related details. You can do that much simply using a ヘッダー widget and the テキストエディタ ウィジェット

ステップ2

Insert an 画像 widget and displace its position using the 上級 タブ

Gallery Section

You can not design a pet shop website without a pet gallery, right? To make it look decent, you can cover an entire section with an image gallery or merge it with the features.

We did the later but in a more creative way.

ステップ-1

First, create a 6 column section and insert the 画像 widget in them.

ステップ2

Second, go to column settings and in the 上級 tab, consecutively adjust their margin. Just then, you will get a nice curved pet image gallery.

証言 Section

Positive reviews from customers is always a good addition to your website. A pet website is not different. As your customer will put more trust upon seeing those good reviews, it’s best to put a testimonial section on your website.

On a new section, insert the 証言カルーセル widget in the middle of the section. Make the color a bit transparent from the Style tab.

Insert all affiliate websites, partners, sponsors through the カスタムカルーセル widget. And, that covers up for the testimonials.