Designed specifically forIndustrial manufacturing, foreign trade export, B2B technical servicetype enterprises, each block is polished around the chain of „Build Trust → Showcase Strength → Guide Inquiries“. No coding required, combine them like building blocks in the Gutenberg editor.

Block 1: Hero Block (Hero Banner)

Block 1: Hero Banner

The first screen determines whether visitors continue browsing. The Hero block supports full-screen background images + dual action buttons (e.g., „View Cases/Inquire Now“), conveying the main business and value proposition within 3 seconds to prevent users from leaving due to lack of focus.

Our Services Contact Us

When to Use

• Homepage/Landing Page First Screen
• Important Product Line/New Service Launch Page

Why B2B Enterprises Need It

The first screen determines whether visitors continue browsing. The Hero block supports full-screen background images + dual action buttons (e.g., „View Cases/Inquire Now“),conveying the main business and value proposition within 3 secondsto prevent users from leaving due to lack of focus.

💡 Best Practice: Use factory photos/equipment panoramas as the background, and use strong intention words like „Get a Quote“ or „View Brochure“ for button copy.

Block 2: Hero Slider Block (Multi-Image Carousel)

Block 2: Hero Multi-Image Carousel

When a single image cannot cover multiple business lines, use a carousel to efficiently display them in the same position.

Usage Tutorials Button 2

Block 2: Hero Multi-Image Carousel

Based on Swiper.js, smooth sliding with touch support, no slow loading due to multiple images (only preloads adjacent slides by default).

Button 1 Button 2

When to Use

• Need to carousel multiple product series/service scenarios within one screen
• Display client logos, certifications, and exhibition scenes

What problems it solves

When a single image cannot cover multiple business lines, use a carousel to display efficiently in the same position. Based on Swiper.js,smooth sliding with touch support, without slow loading due to multiple images (only adjacent slides are preloaded by default).

Block 3: About Block (图文介绍)

Block 3: About Us (图文介绍)

We are an industry-leading company dedicated to providing first-class solutions to our clients. With years of experience and an expert team, we strive to exceed expectations and deliver excellence in every project we undertake.

Core Advantage Item 1

Advantage description text, can also hide advantages

Core Advantage Item 2

Supports up to 4 core advantage descriptions

Learn More

When to Use

• Homepage Second/Third Screen: Company Profile + Core Advantages
• Main content of the independent „About Us“ page

Role in conversion

B2B transactions rely on trust. This block supportsleft-right image-text switching + 4 core advantage items (with icons), replacing vague descriptions with hard metrics like „years/capacity/patent count/delivery standards“ to help clients quickly build confidence in the company„s capabilities.

Block 4: Accordion Block / FAQ Collapsible Q&A

When to Use

• Product parameter description, service process details
• Centralized answers to common customer questions (payment/delivery/after-sales)

Why it improves inquiry quality

Filter out unsuitable requirements in advance, saving time for both parties. Place „minimum order quantity/MOQ/warranty policy/customization lead time“ in the FAQ,allowing clients to self-screen and retain high-intent leadsSmooth unfolding animation, without affecting the overall page rhythm.

Block 5: Blog Block Latest Posts/News List

Block 5: Latest Posts/News List

Regularly updating professional content can increase search engine crawl frequency, while demonstrating expertise through real cases and technical articles.

12 May

Content Card Block Usage Tutorial

We have designed 3 display formats for the Content Card block. To maximize user customization, we have not set a quantity limit. Therefore, if the default Content Card layout is not aesthetically pleasing, you need to adjust the „Columns“ setting in the design...

Read more →

12 May

Hero Slider Block Usage Tutorial

To add a switchable slideshow to your website, simply add the Hero Slider Block. The specific steps are as follows: 1. Create a new page and set it to full-width template (for the homepage, keep the default setting, as it will automatically use the full-width layout). 2. Click the plus icon in the top left corner...

Read more →

10 May

How to Add AI Customer Service to Product Pages

To add AI customer service to product features, first install the B2B product management plugin, then fill in the corresponding API address and KEY in the plugin settings, and enter the company introduction and FAQ information. After that, users will be able to see the AI customer service feature on the front-end product page. The specific steps are as follows: 1...

Read more →

When to Use

• Homepage Bottom/News Page
• Display content such as „Installation Cases“, „Industry Insights“, and „Product Application Scenarios“

Dual Value of SEO and Trust

Regularly updating professional content can increase search engine crawl frequency, whileDemonstrating expertise through real cases and technical articles. It is recommended to use it with the „LingHang Theme SEO Tutorial“ to make every article a customer acquisition entry point.

Block 6: Contact Info Card

Best Position

• Contact Page
• Service Page/Product Page Sidebar (Specific Business Contact)

