ThemeForest Belfort is a sophisticated WordPress theme designed specifically for developers, providing them with a versatile and powerful template to create stunning websites. This theme offers exceptional features and functionality, making it ideal for building single property and apartment websites that demand a stylish and professional aesthetic.

Theme Version: 1.0.0
SafariWordPress template ThemeForest Belfort
 

Template Description

The given WordPress theme, Belfort, is packed with a wide range of customization options, allowing developers to effortlessly personalize every aspect of their websites to suit their unique preferences and requirements. The theme boasts a sleek and modern design, ensuring a visually pleasing user experience for visitors. With its intuitive interface, users can easily navigate through the site and access relevant information effortlessly.

One of the standout features of this theme is its responsive design, which ensures that the website remains fully functional and visually appealing across various devices and screen sizes. This ensures that potential clients can access the site seamlessly from their laptops, tablets, or mobile phones, increasing the chances of engaging with and converting leads.

Developers will appreciate the advanced property search functionality integrated into the theme. Customizable search filters enable users to narrow down their property options based on specific criteria such as location, price range, and property type. This makes it easy for potential buyers or renters to find exactly what they are looking for without wasting time on irrelevant listings.

The theme also includes an integrated booking system, allowing property owners to manage bookings and reservations directly from their website. This convenient feature streamlines the booking process and eliminates the need for external tools or plugins.

Furthermore, the ThemeForest Belfort theme provides an array of impressive property showcase features. Developers have the ability to create visually stunning property galleries, showcasing high-quality images and videos that effectively highlight the unique features and selling points of each property. The inclusion of detailed property descriptions and floor plans further enhances the user experience, enabling potential buyers or renters to make informed decisions.

In terms of functionality, this theme offers seamless integration with popular plugins, enabling developers to extend the capabilities of their websites. From contact forms to social media integration, the theme ensures that developers have access to all the tools they need to create a fully functional and professional website.

Overall, this WordPress theme, specifically designed for developers, provides a robust and versatile template for creating single property and apartment websites. With its modern design, responsive layout, advanced property search functionality, and customizable property showcase features, ThemeForest Belfort empowers developers to build visually stunning and highly functional websites that effectively cater to the needs of property owners and potential buyers or renters.

Template Features:

  • Compliance with W3C XHTML 1.0 Transitional and W3C CSS Valid standards.
  • Support for compression of JavaScript and CSS scripts to accelerate website performance.
  • Thanks to the use of the latest versions of PHP and MySQL, the template code is up-to-date and secure.
  • A large number of positions for placing modules and several color suffixes.
  • Several built-in color schemes of the template for customizing your projects design.
  • The template supports Google fonts and RTL/LTR languages.
  • Multiple types of menus, Mega Menu, Dropline Menu, CSS Menu, with smooth animation effects.
  • Integrated support for popular plugins: WPBakery Page Builder, Elementor, WPML, expanding the functional capabilities of the site.
  • Demo data included to ensure the themes layout precisely matches the demo preview.

Specifications:

Release date: 01-03-2023
Last updated: 01-03-2023
Type: Premium
License: GPL 
Subject: Real Estate Construction & Repair
Compatibility: W5.x W6.x
QuickStart: Demo Data
Color
schemes:
Developer: ThemeForest

Rating:
4.5763888888889 1 1 1 1 1 (144 Votes)

Download by subscription!

You need to log in on the site and purchase a club subscription!

Share with your friends!

 

General Features:

 

Powerful Features

The theme includes a specially designed universal functions and elements for a particular segment, allowing you to easily customize the template.

Responsive Design

The layout of the themes are 100% responsive and works perfectly on all devices, providing maximum flexibility, adapting the website to fit any screen resolution.

HTML5 & CSS3

Modern web technologies offer a rich set of features and benefits. The template is designed using HTML5, CSS3, LESS, JQuery.

Quick Start

Get started in minutes using the install themes with preconfigured plug-ins, styles, and demo content.

Cross-Browser

The ability to display the site with the same degree of readability in all browsers, such as Safari, Firefox, Chrome, Opera, Internet Explorer 10+.

SEO optimization

Template is fully optimized for SEO, which ensures seamless index and the presence of your website in search engines.

How to Set Up ThemeForest Belfort for a Residential Complex Website or a Single-Property Site

ThemeForest Belfort is best viewed not as just another attractive WordPress theme, but as a ready-made visual system for showcasing a residential complex, a standalone building, an apartment offering, an agency-led property project, or a developer landing page. In this guide, we'll walk through the practical path: how to prepare WordPress, install the theme, import the demo without bringing in unnecessary clutter, set up the header, colors, menus, pages, property cards, floor plans, the mortgage calculator, lead forms, and the final pre-launch review.

ThemeForest Belfort as a visual system for a residential complex website
The cover highlights Belfort's core style: a dark premium background, a large above-the-fold property showcase, offer cards, stats, and an architectural section grid.

This article does not repeat the short product description already shown on the page. What matters here is something else: understanding where Belfort is strongest, where the theme needs careful setup, which decisions are better made before importing the demo, and how to avoid turning a polished template into a heavy storefront filled with stale demo content.

I will rely on the official ThemeForest page, the Qode Interactive page, Belfort documentation, the live demo, and general WordPress, Elementor, and WooCommerce best practices. Wherever an exact interface path is confirmed in the documentation, it is referenced as Belfort Dashboard, Belfort Core Options, Appearance > Menus, Pages > Add New, or another real path. Wherever the discussion is about safe WordPress practice, that is stated separately.

