Spartan Sistemi: 11 Elementor Service Pages Built with the Official Elementor MCP

Security services need clear explanations that match the customer’s location and premises. I built a connected collection for Spartan Sistemi while keeping everyday content changes within its team’s reach.

Spartan Sistemi: 11 Elementor Service Pages Built with the Official Elementor MCP

Overview

This project brought service coverage, editorial ownership, and release checks together within Spartan Sistemi’s existing WordPress website.

A service business with several ways to be found

Spartan Sistemi provides alarm systems, video surveillance, and security for business premises from Belgrade, Serbia. The website needed to accommodate the different starting points of people researching those services, whether their search began with a city or a property.

The business goal was to compete for relevant searches in each location and property category. The intended sales use was equally specific: give the team an appropriate page to send when someone asked about a particular service.

That distinction shaped the assignment. A city page had to address a local service enquiry, while a property page needed to put the premises at the centre of the explanation.

I approached the work as an extension of the company’s service information. The collection needed enough structure to support those separate enquiries without becoming a set of disconnected additions.

Pages that belong to the main website

These WordPress service pages retain the full site navigation and footer. Visitors can examine a specific offer while keeping access to the wider company website, with routes to further information available around the service content.

The location coverage includes Belgrade, Novi Sad, and Niš. Alarm systems and video surveillance have their own city destinations, allowing the subject of a link to match the subject of an enquiry.

The property group covers office spaces, hospitality properties, warehouses and production halls, and buildings under construction. Each gives the business a place to present information around the setting in which its systems are needed.

A pricing reference sits alongside that service coverage in the overall delivery record. Its place in the project matters because the work began with learning how the official connection behaved before extending the approach.

Choosing automation around the client’s editor

I used Elementor MCP, the official connection through which an AI agent can create and change page components inside WordPress. The site owner must enable Elementor’s Atomic editor, also called V4, before that connection can perform this work.

For this assignment, the relevant benefit was the kind of structure left behind. The build method could produce components in the same visual editing environment the client would use afterward.

That made the choice more specific than adding AI to a website project. I needed an approach compatible with both repeated construction and the client’s future responsibility for the content.

An Elementor developer’s decision here concerns the entire working life of a page. A quick assembly method has limited value if the resulting arrangement creates an unnecessary obstacle to the next routine update.

Establishing the location pattern

Alarm systems Belgrade became the pattern for the location collection. Its structure contained 179 native, editable elements and seven native FAQ items, giving subsequent work a concrete example to follow.

The first location build therefore had a different responsibility from later pages. It established how the supplied material could be arranged inside the editor and how that arrangement worked within the existing site.

I used the completed example to write a build brief. Later city assignments could refer to that shared instruction instead of trying to reconstruct the approach from a short request.

For the client, this meant the series had a defined starting point. There was a reference against which I could assess a subsequent page’s structure, rather than treating every delivery as an unrelated interpretation.

Giving the complete service explanation room

The supplied Word document and the design image were separate inputs. The document held the final Serbian wording, while the image showed the intended presentation.

On the pattern page, I kept all 75 paragraphs of that copy. The abbreviated text visible in the image did not replace the fuller material written for the client.

That decision mattered because an attractive design reference does not establish how much information a business intends to publish. Here, the build needed to accommodate the actual explanation rather than fit only the shorter visual example.

My responsibility was to make those inputs work together. The finished structure had to carry the supplied service detail while retaining a layout that could be examined at different screen widths.

Dividing the work without dividing responsibility

Claude and Codex agents assembled later city pages from short Trello cards pointing to the brief. They could carry out those assignments unattended because the instructions referred to an established approach.

I remained responsible for reviewing and correcting each delivery. The agents provided execution capacity; I made the decisions about whether their output matched the assignment and what needed repair.

That division is relevant to a business owner commissioning a collection of related pages. It identifies where production work can be delegated and where someone still has to judge its suitability for the actual website.

My role also included investigating conflicts with the theme, resolving layout problems, and checking behaviour. Those activities connected the automated construction to the conditions under which the client’s visitors would encounter it.

The delivery sequence

The complete scope comprised 11 pages built between September 26 and October 12, 2026. The chronology below distinguishes the initial reference, the city coverage, and the property group without compressing the whole assignment into a single build session.