Key to Reducing Churn

Let customers see the phone/email/WhatsApp at a glance when they most want to contact you.Supports horizontal/vertical layout switching and external link icons, foreign trade enterprises can configure a direct WhatsApp link, while domestic users can bind a WeChat QR code popup.

Block 7: Content Card Set Content Card (Classic/Modern/List)

Block 7: Content Card Set (Classic)

The three styles correspond to different depths of content: the classic style emphasizes equal juxtaposition, the modern style highlights featured services, and the list style is suitable for long directories. Unified design language avoids page style fragmentation.

Usage Tutorials

Block 7: Content Card Set (Modern)

The three styles correspond to different depths of content: the classic style emphasizes equal juxtaposition, the modern style highlights featured services, and the list style is suitable for long directories. Unified design language avoids page style fragmentation.

Usage Tutorials

Block 7: Content Card Set (List)

The three styles correspond to different depths of content: the classic style emphasizes equal juxtaposition, the modern style highlights featured services, and the list style is suitable for long directories. Unified design language avoids page style fragmentation.

Usage Tutorials

Typical Uses

• Detailed description of service items (e.g., „Precision Machining / Mold Manufacturing / OEM Services“)
• Download portal for technical documentation / white papers / sample brochures

Design philosophy of layered guidance

Three styles correspond to different depths of content:The classic style emphasizes equal parallelism, the modern style highlights promoted services, and the list style is suitable for long directories. Unified design language to avoid page style fragmentation.

Block 8: CTA Block Call to Action (CTA) Banner

Block 8: Call to Action (CTA) Banner

The CTA block summarizes value in one sentence + a strong action button (e.g., „Free Needs Assessment →“ „Get Sample List“), giving a push at the decision tipping point to directly increase form submission rates.

Get a Quote

Where to Place for Best Effect

• After case studies (strike while the iron is hot)
• End of service description (eliminate concerns, drive next step)

Turn traffic into inquiries

Display alone is not enough; clear instructions are needed. The CTA blocksummarizes value in one sentence + a strong action button(e.g., „Free Needs Assessment →“ „Get Sample List“), giving a push at the decision tipping point to directly increase form submission rates.

Block 9: Contact CTA Block Contact CTA (with Phone / Quick Entry)

High-conversion scenarios

• Heavy equipment / engineering project pages (need instant communication)
• Price-sensitive customers (provide phone priority option)

Capture the customer base that prefers phone calls

Some customers are not used to filling out forms and prefer to confirm by phone. This blockplaces the phone number in a prominent position, paired with short copy to create urgency, suitable for high-unit-price, long-decision-chain B2B businesses.

Block 10: Featured Grid Block (Services/Highlights Display)

Block 10: Featured Grid (Services/Highlights Display)

Use „equipment close-up + short title + one-sentence result description“ (e.g., „CNC accuracy ±0.01mm“) to quickly convey technical standards and quality commitments, dispelling customer doubts about craftsmanship.

1.

Project Name

A brief description of this project.

Read More

2.

Project Name

A brief description of this project.

Read More

3.

Project Name

A brief description of this project.

Read More

4.

Project Name

A brief description of this project.

Read More

Applicable Scenarios

• Visual Display of Core Processes/Unique Advantages
• Summary Display of 4-6 Key Service Items

Visual Persuasion

Images build impressions more easily than text. Use „equipment close-up + short title + one-sentence result description“ (e.g., „CNC accuracy ±0.01mm“)to quickly convey technical standards and quality commitments, dispelling customer doubts about craftsmanship.

Block 11: Projects Block (Project Case Grid)

Block 11: Project Case Grid

Hover overlay effect guides clicks for details; use real delivery records to prove reliability, especially suitable for engineering/custom manufacturing companies.

Category

Project Demo Title

Category

Project Demo Title

Category

Project Demo Title

Category

Project Demo Title

Category

Project Demo Title

Category

Project Demo Title

Essential Pages

• Individual Case Page / Homepage Success Stories Section
• Display by Industry/Region/Product Line

Key Evidence for B2B Deals

„Others have used it and are satisfied“ is the strongest sales pitch. Hover overlay effect guides clicks for details,use real delivery records to prove reliability, especially suitable for engineering/custom manufacturing companies. It is recommended to pair with a „Statistics Block“ to display cumulative delivery quantity.

Block 12: Services Block (Service List with Icons)

Standard Usage

• Service Page Main Content / Homepage Service Overview
• Standardized Description of Multiple Business Lines (each with its own icon)

Structured Display of Capability Boundaries

Prevent customer loss due to „not knowing what you actually do.“ Supports 6-12 services,each can be linked to a detailed description page, forming a browsing path of „Overview → Details → Inquiry“, suitable for medium to large B2B enterprises with complex businesses.