When Belfort Is the Right Fit for a Real Estate Website

Belfort shows its full value on projects where you need more than a simple property listing. It works best when the goal is to tell the story of a specific complex or flagship property. The demo reveals a clear structure: a large opening section with a building render, section-based navigation, a "Best offers" block with apartment cards, stats, complex sections, floor plans, apartment pages, a gallery, a calculator, and an interest form. This creates a presentation flow where the visitor first gets an emotional impression and an overall sense of the property, then moves into the details of square footage, room count, pricing, floor plan, and contact.

This approach works well for a developer, a real estate agency, a residential sales team, an architecture studio, a property management company, or the owner of a premium property. The theme works especially well when the project already has strong visuals: facade shots, interiors, floor plans, neighborhood photography, and shared-space renders. You can install Belfort without those assets, but a large part of its value will be lost, because the template is built around large-format imagery, expressive typography, and visual credibility.

The key practical takeaway: Belfort makes sense when the website is selling more than square footage. It is built for presenting lifestyle, architecture, ease of selection, and confidence in the property. If you need a portal with thousands of listings, complex front-end property submission, seller dashboards, and powerful regional filtering, you are better off looking at a dedicated listing platform or a specialized real estate plugin. Belfort is much closer to a presentation-focused site with curated properties and well-designed pages.

Who the Theme Fits Best

  • A developer promoting a single residential complex and wanting to showcase buildings, floors, apartments, neighborhood advantages, and a lead form.
  • An agency that needs a premium storefront for a relatively small property portfolio rather than a massive listing database.
  • An architecture or interior design studio that needs to present a property through galleries, floor plans, sections, and strong visual emphasis.
  • A property marketer who wants to build a landing page quickly in Elementor and continue refining the content without constant developer involvement.

When a Different Solution Is Better

The theme may be a poor fit if the site needs to become a full real estate marketplace with user-submitted listings, complex roles, paid placements, saved searches, owner dashboards, and automated feeds. In those cases, Belfort's presentation shortcodes, demo pages, and property cards are not a substitute for a platform built around that kind of architecture. Belfort is also not a good choice if the only reason you want it is the striking above-the-fold design, but the project has no strong imagery to support it. Its dark premium style starts to feel empty very quickly when filled with random stock photos.

What to Check Before Installation and Demo Import

Preparation matters more with Belfort than it may seem at first. The theme documentation explicitly walks the user through uploading the belfort.zip archive, activating it, installing the required plugins, registering the theme, checking System Info, and only then importing the demo. If you skip those steps, the most common failure looks like this: the demo imports only partially, forms do not appear, sliders are empty, property cards do not match the demo layout, and the admin area starts showing server resource warnings.

Before installation, it helps to sketch out a short map of the future site. For Belfort, that map should be concrete: which properties will be entered as Belfort Property, which units will go into Belfort Apartment, whether you need a WooCommerce store, whether forms will run through Contact Form 7, which pages belong in the main menu, which page should be the homepage, whether you need floor pages, and whether the calculator will be used. The more precise that map is, the easier it becomes to choose the right import type: a full demo clone or only content, widgets, or settings.

Minimum Technical Checklist

  • Make sure WordPress is installed and you have administrator access.
  • Prepare the theme archive so that you are uploading belfort.zip from inside the full ThemeForest package, not the entire package itself.
  • Confirm that the server allows you to upload the theme archive and run a long demo import.
  • Install WooCommerce before import if the site needs a store, and Contact Form 7 if you want the bundled demo forms.
  • Prepare logo files for the default, light, dark, sticky, and mobile header variations if you plan to use multiple header states.
  • Gather real estate images at sufficient size: hero image, property cards, apartment plans, floor plans, gallery images, and advantage/feature visuals.

Do not start the import on a live production site with existing content unless you have a backup. A demo import can create pages, menus, widgets, and theme settings. If you are testing the visual setup, it is much safer to do it on a copy of the site or on a separate WordPress installation.

Why System Info Matters Before Import

Belfort documentation specifically recommends opening Belfort Dashboard > System Info. This screen shows your server configuration, theme details, and active plugins. Any values that do not meet the theme requirements are highlighted in red. For the user, this is not a formality: the demo imports pages, media, settings, widgets, and sometimes sliders. If the execution time or memory limit is too low, the import may stop halfway through, and after that it becomes difficult to tell the difference between a theme issue and an incomplete demo import.

Pay especially close attention to PHP execution time, memory limit, upload size, and write permissions for dynamically generated CSS and JS files. Belfort documentation mentions a warning if the folders wp-content/themes/belfort/assets/css and wp-content/themes/belfort/assets/js do not have the required permissions. Do not try to solve that by assigning random open permissions "for everyone." The correct approach is to ask your hosting provider which permissions are safe for your environment and make sure the theme can generate the required files without exposing unnecessary access.

Installing Belfort and Importing the Demo Without Unnecessary Chaos

The official documentation describes two installation methods: uploading through the WordPress admin area and uploading the theme folder via FTP. For most sites, the first method is enough: go to Appearance > Themes > Add New > Upload Theme, choose belfort.zip, click Install Now, and then activate the theme. FTP is useful if the server will not accept the archive through the web interface or enforces a strict upload limit.

