TF Artraz for WordPress is a versatile and comprehensive solution designed specifically for interior design studios. With its clean and modern design, this theme seamlessly combines functionality and aesthetics, creating a visually stunning website. Built on the powerful WordPress platform, this theme offers a range of features and customization options to cater to the specific needs of interior design professionals.

Theme Version: 1.0.0
SafariWordPress template ThemeForest Artraz
 

Template Description

The themes homepage features an intuitive layout that allows visitors to navigate seamlessly between different sections of the website. From showcasing portfolio projects to providing information about services offered, this theme offers a user-friendly experience. The clean and organized design ensures that the content is easily accessible and visually appealing.

One of the standout features of ThemeForest Artraz is the integrated online store functionality. Interior design studios can showcase and sell their products directly through their website, providing a convenient and streamlined shopping experience for their customers. The online store features a customizable layout, allowing businesses to display their products in a visually appealing manner. Additionally, the theme offers various payment options, making it easy for customers to complete their purchases.

TF Artraz also offers a range of customization options, allowing businesses to create a unique and personalized website. With customizable color schemes, fonts, and layouts, interior design studios can align their website with their brand image. The theme also includes pre-designed templates for key pages such as portfolio, services, and blog, saving businesses time and effort in designing these sections.

In terms of functionality, TF Artraz offers a range of useful features. The integrated contact form enables potential clients to get in touch with interior design studios easily. The theme also supports social media integration, allowing businesses to connect and engage with their audience across various platforms. Furthermore, the theme is built with search engine optimization (SEO) in mind, helping businesses improve their online visibility and reach a wider audience.

In conclusion, this theme for WordPress is a comprehensive and visually stunning solution for interior design studios. With its clean design, integrated online store functionality, and range of customization options, this theme provides businesses with the tools they need to create an impactful and professional online presence. Whether you are looking to showcase your portfolio, sell products, or provide information about your services, this theme offers a user-friendly and engaging experience for both businesses and their customers.

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: WooCommerce, Elementor, Bootstrap, WPML, Contact Form 7, expanding the functional capabilities of the site.
  • Demo data included to ensure the themes layout precisely matches the demo preview.

Specifications:

Release date: 24-12-2023
Last updated: 10-06-2026
Type: Premium
License: GPL 
Subject: Online Shopping Furniture & Interior WooCommerce
Compatibility: W5.x W6.x
QuickStart: Demo Data
Color
schemes:
Developer: ThemeForest

