How To Use

How To Use Business Card Block

With the Business Card Block, you can easily display business or personal information on your website using different card layouts, making your site more professional and informative.

You can follow the steps below to use the Business Card Block.

To get started, open the post or page where you want to display your business card. Next, click the Add Block (+) button to open the block inserter. From the block panel, search for Business Card and insert it into your desired area on the page or post.

After selecting the Business Card Block, you will see all available settings in the right sidebar. The sidebar contains two main sections: General and Style.

From the General tab, you can manage card content, layout, and visibility options. From the Style tab, you can customize the card’s appearance to match your website design.

Themes

From the Themes option, you can select different card layouts. Business Card Block offers multiple themes, including Default, Theme 1, Theme 2, and Theme 3 in the free version, along with additional premium themes.

When you change the theme, some settings may automatically change or appear based on the selected theme. Each theme has its own layout structure and supported features.

Layout Settings

In the Layout Settings panel, you can control the overall size and structure of the business card. You can adjust the card width using different units and enable automatic width by keeping the value set to zero.

You can also set a minimum height for the card or allow it to adjust automatically based on content. This panel includes an option to show or hide the download button, which allows visitors to download or save the business card.

Header Settings

From the Header panel, you can manage the main identity information displayed on the card. This includes the name and title fields, which appear at the top of the card.

Depending on the selected theme, additional fields such as tagline and company name may be available. Theme 3 supports a tagline field, while several themes allow displaying company information beneath the title.

Contact Information

The Contacts panel allows you to add and manage contact details shown on the business card. Each contact item includes an icon, text, and a link. You can add new contact items, edit existing ones, duplicate items, reorder them, or remove them as needed.

Changes made in this panel are instantly reflected in the card preview.

Social Icons (Theme 3)

When using Theme 3, a Socials panel becomes available. From this panel, you can add social media icons with corresponding links. Each social item can be customized and reordered to match your preference.

This panel is only visible when the selected theme supports social icons.

Card Style

Switch to the Style tab to customize the overall appearance of the Business Card Block. From here, you can change the background of the card using colors, gradients, or images. You can also adjust padding to control internal spacing.

Border and shadow options allow you to visually separate the card from surrounding content. Some advanced styling options are available depending on the selected theme.

Header Style

This section controls the appearance of the header area. You can adjust header alignment, margins, and typography settings for the name and title. Color controls allow you to customize text colors. 

Depending on the theme, additional options such as header background, border, shadow, tagline styling, company styling, and decorative elements may appear. Certain themes also allow enabling or disabling a separator below the header.

Contact Style

The Contact Style section controls how contact icons and text appear on the card. You can adjust icon size, icon colors, text typography, and text color to ensure clarity and consistency with your site design.

These settings help maintain readability across different screen sizes.

Social Icon Style (Theme 3)

When social icons are enabled, this section allows you to style the icons globally. You can control icon size and color so they align visually with the rest of the card.

Download Button Style

If the download button is enabled, this section allows you to customize its appearance. You can control the button position, typography, colors, border, and padding.

These settings help the download button blend seamlessly with the card design while remaining easy to notice and interact with.

Finally, click on the Save or Publish button to display your business card.

Now visit your page and preview the business card on the frontend.

That’s it for the Business Card Block.

ShortCode Usage

Use a simple shortcode to display the Business Card Block anywhere on your site, including posts, pages, widgets, or any shortcode-supported areas.

First, go to your WordPress admin dashboard. From the dashboard menu, navigate to Business Card Block → Add New Business Card to create a new business card.

Then you can customize your business card using your preferred theme and layout options.

Note: We already covered the full customization process earlier. As the steps are the same, we prefer not to repeat them here.

After customization, click the Publish or Save button to return to the dashboard.

Now, click on the Shortcode button to copy your business card shortcode.

Add the Shortcode block into the block editor. Paste the copied shortcode inside the block, then save or publish the page.

Then visit the page and preview your business card on the frontend.

That’s it.