After activation, you should see Belfort Core Options in the left WordPress menu, along with a top admin notice about required plugins. The important sequence is this: first Qode Framework, then Belfort Core, then the other required and recommended plugins you actually plan to use. Belfort Core contains part of the theme's functionality and its custom post types, so without it you cannot properly build pages using Belfort's branded elements.

ThemeForest Belfort demo import and initial WordPress setup
This diagram walks through the path from uploading the archive to importing the demo, checking plugins, selecting the homepage, and saving the theme settings.

How to Choose the Right Import Type

In Belfort Dashboard > Import, the theme includes a demo import module. The documentation lists the options All, Content, Widgets, and Options. The right choice depends on the state of the site. For a clean installation where you want an exact demo-style foundation, All with attachments makes sense. For a project that already has pages in place, it is usually better not to import everything. You can use only Options to bring the appearance closer to the demo, or Content to study the page structure without overwriting global settings.

If the site will include a store, WooCommerce is best activated before import. Belfort documentation explicitly notes that this helps the shop-related demo content import correctly. The same applies to Contact Form 7: if forms are needed, install it before importing, otherwise the demo forms may not appear and the contact blocks may have to be rebuilt manually.

What to Do Immediately After Import

  1. Open Settings > Reading and assign the correct homepage.
  2. Open Settings > Permalinks, choose a clean URL structure, and save the settings to refresh your rewrite rules.
  3. Go to Belfort Core Options and click save even if you did not change anything. This helps regenerate the theme's dynamic styles.
  4. Check Appearance > Menus and assign menus to the correct locations: Main Navigation, Divided Left Navigation, Divided Right Navigation, Vertical Navigation, or Mobile Navigation, depending on the header type you selected.
  5. Open the homepage in a private browser window and confirm that the slider, images, menus, cards, and forms are visible to regular visitors, not just to the administrator.

How to Avoid Mixing Old Content with the Demo

If the site already contains pages, menus, and posts, an All import can create duplicates and mix the demo navigation with your existing structure. That is not a Belfort bug, but the usual risk of demo imports in WordPress. The practical approach is to import the demo on a clean copy first, review how the pages are built in Elementor and which elements are used, then transfer only the sections you actually need or manually rebuild the same structure on the live site.

If the import stalls, do not click the same button over and over. First refresh the page and check what has already appeared in Pages, Media, Appearance > Menus, and Belfort Core Options. Then import the pieces separately: content, widgets, settings, sliders, if that option is available. It is not the prettiest method, but it is often faster than cleaning up dozens of duplicates afterward.

The Visual System: Header, Hero Area, Colors, and Footer

Belfort's main screen is designed like an architectural showcase: a large building image, dark overlay, fine-lined navigation, a centered logo, large serif typography, and bronze-beige accent color. That is especially obvious in the attached visual reference: the top section is not overloaded with copy, but it immediately communicates the class of the property. Below it come dark sections with architectural lines, photography, and offer cards. That is why it is important not to break the rhythm when customizing the theme. Fewer random colors and a more disciplined visual system usually produce a better result.

Appearance settings should start with the global parameters, not the page itself. The documentation recommends using Belfort Core Options > Typography for overall typography and Belfort Core Options > General for the primary color. That is the right order: establish the shared style first, then make local exceptions. If you style every page separately, the site quickly becomes hard to maintain. Within a few weeks, one heading becomes lighter, another becomes larger, a third button shifts into a different shade, and the mobile version starts to fall apart.

Header and Logos

Belfort offers four header types: Centered Header, Divided Header, Standard Header, and Vertical Sliding Header. In practice, the right choice depends on the site structure. If the site has relatively few pages and the logo matters as a strong brand element for the residential complex, a centered or divided header helps preserve the premium look. If the navigation is longer and visitors need a faster path to properties, pages, and the blog, the standard header is simpler. The vertical sliding header can work well for a more dramatic landing page, but it should be tested especially carefully on mobile screens.

The logo is uploaded through Belfort Core Options > Logo. It is important to prepare several versions: the default logo, a light version for a dark hero area, a dark version for light pages, and separate assets for the sticky header and mobile area if those are used. It is not a good idea to rely on a single transparent logo file for everything. It may look fine on a dark background, but lose contrast on a light page and become too small in the sticky menu.

Menus and Anchor Navigation

The Belfort demo is built around section and page navigation: Home, Pages, Property, Apartments, Blog, Landing. For a real project, it is better to replace that with a clear structure such as "About the Complex," "Apartments," "Floor Plans," "Gallery," "Mortgage," and "Contact." If the homepage will function as a landing page, you can add anchor links to Elementor sections. In WordPress, the menu is created through Appearance > Menus, and its visibility depends on assigning it to the correct location. The documentation explicitly reminds users that the menu must be assigned or it will not appear in the header.

Result check is simple: open the site as a regular visitor, scroll through the top of the page, and test the default menu, sticky behavior, mobile menu, and all anchors. Expected state: a visitor can reach apartments, floor plans, the calculator, and the inquiry form in two clicks. If the path takes longer than that, the problem is not the theme but the navigation structure.

Footer and Widgets

The Belfort footer is configured through Belfort Core Options > Footer, while the content itself is added through widgets. The documentation lists an upper footer area with columns and a lower footer area. For a real estate site, the footer should not turn into a storage area for random links. It works better as a trust block: sales office contacts, office address, links to key properties, business hours, social media, a short subscription form, or a request button. If you enable four columns, decide in advance what each one contributes, otherwise the footer becomes visually heavy.

Property and Apartment: How to Build a Clear Catalog