Rating:
4.4492753623188 1 1 1 1 1 (138 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 Artraz for an Architect or Interior Design Studio Website

ThemeForest Artraz works best when you see it not as a finished picture you can simply switch on, but as a set of connected WordPress site components: the theme, child theme, required plugins, demo import, Elementor pages, global Artraz Options settings, header and footer builders, project portfolios, blog, contact blocks, and extra shop pages. In this guide, we will walk through the full path from a ZIP archive to a tested live-ready site, without losing the demo look or turning an architecture-focused page into a heavy mix of random sections.

This article is written for a studio owner, webmaster, or developer who is already planning to test the theme on WordPress. You will not find another promotional summary here. Instead, you will get a practical roadmap for installation, setup, result checks, common mistakes, and the situations where Artraz is a weaker fit than a lighter theme or a custom build.

Special attention is given to what is visible in the official demo: a dark architectural visual style, large compressed typography, yellow accents, a top bar with social links and a phone number, a menu with sections like Home, About Us, Service, Pages, Project, Blog, Contact, plus client blocks, a studio intro section, project cards, services, testimonials, and blog content. If you want to preserve that character, you need to tune more than just the logo and colors. You also need to manage section rhythm, image quality, portfolio structure, and header behavior.

Guide cover for ThemeForest Artraz with a dark architectural template reference
The cover highlights Artraz's visual foundation: a dark architectural hero, yellow accents, bold typography, and the connection between the demo look and the theme settings.

What to Understand Before Working with Artraz

Artraz belongs to the class of premium WordPress themes where the real value is not in a single style.css file, but in the combination of prebuilt design, Elementor pages, custom widgets, demo data, and a settings panel. The official ThemeForest page lists Elementor, One Click Demo Import, Artraz Options, Header Builder, Footer Builder, WooCommerce, WPML, Contact Form 7, and Bootstrap as key parts of the product. So the right question is not "how do I enable the theme," but how do I build a working architecture site where the theme, plugins, demo content, and the studio's real materials work together instead of fighting each other.

The Artraz demo is built around project presentation. You can see that in the homepage structure: a strong visual opening, client logos, a studio section, a large Featured Projects area, services, testimonials, facts, and a blog. That logic works well for architects, interior designers, construction firms, visualization studios, furniture projects, and agencies that need to showcase the aesthetic quality of their work before getting into detailed text. If the site primarily needs to sell products, run a complex catalog, or function as a lightweight blog, Artraz may be more than you need.

The theme uses Elementor as its main page editor. That is convenient when the editor needs to move sections around, swap background images, change headings, buttons, and cards without touching templates. But it also means that after importing the demo, you cannot stop at the Appearance section in WordPress. You need to check pages in Elementor, global colors, fonts, responsive spacing, menus, the header, the footer, and the state of Elementor CSS files. If the front end looks different from the editor, the cause is often not the theme itself, but caching, CSS regeneration, or an optimization conflict.

The Artraz visual language is distinctive: dark backgrounds, monochrome interior photography, high-contrast white headings in a narrow grotesk style, yellow accents, thin outlined decorative lettering, and darkened project cards. That is a strong fit for premium portfolios, but it depends on high-quality imagery. If you replace the demo photography with random low-quality light images, the theme loses most of its visual impact. That makes content prep just as important as the technical installation.

What the Theme Is Designed to Do

The main job of Artraz is to help you launch a studio showcase site quickly, especially one that includes several content types: services, projects, team members or experts, a gallery, testimonials, posts, and a contact page. WooCommerce should be treated as an extra scenario in a theme like this, for example, selling design packages, consultations, material catalogs, or interior accessories. If the store is the core of the business, check early whether the premade shop pages match your checkout flow.

  • A portfolio of architecture and interior design projects with large images, categories, and individual project pages.
  • A studio services presentation: architecture, interiors, landscape, renovation, consulting, and design packages.
  • A homepage with a strong hero section, trust signals, a short brand story, projects, and a contact form.
  • A studio blog or journal for publishing project breakdowns, material advice, renovation stories, and updates.
  • An additional WooCommerce store if the studio sells digital materials, accessories, or consultation-based products.

How Artraz Differs from a General-Purpose Theme

A general-purpose theme usually gives you a neutral framework and expects you to build the visual language yourself. Artraz already pushes a specific aesthetic: a dark canvas, architectural photography, dramatic oversized headings, an accent color, and a dense section rhythm. That is a plus if you want a premium presentation quickly. It is a minus if the studio brand is light, minimalist, editorial, or built around soft pastel tones. In that case, you will need to do more than change a color. You will need to rework many sections.

The official materials also show custom Elementor add-ons and separate builders for the header and footer. That gives you flexibility, but it also increases dependency on the theme's Core plugin. If you disable the required theme plugin, some widgets, post types, or builder sections may stop rendering. That is why troubleshooting should always include not just the active theme, but also the installed plugin list.

Who This Theme Fits, and Who Should Look Elsewhere

Before installation, it is worth deciding honestly whether Artraz matches the project. Premium themes with demo import are especially useful when you need to show a client a mature visual structure quickly and then replace the demo content with real materials. They are less useful for sites that require a fully custom design, strict speed limits, unusual content logic, or a very small dependency footprint.

Good-Fit Scenarios

Artraz makes sense for a website where project impact comes first. For example, an architecture firm may want to show case studies, project sizes, work locations, interior photography, services, and contact details. The demo already suggests that structure: a hero screen with location and square footage, a studio section, project cards, a services list, testimonials, facts, and posts. The site owner gets more than an empty template. They get a base they can adapt to real work.

The theme also fits an agency that regularly builds WordPress and Elementor sites. In that case, Artraz can work as a starter build: import the demo on a staging domain, replace the visual materials, tune the header, footer, menu, and contact form, then move the finished site to production. For an agency, the child theme is especially important, because small CSS changes and template-level edits need to survive parent theme updates.

When Artraz May Be Too Much

If the site only needs a single landing page, a couple of text sections, and a simple form, Artraz may be heavier than necessary. Elementor, demo import, WooCommerce integrations, extra widgets, and builder sections add flexibility, but they also require maintenance. You need to update the theme and plugins, check CSS after changes, watch images and cache behavior, and keep things stable. For a very lightweight site, it can be smarter to use a basic theme and build a few sections manually.

There is another risk as well: content mismatch. The demo looks strong because it uses high-quality interior imagery, large typography, and confident short headings. If the studio does not have good project photography, it is better to prepare the visual materials first. Otherwise, the site will look like a demo with swapped images, not like a professional company website.

User Roles on the Project

Theme work is usually split across several people. The studio owner approves the structure and visual direction. The content manager replaces text, photos, projects, and blog posts. The webmaster handles WordPress, demo import, menus, forms, plugins, and caching. A developer steps in when the project needs a child theme, careful CSS work, production deployment, or error diagnosis. The earlier those roles are defined, the less chaos there will be after the demo import.

Practical rule of thumb: use Artraz as a visual framework, not as final content. The demo helps you understand section rhythm, but the real value only appears after you replace the photos, addresses, projects, services, testimonials, forms, and links.

What to Check Before Installing on WordPress

Preparation matters because demo import changes a site much more aggressively than a normal theme install. It can create pages, menus, posts, appearance settings, media files, and Elementor content. The safest path is to set everything up first on a clean test site or staging copy, and only then move the finished structure to the main domain.

The Site and Hosting Environment

The official ThemeForest listing shows a broad range of supported WordPress versions and compatibility with Elementor, WooCommerce, Contact Form 7, WPML, and Bootstrap. Those details are useful, but you still need to verify the actual environment. The hosting setup needs to support theme ZIP uploads, media import, and Elementor page processing without timeouts. If demo import fails partway through, the usual causes are limits on memory, execution time, upload size, or server-side blocking.

  • Create a site backup if you are not installing on an empty staging site.
  • Make sure the user has WordPress administrator permissions for theme and plugin installation.
  • Prepare a separate page for the homepage and another for the blog, so you can assign them later in Settings - Reading.
  • Disable aggressive minification and caching during import and initial setup.
  • Gather the logo, favicon, phone numbers, addresses, social links, services list, project photography, and card copy in advance.

Archives from the ThemeForest Package

One of the most common mistakes with premium themes is trying to upload the full archive downloaded from the marketplace account into WordPress. WordPress expects the installable ZIP for the actual theme, not a bundle containing documentation, a child theme, licenses, and extra files. Themeholy documentation for similar themes explicitly describes the workflow where you unpack the full archive and upload only the main theme ZIP. The logic is the same for Artraz: if WordPress says style.css is missing, the wrong archive was almost certainly uploaded.

Keep both files side by side: the main theme archive and the child theme archive. The main archive is required for the product to work. The child theme is required for safe customization. Do not edit parent theme files directly, because those changes can be lost during updates. If the change is only about color, spacing, or a small card style tweak, first look for a setting in Artraz Options or Elementor. If the setting is not there, use the child theme or additional CSS.

Content Before Import

For an architecture website, image quality matters more than the number of blocks. Prepare several types of assets: wide hero shots, vertical interior details, project cards, team images, client logos, and blog photography. The Artraz demo uses a dark overlay on top of images, so your photos need to keep their contrast even under that layer. Very bright or very small images can make headings unreadable.

It helps to sort materials by purpose instead of dumping everything into the media library. A hero photo needs to support a large heading and avoid important details in the center if text will sit on top of it. Project cards should follow one visual logic: similar shooting angle, comparable color grading, and solid sharpness. Project page images can be more detailed, but for the homepage, it is better to use your strongest shots because they create the first impression.

Text should also be prepared before import. In Artraz, large headings and short supporting lines work better than long paragraphs. For each project, write down a short title, object type, city or format, one main challenge, and a link to the full page. For services, decide in advance what deserves a dedicated page and what stays a short card. That kind of content plan saves time after import because you are not trying to invent text inside Elementor while dozens of demo sections are open in front of you.

Minimum Prep Before Installing Artraz
What to Prepare Why It Matters How to Check It
A clean test site Demo import can replace menus, pages, and appearance settings. After importing on staging, check which pages and menus were created automatically.
The installable theme ZIP WordPress accepts only the archive with actual theme files, not the full download package. If you see an error about style.css, unpack the full archive and choose the correct ZIP.
Project photography Artraz's visual style depends on strong images and a dark high-contrast presentation. Check your images in the hero section, project cards, and mobile view.
A menu plan The demo includes sections for the homepage, services, projects, blog, and contacts. Compare the future structure with the real pages you actually want to keep after import.

Theme Installation and Initial Validation

Technically, installing Artraz is no different from installing any other premium theme through the WordPress admin area, but after activation, it is important not to miss the required plugins. The ThemeForest page presents Elementor and custom add-ons as core parts of the product, and Themeholy documentation for its themes shows a separate required plugin installation step. Without them, the demo design may not match, and some widgets, builders, or post types may be missing.

Installation Order

  1. Open Appearance - Themes - Add New - Upload Theme.
  2. Select the installable Artraz ZIP, not the full download archive with documentation.
  3. Click Install Now, then Activate.
  4. If WordPress shows a required plugins notice, install and activate the theme's required plugins.
  5. If you plan to use forms, a store, or multilingual content, install only the integrations you actually need: Contact Form 7, WooCommerce, WPML, or their alternatives.
  6. Install the child theme if CSS edits, template changes, or developer work are planned.

After activation, do not jump straight to the public homepage. Check the admin area first: did Artraz Options appear, is there an Artraz Builder menu, are there plugin notices, demo import pages, and Elementor settings? If some of these items are missing, check whether the theme's core plugin is active and whether the current user has the necessary permissions.

Initial Check After Activation

Right after installation, the site may look empty because the theme has not imported demo content or assigned a homepage yet. That is normal. At this stage, the goal is to make sure WordPress is not showing critical errors, Elementor opens correctly, the plugin list is stable, and the theme is not conflicting with existing optimization tools.

  • Open Appearance - Themes and confirm that the correct theme or child theme is active.
  • Go to Plugins and check whether Elementor and the required Artraz Core plugin are active, if it is included in your package.
  • Open any created page in Elementor and confirm that the editor loads without an endless spinner.
  • Check the hosting error log if you get a white screen or a critical WordPress error after activation.
  • Clear browser and site cache only after the first settings have been saved, not halfway through the installation.

Quick takeaway: before demo import, the goal is not to get a beautiful homepage. The goal is to confirm that the theme, required plugins, and Elementor work as one system.

Demo Import Without Losing Control of the Site

One Click Demo Import is one of the strengths of themes like this, but it is also the stage that creates the most confusion. The import is there to give you a structure similar to the official preview: pages, sections, menus, placeholder images, settings, and Elementor elements. But it does not have to be the final state of the website. After import, you still need to remove what you do not need, assign the homepage, change menus, replace media, and test responsiveness.

ThemeForest Artraz demo import workflow in WordPress
This diagram shows the safest order: clean staging site, required plugins, demo import, homepage assignment, menu check, and resaving permalinks.

When to Import the Demo

The best time to import the demo is after the theme and required plugins are installed, but before you start actively working with your own content. If the site already has pages, posts, and menus, import can create duplicates and alter settings. Themeholy documentation for demo import warns that some existing settings may be replaced by demo content. That is why you should not import the demo on a live site without a backup.

If the project already contains content, it is safer to spin up a copy of the site, import Artraz there, choose the pages and sections you need, and then transfer only the selected elements. That approach is slower, but it protects the main structure. It is especially important for sites that already have SEO pages, a blog, products, or working forms.

Basic Import Path

  1. Make sure the required plugins are installed and active.
  2. Open Appearance - Import Demo Data if that menu item appears after installation.
  3. Run the selected demo import and wait for the success message.
  4. Open Settings - Reading and assign a static homepage if the import did not do that correctly.
  5. Go to Settings - Permalinks and click Save Changes to refresh the permalink structure.
  6. Check Appearance - Menus or the relevant menu screen to make sure the main navigation points to the correct pages.
  7. Open the homepage, a project page, the blog, and the contact page in incognito mode.

What to Do After Import

After demo import, the site often looks impressive, but it is not ready yet. The demo includes placeholder names, addresses, phone numbers, text, project cards, client logos, and images. Those cannot stay. They mislead visitors and weaken trust. Start replacing content in the places that are visible on the first screen and in the menu.

A practical order is this: first fix the global infrastructure, then the visible homepage sections, then the inner pages. Infrastructure includes the logo, favicon, menu, header, footer, contact details, social links, homepage assignment, and permalinks. If those elements remain in demo form, every later edit feels unfinished. After that, move on to the hero, projects, services, and form.

  • Replace the logo, phone number, email, social links, and address in the header and footer.
  • Rename the pages that will remain on the site and delete unnecessary demo pages.
  • Replace the hero heading with a short studio-specific statement, not a generic marketing slogan.
  • Add real projects with clear categories, square footage, location, challenge, and outcome.
  • Make sure blog cards do not point to empty demo posts.

The main import test: if a visitor cannot tell your site apart from the demo based on the text and projects, the setup is not finished yet. Artraz gives you a visual framework, but trust comes from real case studies.

Do not delete all demo pages at once. First identify which of them are useful as block references: a project page, a service detail page, a gallery, contacts, a blog layout. Sometimes it is easier to keep a copy of a demo page as a section library and move useful blocks from there into working pages. After the final build, that technical page can be turned into a draft or deleted, but during setup it helps you avoid losing strong sections.

Tuning the Visual Language: Colors, Fonts, Logo, and the Hero Section

The official Artraz listing points to the main color setting at Dashboard - Artraz Options - General - Theme Primary Color, and it also highlights Oswald for headings and Poppins for paragraph text. Those are important details for visual setup. The theme does not just color buttons. It builds its character through the contrast of narrow oversized headings, dark backgrounds, and a yellow accent. If you change everything at once, the design can lose its cohesion.

Artraz Options map for site color, typography, and header settings
This map shows which settings have the biggest impact on the look of the site: the primary color, typography, logo, header, mobile menu, and their connection to Elementor sections.

Primary Color and Accents

In the demo, the accent color is used sparingly: labels, icons, buttons, markers, and a few decorative details. That is a strong principle for an architecture website. You do not need to paint every section in the brand color. It is better to choose one accent, test it against the dark background, and keep it in buttons, links, markers, and important numbers.

If the studio brand uses a different color, test it on the hero image first. The accent needs to stay readable over dark photography and work alongside white headings. For a more restrained interior brand, it is often better to mute the color slightly than to use an overly bright shade. After saving the setting, open several pages: the homepage, a project page, a service page, the blog, and the form. Sometimes a color looks great in one block but feels too aggressive in cards or links.

Typography and Heading Length

Artraz's large headings work best when the text is short. The demo hero phrase uses big words and reads like a poster. If you replace it with a long multi-line sentence, the composition breaks. For the first screen, aim for 4-8 words and move the explanation into a subheading or the next block. For example, instead of listing every service in one long sentence, you could use "Turnkey Architecture and Interior Design" and then add a clarifying line about residential and commercial spaces below.

Check headings at three screen widths: a wide monitor, a laptop, and mobile. In Elementor, responsive spacing and font size should be reviewed separately for each major block. If a word wraps awkwardly, shortening the text is usually better than shrinking the type until it becomes hard to read.

Use a calmer hierarchy on inner pages. The main hero can feel poster-like, but service and project pages should read more like documentation about your work. If every block shouts in the same oversized font, users stop understanding where the main action is. A good rule for Artraz is this: keep the hero and key section headings expressive, and present explanations, steps, and technical details more simply.

Logo, Top Bar, and Menu

In the Artraz reference design, the header includes a dark top bar with social links and a phone number, a logo on the left, and a horizontal navigation menu. That format works well for a studio where the phone number and social channels genuinely belong in the first screen. If most leads come through a form or messaging app, the top bar can be simplified. The main thing is not to overload the header. In an architecture portfolio, the visual hero should still be the main focus.

Keep the menu short. The demo includes sensible sections: home, studio, services, pages, projects, blog, and contacts. For a real site, something like Home, Projects, Services, About, Blog, Contact is usually enough. If Pages is only there because it existed in the demo, remove it or replace it with a real section. Navigation should move the user toward projects and contact, not showcase every capability of the theme.

Header Builder and Footer Builder: How to Keep the Global Structure Intact

The ThemeForest page for Artraz describes two header and footer systems: the default option through Artraz Options and widgets, and the builder-based option through Artraz Builder - Header Builder and Footer Builder. Themeholy documentation for Footer Setup specifically points to the path Artraz Options - Footer, choosing a Footer Builder from a dropdown, and saving with Save Changes. That logic matters: it is not enough to create a nice header or footer in Elementor, you also need to assign it globally or to a specific page.

Global Header

If the site uses a builder-based header, setup usually happens on two levels. First, you edit the template itself in Artraz Builder - Header Builder. Then you assign it globally in Artraz Options. If you edit only the template but do not select it in the settings, visitors may still see the old header. If you select the template but do not update the menu, the demo links will remain.

For an architecture site, check the header in three states: the homepage hero, an inner project page, and the mobile menu. On the homepage, the header often sits on top of the hero image and needs strong contrast. On inner pages, the background may be different, so a white logo or white menu can become unreadable. The mobile header should show the logo at a reasonable size and should not cover the first heading.

The Footer as a Navigation and Trust Block

In a theme like this, the footer should not be a warehouse for every possible link. It closes the user journey: address, phone number, email, short navigation, social links, and possibly a subscription form or a quick path to projects. If the footer is built in Footer Builder, edit it as a standalone template: replace the logo, contacts, links, copyright, and test addresses. Then assign that footer globally in Artraz Options.

Artraz also allows a page-specific footer through Elementor page settings when Template Builder is in use. That is useful for a landing page dedicated to one service, where you may want a shorter footer with a lead form instead of the full corporate block. But do not overuse exceptions. The more pages have separate headers and footers, the harder the site becomes to maintain.

Header and Footer Validation Checklist

  • The global header is selected in Artraz Options and is actually visible on the homepage.
  • The menu is linked to current pages, not demo links.
  • The phone number and email are clickable if that is useful for your visitors.
  • The mobile menu opens and closes correctly and does not cover the logo.
  • The footer does not contain demo addresses, test phone numbers, or empty social profiles.
  • Page-level exceptions are used only where they genuinely improve conversion.

Elementor Sections, Projects, and Service Pages

Most day-to-day work with Artraz happens inside Elementor. That is where you change hero blocks, project cards, service sections, images, buttons, and most of the text. The important thing is not to treat Elementor like a simple text editor. Every section has spacing, background, responsive settings, column order, animations, and sometimes a custom theme widget. If you edit only the text, you can end up with a site that is technically filled in but visually broken.

Projects as the Core of an Architecture Site

The Artraz demo features a Featured Projects section with cards and large images. On a real site, that block should become more than a gallery of attractive pictures. It should be the entry point into case studies. A strong project card should communicate the minimum essentials: name, type of work, location or project format, and visual result. The project page can then expand on the challenge, constraints, phases, materials, square footage, team, and final photography.

If the theme uses a dedicated post type for projects through the core plugin, check where projects are created: in a separate menu item or through regular pages. Do not mix those approaches unless there is a clear reason. If the homepage card section pulls from a project post type, editing a normal page will not change the list. If the section is built manually in Elementor, each project has to be replaced directly inside the widget.

For a portfolio, it helps to choose a sorting principle in advance. Some studios group projects by object type: apartments, houses, commercial interiors, public spaces. Others group by service: architecture, interiors, site supervision, procurement. A third option is status: completed projects, concepts, visualizations. Artraz can visually support any of those approaches, but you should not mix them all in one block. The user should immediately understand why those particular cards are shown together.

A project page should answer what was done, not just display the final photography. Add a short project brief, key constraints, a couple of before shots or a planning explanation if that makes sense, and then the result. Even if the theme does not provide a dedicated field for every parameter, that structure can be built in Elementor using sections. The key is not to leave a project page as a stack of images with no context.

Services and the Inquiry Path

The services section in the demo lists architecture, interiors, urban context, landscape, and similar directions. A studio should not copy that set automatically. The services section needs to answer the client's question: what exactly can I hire you for, how does the work begin, and where do I click next? If you keep a card like "Interior Design," make sure it links to a service page with stages, examples, and a contact form.

In Elementor, each service may be a regular card, a custom theme widget, or part of an imported section. After replacing the text, check whether hidden links, demo icons, or identical buttons are still there. On mobile, service cards should appear in a clear order, with the most important directions first and secondary ones after that.

The Blog as Proof of Expertise

A blog is not necessary for every architecture theme installation. If the studio is ready to publish project breakdowns, material advice, layout comparisons, and notes about the process, a blog strengthens trust. If it will only contain demo posts or occasional low-value updates, it is better to remove it from the menu. Artraz includes premade blog pages, but the publishing decision should come from a real content plan.

From an SEO perspective, a few deep articles around common client questions are more valuable than many short news posts. For example: "how to prepare for a meeting with a designer," "what is included in an architectural project," "how to read a floor plan," or "common mistakes during an apartment renovation." Articles like those can be linked to both services and case studies.

Practical Example: Rebuilding the Studio Homepage After Import

Below is a real-world scenario rather than an abstract setup note: you imported the Artraz demo and now want to turn the homepage into a working page for an architecture studio. The goal is to keep the strong dark visual language while replacing the demo structure with a real user journey: understand the studio style, see projects, move into a service, and submit an inquiry.

Practical homepage setup scenario for ThemeForest Artraz
This scenario connects Elementor editing, Artraz Options, and the public result: the hero section, projects, services, contact path, and device testing.

Goal

Create a homepage where the first screen quickly explains the studio focus, the projects block highlights 3-6 strong case studies, services lead to dedicated pages, and the header and footer contain real contact details. By the end of setup, the front end should load correctly and contain no demo addresses, test phone numbers, or empty links.

Preparation

  • The Artraz demo has been imported onto a test site.
  • Elementor and the required theme plugin are active.
  • You have a logo, a hero image, 3-6 project photos, a services list, a phone number, an email address, and social links.
  • WordPress pages have been created for the homepage, projects, services, about page, blog, and contact page.

Steps

  1. Open the imported homepage using Edit with Elementor.
  2. Replace the hero background image with a photo that still works under a dark overlay.
  3. Shorten the main heading to one strong phrase and add a subheading with specific detail: city, project type, or specialization.
  4. Check the hero button. It should lead to projects or the contact form, not to an empty demo section.
  5. In the client block, keep only real logos or remove the section if there are no verified clients yet.
  6. In the studio section, replace the demo copy with 2-3 paragraphs about your approach, experience, and project types.
  7. In Featured Projects, replace the cards with real case studies. If the list is pulled from a project post type, create or edit the projects themselves first.
  8. In the services section, keep 3-5 directions and link each one to its own service page.
  9. Open Artraz Options and verify the primary color, logo, header, footer, mobile menu, and social links.
  10. Assign the homepage in Settings - Reading, save permalinks, and clear the cache.

Validation

After publishing, open the site like a normal visitor. Confirm that the first screen loads without layout shift, the menu leads to real pages, project cards open correctly, images do not look blurry, and the contact form sends a message or at least shows a proper submission state. Then open the same page on mobile: large headings should not be cut off, buttons should stay accessible, and the menu should close without forcing a reload.

Check more than appearance. Review the content path too. Within 20-30 seconds, a visitor should understand what the studio does, see 2-3 strong projects, move to a relevant service, and find a way to get in touch. If the homepage has many attractive sections but no clear next step, the page looks like a template showcase instead of a working business site. Artraz makes it especially easy to get carried away with dramatic blocks, so after every visual edit, ask one question: does this block help the user make a decision?

A Detail That Often Gets in the Way

In Elementor, you can update a page and still not see the change on the front end because of cache or outdated CSS files. If the editor shows the correct version but visitors see a broken grid, use Elementor's built-in CSS regeneration tools first, then clear the plugin, server, and CDN caches. Do not start changing sections at random until you have ruled out caching.

WooCommerce, Forms, and Multilingual Setup: Enable Only What You Actually Need

The ThemeForest listing states that Artraz is compatible with WooCommerce, Contact Form 7, and WPML. That does not mean every site should enable all three. The more integrations you activate, the more moving parts you need to update, test, and protect. Enable only the pieces that support a real project scenario.

When WooCommerce Makes Sense

WooCommerce is justified when the studio has a clear product or service with a checkout flow: a consultation, a design package, a digital catalog, a drawing set, interior objects, or a gift certificate. If the site is only meant to collect inquiries for custom work, a full store may be unnecessary. In that case, it is better to keep a simple form and contact path than to force the client through a cart.

If you do need a store, test the full path: product page, cart, checkout, emails, account area, and return to site after payment. The Artraz demo structure may include pages like Shop, Shop Details, Cart, Wishlist, and My Account, but those still need to be connected to real WooCommerce settings. A demo page on its own does not guarantee that checkout, shipping, taxes, and emails are configured for your business.

Contact Form and Contact Form 7

Contact Form 7 is often used as a simple way to collect leads. After import, check which form is embedded on the contact page and which fields it sends. In an architecture project, it is useful to ask for a name, phone number or email, project type, city, a short request summary, and the preferred contact method. Do not make the form too long. The first inquiry should feel easy.

After setup, send a test submission. Check the incoming email, subject line, recipient address, anti-spam fields, and success message. If emails are not arriving, the problem is usually not Artraz itself, but the WordPress or hosting mail configuration. On a production site, it is better to set up an SMTP plugin and verify deliverability.

Multilingual Setup and WPML

WPML is useful if the studio genuinely operates in more than one language or serves an international audience. In that case, you need to translate more than just pages: menus, theme strings, the footer, forms, buttons, project posts, categories, and SEO metadata also need attention. If you only need a single-language site, do not install the multilingual layer in advance. It adds complexity without adding value.

Pay especially close attention to strings inside the builder-based header and footer. They may not be ordinary menu items, but Elementor text widgets or theme options. After translation, open each language version as a visitor and check whether any demo words are still left in buttons, copyright text, social links, or forms.

Performance, SEO, and Safe Improvements Without Editing the Theme Core

Artraz is built for visual impact: large images, animations, sliders, Elementor sections, and project cards. That is normal for a portfolio theme, but it does require speed control. The official ThemeForest page carefully notes that actual performance depends on content and server quality. That is the right framing: the theme can provide a responsive design, but image optimization, caching, CDN setup, fonts, and hosting quality are still your responsibility.

What to Check After Setup

  • The file size of hero photography and project cards. Large images should be compressed and served at appropriate dimensions.
  • The number of animations. If every section appears with an effect, the site can feel slower and perform worse on weaker devices.
  • Fonts. If you keep Oswald and Poppins, do not also load several unnecessary font families.
  • Elementor CSS cache. After major changes, regenerate CSS and clear cache layers in order.
  • Project pages. They usually contain the most media, so they need separate testing.

Performance testing is more useful after you replace the demo content, not immediately after installation. Demo photography, real studio photography, and properly optimized images can produce very different results. First set up the pages, compress the media, disable unnecessary sections, test the forms, and only then turn caching back on. If you enable aggressive optimization too early, it becomes much harder to identify whether the problem comes from the theme, Elementor, an image, the cache layer, or a minification plugin.

For SEO validation, make a short list of the URLs that should be indexed: the homepage, service pages, project pages, blog posts, and contact page. Demo pages, section drafts, test posts, and utility pages should either be deleted or blocked from indexing. Premium theme imports often leave behind dozens of technical pages. If they end up in the sitemap, search engines see low-value content and users may land on pages that still contain demo text.

A Small CSS Fix for Stable Project Cards

If your project cards became uneven in height after replacing the demo images, you can make a safe fix using a section-level CSS class in Elementor. This does not require editing the theme core and does not depend on undocumented internal Artraz classes. Add the CSS class artraz-project-grid to the projects section in Elementor Advanced settings, then place the CSS in the child theme or the built-in Additional CSS field.

.artraz-project-grid .elementor-widget-image img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}