Each entry points to the delivered destination. Together they show the actual scope of the collection, including work outside the faster batches highlighted later.

What the faster batches demonstrate

Seven service pages were built across two working days: the three city builds on October 2 and the four property builds on the morning of October 12. These were separate dates with other work between them.

The property batch took less than an hour to build. That describes a particular stage after the reference work, rather than the time needed to scope, investigate, check, and release an unfamiliar project.

For a buyer, the useful point is the relationship between preparation and repeated delivery. The build brief and working pattern gave subsequent assignments a clearer basis, so each did not begin with the same unresolved questions.

I would evaluate that pace in the context of the collection. It shows what became possible on this site once the approach was established, without turning one batch into a promise for every future brief.

Moving from construction to release

Every page originated on staging and was checked there before being pushed live. The development environment gave the work a place to be examined before it became part of the public site.

This sequence applied to familiar layouts as well as the first example. Similarity to an earlier page did not establish that the next one contained the right material or behaved correctly.

For a marketing director, staging provides a concrete version to inspect. It replaces an abstract description of what will be built with a page whose content and presentation can be assessed.

For an IT or digital leader, the same sequence separates an automated construction task from a public release. The connector’s ability to save something did not determine whether that thing was ready for visitors.

Checking the page people actually receive

The baseline checks used five widths: 375, 820, 1200, 1440, and 1920 pixels. I inspected the normal published address at those widths so the review covered the page as part of the functioning website.

Content checks confirmed the presence of every copy block. Interaction checks covered opening and closing each FAQ, while the technical inspection looked for horizontal scrolling and JavaScript errors.

Later pages received broader coverage across 19 screen sizes in Chrome and Safari’s WebKit engine. That work included actual taps on the mobile menu, extending the review beyond a static view of the layout.

These checks addressed different ways a page could disappoint a visitor. Complete text, usable controls, and a layout that fits the available screen each needed attention before I could accept the delivery.

Connecting the collection through the footer

I added the “LOKACIJE” city list and the “PO VRSTI OBJEKTA” property block to the footer. Those links make the new destinations reachable from every page on the site.

This gave the collection an explicit place in the website’s navigation. A visitor could encounter the location or property routes while browsing elsewhere, without needing to arrive through a search result.

The arrangement also makes the site’s service coverage visible as a group. Geography and premises remain separate organising ideas, so the footer does not require the visitor to interpret one mixed list.

I treated that connection work as part of delivery. Building an address and giving it a sensible place in the surrounding website are different tasks, and both mattered to this assignment.

What the team can change afterward

The client can work with the delivered elements through Elementor. A service description or FAQ remains part of the page’s editable structure, so routine content maintenance does not require operating an AI agent.

That distinction leaves the business with an ordinary editorial route after the construction work. The tool used during delivery does not have to become a new prerequisite for changing the wording.

Structural changes and technical styling still deserve appropriate care. The benefit is that the content itself lives in components the team can select and edit, while broader layout changes can receive technical attention.

I regard that division as part of a usable handover. A business should be able to understand where its ongoing editing happens and which kinds of changes call for technical help.

Reading the outcome accurately

The documented outcome is a delivered service collection and the implementation work behind it. Traffic, search positions, enquiries, and conversion changes have not been measured for these pages.

The SEO objective therefore remains distinct from an observed commercial result. Publishing a relevant destination creates something the business can use and evaluate, but it does not establish how much demand that destination will capture.

If you are considering a similar assignment, I can examine the relationship between your page scope, existing site, and intended editing process. Discuss your service page project: https://dejanmarkovic.com/lets-talk/

Client: Spartan Sistemi

Location: Belgrade, Serbia

Visit Project

The Challenge & Solution

The difficult part was making new page structures behave predictably inside an established site without handing the client a maintenance problem.

Respecting the Serbian source material

The content constraint was fidelity to final Serbian copy supplied in Word. A visual reference with shorter wording could have led the build toward a page that looked appropriate while carrying an incomplete explanation.

I treated the text source as the authority for what belonged on the page. The layout had to respond to that material, including the space it required, rather than silently deciding which passages were expendable.