One of Belfort's defining features is the separation between real estate properties and apartments. The documentation describes creating entries through Belfort Property > Add New and Belfort Apartment > Add New. They are not the same thing. Property works well for a building, tower, complex, or other large-scale property entity. Apartment is intended for specific units that can be linked to a property and enriched with a plan, square footage, price, features, and a list image.

This separation matters from the reader's perspective. A developer thinks in terms of buildings, floors, layouts, and units. A buyer usually thinks more simply: "what options are available," "what is the square footage," "how many rooms," "where is the floor plan," and "can I submit an inquiry?" Belfort makes it possible to connect those two perspectives by using Property to present the building and the broader story, and Apartment to deliver the concrete details of an individual option.

ThemeForest Belfort Property and Apartment structure in WordPress
This map shows the relationship between the property, the floor, the apartment, the listing card, and the page with the unit floor plan.

How to Fill Out Property

For Property, start by creating a category if there is more than one property: tower, district, project type, or status. Then add the title, the image used in listings, a second image if needed for the Property List Double Image element, the property logo, and the relevant attributes. Do not try to place every apartment-level detail into the property entry. A property should carry building-level details: architecture, surroundings, infrastructure, timelines, shared spaces, accessibility, and the overall concept.

For display, the documentation references shortcodes and elements such as Property List, Property Map, Property Info Table, Property Info, Property Image Map Gallery, Property Hierarchical Info, and Property Advanced Info. In Elementor, they appear in the Mikado-branded element group when the necessary theme plugins are active. On a complex page, it usually makes sense not to use every element at once, but to build a sequence instead: hero and promise first, then advantages, then a list of towers or sections, then a map or plan, then the apartments.

How to Fill Out Apartment

When creating an apartment through Belfort Apartment > Add New, the documentation highlights several useful fields: a link to the previously created property, Apartment List Image, image size, the Show New Sign flag, Apartment Object Label, the apartment floor plan, description, square footage, price, and repeatable feature fields with name, value, and image. These are the fields that turn the item from an ordinary WordPress post into a clear unit-selection entry.

A practical entry pattern looks like this: put a short apartment type in the title, use the description to explain who the unit fits best, enter a square footage value that matches the floor plan, and use the feature fields for bedrooms, bathrooms, balcony, view, orientation, finish level, or readiness. If a field has not been confirmed by the sales team, it is better to leave it empty than publish a temporary number. In real estate, trust matters more than the appearance of a fully filled-out card.

Apartment Cards and Tables

The documentation suggests displaying apartments through Apartment Info Table and Apartment List. On the homepage, cards usually work better: they are more visual, faster to scan, and a natural continuation of the demo style. On an "Apartments" or "Floor Plans" page, a table is often more useful because the visitor is comparing square footage, rooms, price, status, and floor. Do not mix both formats in the same section without a reason. A card sells the idea of the unit, while a table helps with comparison.

Data check: open one apartment card, its detail page, the apartment list, and the table. Square footage, price, floor plan, and status should match everywhere. If the same apartment looks available in the card but appears sold on the floor plan, the visitor will stop trusting the site.

Floor Plans, Interactive Maps, and the Mortgage Calculator

Belfort stands out from many presentation themes because the demo includes not only attractive property cards, but also decision-support flows: Property Floors pages, Floor Apartments, Property Hotspots, dedicated apartment pages, and a Mortgage Calculator. That is a major strength for residential complexes, because apartment selection rarely happens in a straight line. Users look at the floor first, then the plan, then availability, then square footage, and only after that submit an inquiry.

On the floor pages in the demo, there is a floor selector, apartment count, square footage range, and a View property link. On the floor apartment pages, you can see Sold statuses, available options, square footage, room count, floor data, and a View more link. That is a strong structure for a project where the buyer needs to understand availability quickly. But it requires discipline: statuses and numbers need to be updated as part of the process, not changed randomly.

How to Plan the Floor-to-Apartment Structure

Start with a spreadsheet outside WordPress: building, floor, apartment number, status, square footage, rooms, floor plan, apartment page. Then create the properties and apartments in the admin area. After that, build the floor pages in Elementor using the theme elements and the prepared plan images. If you start with the visual layout and only enter the data later, there is a high risk that the text blocks and the actual cards will drift out of sync.

For interactive diagrams, usability matters just as much as appearance. If you are using Image Map Pro or branded elements with hotspots on a plan, make sure there is also a text-based alternative nearby, such as an apartment table or a list of available units. A map works well on desktop, but it is not always ideal on a small screen. That is why the mobile version should be tested not only for the map itself, but for the full path from the plan to the apartment card.

The Mortgage Calculator as a Supporting Block

On the demo Mortgage Calculator page, you can see fields for property price, down payment, loan term, interest rate, and the final monthly payment. On the apartment page, the calculator also appears in a block titled "Calculate your mortgage rate in simple steps." In a real project, this element should be presented as a planning aid, not a financial promise. Add a short note nearby explaining that the calculation is preliminary and that actual terms depend on the bank, the loan program, and the verification process.

If the calculator is part of lead generation, place a "Get a Quote" or "Ask About This Apartment" form after it. Do not force users to hunt for contact information in the footer. At the same time, avoid overloading the page: the calculator, form, map, gallery, and feature list should follow a clear order. First the user understands the property, then compares options, then estimates the payment, and only after that submits an inquiry.

Elementor and Branded Elements: How to Build a Page That Stays Manageable Later