.artraz-project-grid .elementor-heading-title {
  line-height: 1.15;
}

This fix follows standard Elementor practice: you assign the section class yourself and limit the CSS to that area only. After adding it, open the homepage and the projects page on desktop and mobile. If a photo is cropped badly, replace the image or choose a different focal point in the media library. Rolling back is simple: remove the class from the section or delete the CSS block.

SEO Without Empty Promises

A theme can provide a clean visual structure and usable pages, but it will not improve rankings by itself. For an architecture studio site, what matters more is clear service headings, unique project descriptions, compressed images with alt text, logical internal linking, fast page loads, and proper indexation. After setup, make sure each project has its own URL, heading, description, images, category, and a link from the homepage or the projects list.

If you use an SEO plugin, configure metadata for the homepage, services, projects, and blog. Do not fill it with demo text. For each service, writing a specific title and description is better than using a generic template like "best services in your city." In architecture, users are looking for trust and style, so SEO should support real content, not replace it.

Why Artraz May Display Incorrectly and How to Diagnose It

Problems after theme installation rarely have a single cause. With Artraz, WordPress, the theme itself, required plugins, Elementor, demo import, Artraz Options, builder templates, cache layers, and your real images are all involved at the same time. That is why diagnosis should move from simple to complex: first check whether the theme and plugins are active, then review the import, then page assignment, then Elementor CSS, then cache behavior, and only after that go deeper into conflict tracing.