Block 13: Stats Block Data Statistics Animation

Trust Endorsement Position

• After About Us / Before Cases
• Replace subjective adjectives with numbers (e.g., „experienced“ → „Established 15+ years“)

Quantify strength, build barriers

Scrolling number animations naturally grab attention. Displayhard data such as „Annual production capacity / Number of export countries / Number of engineers / Yield rate“, allowing small and medium enterprises to stand out in peer comparisons. Supports custom units and suffixes, adaptable to different industry indicators.

Block 14: Team Block Team Display

Block 14: Team Display

B2B transactions ultimately come down to trust between people.

Name

Position

Name

Position

Name

Position

Applicable Objects

• Technology / Consulting Companies (Engineer / Expert Teams)
• Real-name display of foreign trade salespersons (for clients to designate contacts)

Humanize the company

B2B transactions ultimately rely on trust between people. Display core members' names, positions, and LinkedIn links,making clients feel they are working with a professional team rather than a faceless company, which is especially beneficial for building cross-cultural trust in cross-border business.

Block 15: Testimonials Block - Customer Review Carousel

Block 15: Customer Review Carousel

A word from a customer is worth more than self-praise.

Display reviews with real profile photos/company logos in a carousel to effectively eliminate final decision-making concerns, especially suitable for companies with a high proportion of new clients.

Client Name

Position/Company

Display reviews with real profile photos/company logos in a carousel to effectively eliminate final decision-making concerns, especially suitable for companies with a high proportion of new clients.

Client Name

Position/Company

Display reviews with real profile photos/company logos in a carousel to effectively eliminate final decision-making concerns, especially suitable for companies with a high proportion of new clients.

Client Name

Position/Company

Social Proof Section

• Second-to-last screen on homepage (final push)
• Product detail page sidebar/bottom

Let others praise you

A word from a customer is worth more than self-praise. Display reviews with real profile photos/company logos in a carousel,effectively eliminating final decision-making concerns, especially suitable for companies with a high proportion of new clients. It is recommended to select descriptions with specific scenarios (e.g., „solved a certain technical problem“).

Block 16: Why Choose Block - Differentiated Selling Points

Decision-boosting section

• End of service page / Before inquiry form
• Need to highlight differences when comparison with competitors is not obvious

Answer clients' implicit questions

When clients hesitate on which to choose, use 3-4 items„Shorter delivery cycles / Better after-sales system / More flexible customization capabilities“Give the reason directly. This is equivalent to answering the question „Why you?“ before you even speak.

Block 17: Content Card Grid — Multi-Card Grid Layout

Content Card Grid — Multi-Card Grid Layout

This is a design supplement to the Content Card block. For beginners who cannot design layouts themselves, we have added a multi-card grid layout that unifies card styles, with 2/3/4 column options and responsive auto-adaptation.

Title

Multi-card grid layout, unified card styles, 2/3/4 column options, responsive auto-adaptation

Link

Title

Multi-card grid layout, unified card styles, 2/3/4 column options, responsive auto-adaptation

Link

Title

Multi-card grid layout, unified card styles, 2/3/4 column options, responsive auto-adaptation

Link

Block 18: Product Showcase — B2B Product Showcase Block

Product Showcase — B2B Product Showcase Block

For users who need to display specific products on a page, supports badges, category tags, specification parameters, and a "View Details" button. Optional 2, 3, or 4 columns, with no limit on the number of products.

Demo

Category 1

Product Title

Optional parameters DN15-DN200 / MOQ: 100 pcs

View Details

Demo

Category 1

Product Title

Optional parameters DN15-DN200 / MOQ: 100 pcs

View Details

Demo

Category 1

Product Title

Optional parameters DN15-DN200 / MOQ: 100 pcs

View Details

Block 19: Logo Wall — Partner Logo Display

Logo Wall — Partner Logo Display

This block displays partner or client logos. Supports "Multi-row layout" or "Scroll animation".

Block 20: Image Gallery — Image Gallery Block

Image Gallery — Image Gallery Block

This block displays images in a gallery grid. Supports 3/4 column layout, hover title overlay, and built-in native lightbox (click to view large image, ESC/click overlay to close).

Demo Image

Demo Image

Demo Image

🚀 20 Blocks = A Complete B2B Website Conversion System

From first-screen appeal (Hero) → Proof of capability (Cases/Data) → Trust reinforcement (Testimonials/Team) → Call to action (CTA), the LingHang theme encapsulates complex website-building logic into simple drag-and-drop operations. You only need to focus on your own business content.

👉 View Full Theme Demo Site|Buy LingHang Theme Now

More Designs👉 Template Workshop