The Belfort documentation shows the page creation flow through Pages > Add New, selecting the Full width template, and opening Elementor via the EDIT WITH ELEMENTOR button. The theme's branded elements are located in the Mikado section in the Elementor panel. That matters because Belfort is not just a bundle of page templates. It gives you a collection of elements that let you build a custom page without copying the demo one-to-one.

But Elementor becomes chaotic very quickly when every section is treated like a separate experiment. For Belfort, it is better to define the page rhythm in advance: hero area, short positioning statement, best-offer cards, stats, building blocks, floor plans, advantages, gallery, calculator, and form. Then save repeatable section styles and avoid manually changing spacing in every individual block.

Global Settings and Local Exceptions

The documentation emphasizes that local page settings override the global values from Belfort Core Options. That is useful for standalone promo pages, but dangerous as a habit. Set typography, primary color, shared header, footer, grid, and behavior globally. Change only the parts that genuinely need to differ locally: a light header over a dark hero area, the title area turned off, a custom section background, or a dedicated layout for a specific property page.

This approach saves time during updates and rebranding. If the marketing team decides a few months later to replace the bronze accent with another brand color, you can update the primary color and a handful of sections instead of reworking the entire page by hand.

Which Elements to Use on the Homepage

For a residential complex homepage in Belfort, especially useful elements include Property List, Apartment List, Apartment Info Table, Property Info, Property Image Map Gallery, Calculator, Comparison Slider, Masonry Gallery List, Process, Counter, Testimonials List, and Contact Form 7 Widget. That does not mean all of them belong on a single page. A strong page is usually stronger because each element answers a specific visitor question.

How to Match Belfort Elements to the Job of the Page
Visitor Goal Recommended Element What to Check
Understand what kind of property they are looking at Section Title, hero section, Property Info The above-the-fold area does not hide the menu and gives a clear path to the apartments.
Compare available options Apartment List, Apartment Info Table Square footage, price, status, and floor plan match the apartment card.
Evaluate a building or floor Property Image Map Gallery, floor pages The map is clear on desktop, and mobile users have a readable alternative.
Submit an inquiry Contact Form 7 Widget, interest form The email is delivered, the fields are clear, and the consent text is still in place.

Performance: Disable What You Do Not Use

The Belfort documentation includes a useful note: individual shortcodes, post types, and icon packs can be disabled through Appearance > Customize > Belfort Performance if they are not being used. This is not a magic performance fix, but it is a sensible step. A site for a single residential complex rarely needs every icon pack, every widget type, and every demo block. The less unused functionality participates in the page, the easier it is to test speed and troubleshoot conflicts.

A Practical Workflow: Building a Residential Complex Homepage in One Working Cycle

Imagine you need to build a page for a complex called "Q1 District": you have a main building render, several apartment types, floor plans, an advantages block, a mortgage estimate, and an inquiry form. The goal is to create a page where the visitor sees a premium property, chooses an apartment type, understands the floor structure, reviews an estimated payment, and submits an inquiry.

Practical Belfort page workflow for a residential complex
This workflow connects WordPress settings, Belfort elements, apartment cards, a floor plan, and the public-page review.

Goal and Preparation

Before opening Elementor, prepare the core assets: the complex logo, the main building image, 3 to 6 apartment cards, a floor plan, 6 to 8 advantages, the sales department contact details, the consent text for the form, and the list of menu items. Create a draft page and decide which demo homepage will serve as your reference point: Main Home, Residential Complex, or Property Showcase. There is no need to copy the demo in full. The demo helps you understand the rhythm, but the real content needs to answer the questions specific to your property.

Build Steps

  1. In Belfort Core Options > Logo, upload the logo variations and check the contrast on the dark header.
  2. In Belfort Core Options > Header, choose the header type and scroll behavior.
  3. Create a page through Pages > Add New, apply the Full width template, and open Elementor.
  4. Build the hero area: building image, short headline, a button leading to apartments, and a button leading to the inquiry form.
  5. Create entries in Belfort Property for the complex or tower and entries in Belfort Apartment for several apartments.
  6. Add an Apartment List or Apartment Info Table block to display the available units on the page.
  7. Add a floor plan section with apartment links if the property is sold floor by floor.
  8. Place the calculator after the apartment cards, and the inquiry form after the calculator or next to the contact block.
  9. Assign the page as the homepage through Settings > Reading and save the permalinks.

Result Review

After publishing, open the page in a private window, then review it on desktop, tablet width, and mobile width using Elementor's responsive editing mode. On desktop, the main criterion is a strong hero area and a fast path to the properties. On mobile, it is headline readability, block order, menu behavior, and form accessibility. Do not consider the page finished until you have submitted a test inquiry and confirmed that the email arrived.

Also test the buyer journey: click the apartment button from the hero section, open a card, review the floor plan, go back to the list, open the calculator, and submit the form. If that path contains unnecessary steps, hidden buttons, duplicate menus, or unclear labels, fix the structure before launching paid traffic.

A Note About Demo Images

The Qode page states that premium images are included for use on a website built with this theme, but that should not become an excuse to borrow someone else's visual story. For a real property, replace the key imagery with your own: facade, interior, floor plans, neighborhood, and views from the windows. Demo images are acceptable only where they temporarily help you assemble the page structure. Before launch, it is especially important to replace photos of people, buildings, and apartments, otherwise the site will look like a template rather than a page for a real complex.

Integrations: Forms, WooCommerce, Translation, and Safe CSS Customization