Artraz troubleshooting flow after installation and demo import
This diagnostic map connects each symptom to a likely cause, a validation step, and a safe fix without chaotic theme edits.

The Demo Does Not Import or Stops Halfway

Symptom: the import hangs for a long time, ends with an error, or creates only some of the pages. Possible causes include inactive required plugins, low hosting limits, blocked external requests, insufficient memory, or a cache conflict. First make sure the import is being run on a clean staging site and that the theme plugins are active. Then temporarily disable cache and optimization.

If the error happens again, check the server limits and error log. Do not rerun the import again and again on a live site. That can leave you with duplicate pages and media files. It is better to restore the staging backup and rerun the import after fixing the root cause.

The Site Does Not Resemble the Demo After a Successful Import

Symptom: the homepage opens as a list of posts, the menu does not match, the hero block is missing, or the pages look empty. Check Settings - Reading: the homepage should be assigned as a static page. Then check the menus and permalinks. For some demos, you need to resave Permalinks after import so that project pages and internal URLs start working correctly.

If the imported pages exist but the homepage was never assigned, that is not a theme error. It is a normal WordPress setup step. Assign the correct page, save the changes, and open the site in a private window.

Elementor Looks Fine, but the Public Page Is Broken

Symptom: sections look normal in the editor, but visitors see broken spacing, missing styles, or a damaged grid. First use Elementor's tools to regenerate CSS and data, then clear the site, server, CDN, and browser caches. Elementor's official documentation directly connects a number of custom CSS issues to stale files and caching.