For a business commissioning technical implementation, that is a meaningful boundary. Decisions about removing service information should not occur as an accidental consequence of translating a design into page elements.

Resolving the theme’s control over text

The existing theme imposed fixed sizes and colours on headings and paragraphs through global CSS. That prevented the new components from displaying their assigned appearance and made their editor settings an incomplete guide to the result.

I adjusted two global rules to exclude the new elements. The correction addressed the source of the conflict instead of building a growing set of individual text overrides.

The client’s design could then be judged on its intended presentation. Identifying which rule controlled the output was the necessary step before deciding whether the new page itself needed a different style.

Making the first stylesheet appear

A newly built page did not immediately trigger the stylesheet rebuild needed to display its styling. The generation happened after an edit, leaving creation and visible presentation out of step.

I added a small editing call after construction to trigger that step. This resolved the missing appearance without changing the visual brief or treating the initial render as proof that the design could not be implemented.

For delivery, that behaviour created an additional acceptance condition. I needed to confirm that the page’s presentation had actually been generated before assessing the quality of the layout.

Keeping corrections from undoing earlier work

A change to padding on one side could reset the values on the other sides. An apparently narrow spacing correction therefore had the capacity to disturb parts of an element that were already satisfactory.

I supplied the whole style again whenever adjusting it. That made the intended complete state explicit and removed reliance on values the connector might otherwise discard.

There was a separate coordination risk when edits overlapped. Because each operation read and saved the entire page, I ran edits sequentially to prevent one completed change from being overwritten by another.

Preserving the details the connector omitted

Some requested styling disappeared without an error, including partial heading colours, decorative CSS lines, and a class attached to an inline span. An accepted instruction could therefore leave a visual detail absent from the page.

I recreated those treatments with separate small elements and narrowly scoped CSS. The solution kept the intended details while recognising that the connector did not preserve every kind of instruction.

For the client, this was a question of delivery fidelity. A limitation in the construction route needed a considered implementation response, rather than silently becoming a change to the supplied design.

Distinguishing a preview from the public site

The production environment used caching, while draft preview links had a five minute lifetime. An early unstyled draft looked concerning, but the normal page displayed its styling correctly after publication.

I made the actual published address the deciding evidence when investigating that behaviour. A preview could help inspect work in progress, but it could not establish a fault in what the public site delivered.

That distinction established the rule for investigating apparent styling faults. On an established business website, the responsible setting must be identified before altering configuration to address an apparent rendering issue.

Accounting for the existing fixed header

The site’s fixed header obscured the top of the initial hero. The new section needed to be evaluated in the space created by the surrounding site, including navigation that remained in position above it.

I introduced offsets scoped to the affected page to correct that relationship. This addressed the overlap where it occurred rather than turning a local layout issue into a general change across the website.

The problem illustrated why a page cannot be accepted from its component structure alone. Existing site elements can change what a visitor sees even when the newly created section contains the expected material.

Keeping specialised CSS with its own page

Page-specific styling had accumulated in a common file. I reorganised 249 rules into individual page files so each destination received only the CSS intended for it.

This made the relationship between a page and its special presentation more explicit. A future adjustment could be traced to the relevant page’s rules rather than starting in a shared collection of unrelated exceptions.

That work supported the technical side of ownership alongside the visual editor. The content team’s editing route and the developer’s styling route each needed a comprehensible place in the delivered site.

Looking beyond the build interface

These constraints required decisions about the existing website, the supplied material, and the reliability of the editing process. None could be resolved simply by asking an agent to produce another version.

For the technical account of the connector and its behaviour, read my field report: https://dejanmarkovic.com/blog/elementor-mcp-service-pages-case-study/. For help establishing the official connection on your own WordPress site, explore WordPress MCP setup: https://dejanmarkovic.com/services/wordpress-mcp-setup/

Challenge & Solution
Dejan Markovic
Dejan Markovic WordPress Architect
Best experience I've had to date with someone from Codeable. Dejan and his team jumped on a critical project over a weekend and had it sussed and patched on a Sunday; by Monday evening a fix was fully implemented. The team exceeded my expectations and I will be using them for all of my development needs going forward.
Eric R. | CEO & Founder, carsandcoffeeevents.com