Belfort lists compatibility with Elementor, WPBakery Page Builder, WPML, Contact Form 7, and WooCommerce. That does not mean every project should enable all of them. The more integrations you turn on, the more checks are needed after updates. Enable only what supports the real use case: an inquiry form, a multilingual version, a small commercial catalog, or a store for related services.

Contact Form 7 for Inquiries

If forms are needed, install Contact Form 7 before importing the demo so the demo forms are included. Then adapt the fields to your use case: name, phone, email, property of interest, comment, and data-processing consent. After that, submit a test inquiry. Check not only the on-page success message, but also the email itself: subject, sender address, recipient address, spam delivery, and proper Cyrillic handling.

For an apartment page, it is useful to pass the apartment or property name into the form. If the theme does not provide an exact built-in integration for that, do not invent complicated code. It is enough to use a separate form or a hidden field through Contact Form 7 if you are confident in the setup, or place a clear heading next to the form such as "Inquiry for Apartment 13." A simple solution is more reliable than an untested PHP snippet.

WooCommerce as an Additional Use Case

Belfort is compatible with WooCommerce and includes store-related widgets, including a dropdown cart. For real estate, that is not always necessary. WooCommerce makes sense if the site is not selling apartments directly, but instead offers add-on services, consultation bookings, printed catalogs, interior packages, or other supporting commercial items. If a store is not needed, do not activate WooCommerce just for the sake of the demo. It will add pages, styles, scripts, and admin entities that you will have to maintain.

If you do need the store, Belfort documentation recommends setting product images before import through Appearance > Customize > WooCommerce > Product Images and selecting Uncropped or Custom for thumbnail cropping so the appearance matches expectations. After changing image settings, WooCommerce typically requires thumbnail regeneration. That is especially important if the products are highly visual: catalogs, furniture, finishing packages, or design services.

WPML and Translating Labels

Both ThemeForest and Qode list Belfort as WPML-compatible, and the changelog mentions an updated WPML config. For a multilingual real estate site, translate not only the pages, but also the system labels: apartment status, feature names, button text, forms, and header elements. Belfort documentation also suggests translating or renaming default strings through Poedit or the theme language files. For a production site, it is better to keep translations organized in a way that will not be wiped out by a theme update.

Safe CSS Customization Without Editing Theme Files

If you need to make apartment cards or the inquiry button stand out slightly, do not edit the parent theme files. WordPress officially supports child themes, and it also includes the Additional CSS panel in the Customizer. For a small visual tweak, Elementor is often the easier option: assign a custom CSS class to the section or card in the CSS Classes field, for example belfort-lead-card, then add the CSS through Appearance > Customize > Additional CSS or the child theme stylesheet.

.belfort-lead-card {
  border: 1px solid rgba(185, 139, 101, 0.45);
  box-shadow: 0 18px 42px rgba(18, 25, 31, 0.16);
}

.belfort-lead-card .elementor-button {
  letter-spacing: 0;
  text-transform: uppercase;
}

This snippet is safe precisely because it does not depend on hidden Belfort classes. You add the class yourself to the required section in Elementor, and you can remove it in a minute. After inserting it, check the card on desktop and mobile width. If the change appears in the wrong place, the rollback is simple: remove the class from Elementor or delete the CSS from Additional CSS. For larger changes, use a child theme, because it lets you update the parent theme without losing your customizations.

Safe Belfort customization through Elementor and Additional CSS
This visual slot shows a reversible tweak: a custom CSS class in Elementor, a small CSS snippet, and a check of the card on the public page.

Checking the Site Before Launch

After configuring Belfort, it is not enough to say, "the homepage looks nice." For a real estate theme, the review needs to follow a full chain: technical correctness, visual consistency, ease of selection, inquiry flow, speed, responsiveness, and data maintainability. That is especially important if the site will receive paid traffic. A visitor may forgive imperfect copy, but not a broken form, a hidden button, or a contradictory apartment status.

Page and Route Review

Start by checking the homepage, the apartment listing page, the individual apartment page, the floor page, the calculator page, the contact page, and the blog if it is in use. Every page should have a clear role. If a leftover demo page still contains placeholder copy, remove it from the menu or move it back to draft. Demo phrases and fake names on a public site work against trust.

Then walk through the user journey: hero area - apartment list - card - floor plan - calculator - form. At every step, it should be obvious what the user should do next. Repeated calls to action can be especially helpful for real estate: "View Floor Plan," "Check Availability," "Ask a Question," and "Book a Viewing." But there should not be too many of them. If every section aggressively pushes the inquiry, the page starts to feel heavy-handed.

Responsive Review and Elementor

Elementor includes a responsive editing mode where you can check and adjust elements for different screen sizes. For Belfort, pay close attention to large serif headings, long menus, apartment cards, interactive floor plans, and tables. On mobile, the apartment table may become too wide and the interactive map too small. In that case, it is usually better to switch to enlarged cards or a separate list of available apartments below the map.

If two columns stack in the wrong order on mobile, fix the section order in Elementor rather than only adjusting the visual spacing. The visitor should see meaning and action first, not a decorative image. In real estate, that often means: heading, key parameter, button, then image or detailed gallery.

Speed and Cleanup Review

The Belfort documentation recommends using GTmetrix to analyze the causes of slow loading. The practical minimum is to compress real property images before upload, avoid enabling extra shortcodes and icon packs, disable unused plugins, avoid stacking multiple sliders on one page unless they are truly necessary, and review caching after the setup is complete. If Google Maps is used, make sure the API key is configured and that the map does not block the main page from rendering.