If the problem appears after optimization, temporarily disable CSS/JS minification and deferred loading. Then turn settings back on one at a time. Do not start redesigning sections until you have checked cache behavior and CSS files.

Projects, the Builder Header, or the Builder Footer Do Not Appear

Symptom: project cards are missing, the header does not change after editing, or the footer stays in demo form. A likely cause is that the required theme core plugin is inactive, the builder template has not been assigned globally, or the page is using a local override. Check Plugins, then Artraz Builder, then Artraz Options - Header or Footer.

For a specific page, open the Elementor settings and check whether a separate Header Option or Footer Option has been selected. If a local option is enabled, the global setting may not apply. That is useful for landing pages, but it becomes a problem if you forgot the override was there.

The Form Does Not Send Inquiries

Symptom: a visitor fills out the form, but no email arrives. If the form was created with Contact Form 7 or another plugin, the theme is responsible only for the visual placement of the block. Check the form settings, recipient address, sender settings, anti-spam rules, SMTP, and mail log. For testing, submit the form from a different browser and check the spam folder.

If the form looks visually broken after a theme change, check the CSS and the container width in Elementor. If the email does not arrive, look at mail delivery, not Artraz Options.

Custom Changes Disappear After an Update

Symptom: after a theme update, file edits or custom styles are gone. If you edited the parent theme directly, those changes may have been overwritten. Use the child theme, built-in settings, Elementor, or additional CSS instead. The WordPress Developer Handbook describes child themes as the safe way to override and extend a parent theme.