After any changes in Belfort Core Options, save the settings and review the public page in a state where cache has been cleared. Sometimes it looks like a color or typography setting did not apply, when in reality the browser or caching plugin is still serving an older CSS version.

Property Content Map: What to Replace in the Demo Before a Real Launch

The most common mistake with presentation themes is leaving the demo content model intact and replacing only a handful of images. With Belfort, that is especially noticeable because the demo is built as a finished story about a residential complex: the opening section, the lifestyle block, the best offers, numerical highlights, the building list, the FAQ, blog entries, and the interest-registration form. If you replace only the images but keep someone else's content flow, the site may still look impressive, but it will not answer the questions your own buyer actually has.

Before publishing, create a content map for the property. This is not an SEO spreadsheet or a hundred-point marketing brief. It is a working framework that connects real data to Belfort's sections. The hero area should include the complex name, the main promise, the neighborhood or property type, and the action. The apartment cards should include real units, square footage, room count, status, and a path to the floor plan. The stats section should contain only verifiable numbers: number of apartments, parking spaces, total site area, green zones. The FAQ should answer questions the sales team actually receives, not the generic responses left in the demo.

How to Map Real Data into Belfort Sections

Start with the top-level property entities. If only one building is being sold, a single Property may be enough. If there are multiple towers, sections, or phases, it is better to create separate property entries and think through how the user will move between them. Do not label everything "Q1," "Q2," and "Q3" if the buyer better understands names like "Tower A," "Parkside Building," or "River View Section." Belfort does not prevent you from using human-friendly names, and the theme's visual system benefits from a clear hierarchy.

Then move on to the apartments. For each Belfort Apartment entry, gather the minimum set of data: name, property, list image, floor plan, square footage, room count, price or price status, availability status, and 3 to 5 features. If pricing changes often, use a neutral phrasing and direct users to an inquiry form. If square footage or status is updated manually, assign responsibility for that process. You cannot allow a paid campaign to send users to a card that shows outdated availability.

Gather the images separately as well. For the hero area, you need one strong render. For the cards, use images of the same type and proportions. For floor plans, use clean diagrams without tiny distracting clutter. For the advantages section, use real spaces: courtyard, lobby, parking, terraces, fitness, and view points. If you do not have strong photography, it is better to use clean diagrams and honest plans than to insert random interior images unrelated to the property.

How to Adapt the Blog and FAQ for Property Sales

The Belfort demo includes blog cards and FAQ sections. You do not have to remove them. On a developer website, the blog can answer questions about the neighborhood, timelines, finish levels, documents, mortgage programs, infrastructure, and site upkeep. But it is important not to turn the blog into an abstract real estate magazine. Every article should support the property: explain the area, show the construction stage, break down floor plans, or answer a frequent buyer question.

The FAQ is usually best placed closer to the end of the page, after the cards and floor plans. The questions should help the user make a decision: which apartments are available, whether a viewing can be scheduled, what is included in the finish package, how to clarify mortgage terms, where the parking is located, and how to check the status of a specific lot. If the project has legal nuances, do not try to replace legal consultation with FAQ copy. Give a short answer and direct the visitor to a manager or the official documents.

Content After Launch

A Belfort site does not stop evolving on launch day. New photos will appear, apartment statuses will change, construction updates will be published, floor plans may be refined, and commercial terms may shift. That is why it is important to decide in advance which data is updated through Property and Apartment entries, which sections are edited in Elementor, and which settings live globally. If everything is stored in random text blocks, every update turns into a manual search across pages.

A good practice is to keep a short content change log: date of edit, what changed, where it was checked, and who confirmed the data. For a small site, that can be a simple spreadsheet. It helps the sales team, the editor, and the developer avoid arguing over which number is current. In real estate, that is not bureaucracy. It is trust protection, because the user is making a costly decision and the site needs to be careful with details.

Common Belfort Issues and How to Diagnose Them

Most Belfort problems are not caused by the theme being "broken," but by incomplete preparation, the wrong archive, inactive plugins, server limits, duplicate imports, or a caching conflict. The diagnostic path should move from simple to complex: archive, plugins, System Info, import, homepage, menu, dynamic CSS, forms, and responsiveness.

Diagnosing Belfort installation and setup issues
This diagnostic map shows symptoms, checks, and fixes for demo import, menus, property cards, forms, and dynamic styles.

"Stylesheet is missing" Error or WordPress Rejects the Archive

Symptom: WordPress reports that the stylesheet is missing, or the theme will not install through archive upload.

Cause: in most cases, the full ThemeForest package was uploaded instead of the nested theme archive belfort.zip. The full package may include documentation, a license, the child theme, and additional files.

What to check: unpack the downloaded package locally and find the actual belfort.zip file. Do not upload the full archive as-is.

How to fix it: install belfort.zip through Appearance > Themes > Add New > Upload Theme or upload the extracted belfort folder to wp-content/themes via FTP.

Branded Elements and Post Types Are Missing After Activation

Symptom: the Mikado elements do not appear in Elementor, Belfort Property and Belfort Apartment are missing, and the demo pages look empty.

Cause: Belfort Core, Qode Framework, or another required plugin is not installed or not activated.

What to check: open Plugins and the theme notice about plugin installation. Activate the required plugins first, then return to the pages.

How to fix it: install the plugins from the theme notice, confirm that Belfort Core Options is available in the admin area, then reopen Elementor and check the Mikado group again.

The Demo Imports Only Partially or You See a White Screen

Symptom: the import stalls, some pages do not appear, media is not fully uploaded, or a white screen appears during the import.

Cause: most often the server does not have enough execution time, memory, or upload allowance. Belfort documentation links a white screen during import to the execution time limit and recommends increasing it.

What to check: open Belfort Dashboard > System Info and look at the values marked in red. Check the hosting error log if it is available.

How to fix it: ask your hosting provider to increase the available resources, then import the parts separately: Content, Widgets, Options, and attachments. Do not run the full import repeatedly without cleanup.

The Menu Exists but Does Not Show in the Header

Symptom: the menu items exist in Appearance > Menus, but the site header is empty or still shows the demo navigation.

Cause: the menu is not assigned to the correct location, or the selected header type requires a different menu location.

What to check: the Manage Locations tab and the settings for Main Navigation, Divided Left Navigation, Divided Right Navigation, Vertical Navigation, and Mobile Navigation.

How to fix it: assign the menu to the appropriate locations, save, clear the cache, and test both desktop and mobile navigation.

Apartment Cards Do Not Match the Plan or the Table

Symptom: in the list, the apartment has one square footage value or status, on the apartment page it has another, and on the floor plan it is marked differently.

Cause: the data was entered manually in multiple places: the apartment entry, an Elementor block, the floor plan, the table, or a text section.

What to check: the source spreadsheet for the property, the Belfort Apartment entry, the floor page, the list widget, and the inquiry form.

How to fix it: define a single source of truth for sales data. If the data changes often, do not duplicate it in decorative text blocks. Display it through cards and tables instead, where consistency is easier to control.

The Inquiry Form Looks Fine but Emails Never Arrive

Symptom: the user sees a successful submission message, but the sales team never receives the email.

Cause: Contact Form 7 settings, the hosting mail configuration, missing SMTP, or spam filtering.

What to check: the mail tab in Contact Form 7, the recipient address, the email subject, the spam folder, and the mail plugin logs if one is installed.

How to fix it: configure delivery through a reliable SMTP service, send a test inquiry from a real address, check Cyrillic encoding, and add a clear email subject that includes the property name.

Questions That Usually Come Up Before Launching a Belfort Site

Can Belfort be used without importing the demo?

Yes. The documentation explicitly says that you can either start from scratch or use the demo as a starting point. Still, for a first introduction to Belfort, it is useful to import the demo on a test installation. That lets you see which elements are used, how the pages are structured, where the branded shortcodes live, and how the Property/Apartment relationship works.

Do I need to enable WPBakery if I plan to work in Elementor?

ThemeForest lists compatibility with both Elementor and WPBakery Page Builder, and the Belfort documentation shows Elementor in use along with the Mikado elements section. If the project is being built in Elementor, do not enable a second page builder unless there is a real need. The fewer active builders and unnecessary modules you have, the easier the site will be to maintain.

Why didn't the forms appear after the demo import?

Belfort documentation recommends installing Contact Form 7 before the import if you want the demo forms to be included. If the plugin was installed later, you can create the forms manually and replace the demo blocks with them. After the replacement, be sure to submit a test inquiry and check the email delivery.

Is Belfort suitable for a large listing portal?

Probably not. The theme is built for showcasing individual properties, residential complexes, apartments, and related pages. For a portal with user-submitted listings, personal dashboards, placement plans, and complex search, it is better to choose a dedicated listing platform or a real estate solution built around that architecture from the start.

Can I change styles by editing the parent theme files?

That is not recommended. For small changes, use Additional CSS or custom classes in Elementor. For broader customization, use a child theme. WordPress describes child themes as the proper way to change appearance and behavior without editing the parent theme directly, which helps protect your changes during updates.

What should I do if the interactive floor plan is awkward on mobile?

Do not try to preserve the desktop map at all costs in the exact same form. Add a readable apartment list or a table with larger rows below it, check the section order in Elementor, and keep the map as an additional exploration tool. The main job of the mobile version is to help users choose and submit an inquiry, not to reproduce the entire complexity of the plan at a tiny scale.

Do I need WooCommerce to sell apartments?

Usually not. WooCommerce is useful for products and services, but real estate sales more often require an inquiry, consultation, availability check, and an agreement outside the standard cart flow. In Belfort, WooCommerce can support additional commercial use cases, but you should not turn an apartment into a standard product unless the business process truly calls for it.

When ThemeForest Belfort Is a Strong Choice

Belfort is a strong choice if you need a WordPress website with a powerful real estate presentation, a clear property-and-apartment structure, ready-made demo pages, Elementor editing, branded real estate elements, a calculator, and the ability to assemble a residential complex page quickly. The theme is especially effective when the project has high-quality architectural visuals and the team is prepared to keep apartment data organized.

Before launch, run through one short final cycle: verify the archive and plugins, import the demo on a clean installation or carefully in parts, define the global settings in Belfort Core Options, build the Property/Apartment structure, assign the menus, and review the forms, mobile version, and speed. If the site answers the buyer's questions and the sales team receives inquiries, you can move on to active testing.

When you are ready to deploy the theme on your WordPress site, use the internal download block: go to the ThemeForest Belfort download. After downloading, do not install the full ThemeForest package as the theme. Find belfort.zip inside it, create a site backup, and test the installation on a staging copy first.

By OceanTheme.org Editorial Team

 

You are not logged in to post comments.