If the changes were made in Elementor, check the editor history, cache layers, and CSS regeneration. If the changes were made in files, restore them from backup and move them into the child theme.

Questions to Answer Before Launching a Site on Artraz

Can I use ThemeForest Artraz without Elementor?

Technically, a WordPress theme can still display basic pages, but Artraz is presented as a product built around Elementor and custom Elementor extensions. If you disable Elementor, most of the demo structure and the convenient editing workflow lose their purpose. For a site without Elementor, it is better to choose a theme that is designed from the start for the default block editor or Full Site Editing.

Why do I not see the same homepage as the demo after installation?

The usual reason is that the demo content has not been imported, the homepage has not been assigned in Settings - Reading, the menu is not linked, or the required theme plugins are inactive. Check those four items first, then review permalinks and cache.

Do I need to enable WooCommerce right away?

No. WooCommerce only makes sense if the site is actually selling products, consultations, design packages, or interior goods. If the goal of the website is portfolio presentation and lead generation, an extra store only adds maintenance overhead. Enable WooCommerce when you are ready to configure products, cart, checkout, emails, and legal pages.

How can I change the design safely so a theme update does not wipe out my edits?

Use Artraz Options, Elementor, the child theme, and additional CSS. Do not edit parent theme files directly. If the change is small, such as aligning project cards, assign a custom CSS class to the section in Elementor and write CSS only for that class.

Is Artraz a good fit for a multilingual site?

The official listing mentions WPML Translation Support and a POT file. But real multilingual readiness depends on whether the pages, menus, builder headers, builder footers, forms, theme strings, and SEO metadata have all been translated. WPML is unnecessary for a single-language site. For two or more languages, plan separate time to validate every language version.

What should I do if an Elementor page "breaks" after caching?

First regenerate Elementor CSS and data, then clear the site, server, CDN, and browser caches. If the issue disappears when minification is disabled, turn optimizations back on one by one and test the result. Do not change the section layout until you have checked cache behavior and CSS.

Can I launch Artraz directly on my live site?

It is better not to if the site already contains content, SEO pages, or lead submissions. Demo import can create new pages, menus, and settings. It is safer to work on a staging copy first, then move the final pages, settings, and media to the main site.

When ThemeForest Artraz Is the Right Choice

Artraz is a strong option if you need a visually expressive website for architecture, interior design, a construction bureau, or a portfolio-led brand, and you are ready to work with an Elementor-based structure, demo import, Artraz Options, a builder header, and a builder footer. The theme gives you a strong starting point when your real content matches its visual language: large projects, quality photography, short headings, a dark presentation, and sharp accent details.

You should not expect the theme to solve speed, SEO, lead generation, and trust on its own. After installation, you still need to complete the full cycle: prepare content, import the demo on a test site, assign the homepage, replace projects and services, configure the header and footer, check Elementor CSS, forms, mobile behavior, cache layers, and permalinks. That is when Artraz stops being just a good-looking template and becomes a working foundation for a studio website.

If the theme still matches your scenario after that review, you can download the latest version of ThemeForest Artraz, deploy it on a test WordPress site, and work through the setup step by step using this guide. The safest readiness test is simple: visitors see real projects, understand the studio's specialization, find contact details quickly, and you can update pages without worrying about breaking the header, footer, or visual rhythm.

By OceanTheme.org Editorial Team

 

You are not logged in to post comments.