Case study – skyoffice.hr

SKY OFFICE is one of the most recognizable business complexes in the city of Zagreb, behind which stands the company OFFICIUM PARTNER d.o.o. – a client who has decided to entrust us with the planning and implementation of their website.

“Flexibility, suggestiveness, support, accuracy…”

All this and much more is what describes the the Codeart.studio team, so we commend them because they managed to turn our vision into a modern and functional website, which completes the offer of the Sky Office business facility.

Daniel Kragulj, OFFICIUM PARTNER d.o.o., skyoffice.hr

Mission objectives

Case study – skyoffice.hr - logotip

SKY OFFICE is one of the most recognizable business complexes in the city of Zagreb, behind which stands the company OFFICIUM PARTNER d.o.o. – a client who has decided to give us their trust and leave to us the planning and implementation of their website.

In addition to all the specifics that we have implemented either at the request of OFFICIUM PARTNER d.o.o., or at our discretion, cooperation with this client includes technical maintenance of their website, thus providing them with stable operation and constant technical support of our team. The fact that they entrusted us with this task speaks volumes about the success of this project.

Below, we’ll describe the most important features of the project.

Old website – not adapted to new technologies and trends

The front page of the old website, where the content was displayed incorrectly due to website’s outdated technologies

The old website was created almost 10 years ago and as such did not serve well in modern times – it was not adapted to today’s technologies and user expectations.

Our client was aware of the website’s shortcomings and the fact that it is not worth fixing it, so without much persuasion on our part, the client decided on a complete redesign.

OFFICIUM PARTNER d.o.o. had a clear idea of ​​their needs, and they knew exactly what was important to them from a presentational and functional point of view. Therefore, we were able to use our time to plan and implement project milestones very efficiently, all the time working to achieve their clear goals.

Front page of the new website

The design and marketing orientation of the cover was exclusively our task – without too much interference from the client. The design is was created by taking into account the existing corporate identity and the nature of the business of the company behind this website. As for the marketing part of the cover, we decided on an old school approach – to focus on those aspects that will show that our client is a trustworthy partner.

A very important thing to mention is that the website skyoffice.hr was realized without the use of any commercial templates, which means that its design was created from scratch. In short, this means that we created a custom WordPress theme for our client. The background interface is also largely custom-made, combined with native WordPress capabilities, but without the use of any commercial framework systems.

Homepage slider (images and text combined with video)

While planning the homepage slider, we made sure that it still looks specific and does not resemble most sliders that are used on websites based on purchased WordPress templates. We decided that the image should dominate, accompanied by a short text and video if needed.

Homepage image slider

Of course, we have provided our client with the ability to add new slides on their own.

Service groups

The most important aspects of any web presentation are concisely elaborated services and products, so skyoffice.hr is no different. Since this company is primarily engaged in renting office space and meeting and conference rooms, it was important to clearly group these services and present each of them individually. Read below on how we did it.

Prominent benefits

Every company is characterized by certain advantages, but many do not remember to highlight them, or have a hard time articulating them. We made sure that our client’s best strengths are successfully brought to the surface with a few positive notes to their story which we presented interactively on the homepage.

Benefits section on the homepage

The benefits, just like all the other content sections you see on the cover of the skyoffice.hr website, can be managed independently – it is possible to delete existing content and add new one.

Editing the Benefits section in the website’s content manager


Another way to show credibility is by highlighting those who have given you their trust so far. This is an important tactic especially when it comes to familiar brands, which our client is proud to have in their portfolio. Namely, their clients are often larger companies, of well-known brands.

Client presentation on the cover

Inner pages

WordPress’s native Gutenberg framework was used to create articles and classic internal pages (such as the About Us page) (learn more about it here), where we created stylistic adjustments to the blocks it utilizes, and also improved them in terms of responsive display.

For some other specific content (offer pages, clients, etc.), a custom framework was used – a solution that we programmed to the client’s needs. More on that below.


Due to the fact that the presentation of each individual company that rents space in Sky Office towers should be individually and specifically presented, for this purpose a special template of internal pages and a special place for editing within the CMS (programmed to measure) was created.

Unified customer pages
Editing a client page - descriptive text
Editing a client page – descriptive text
Editing a client page - contact information
Editing a client page – contact information
Editing a client page - contact information
Editing a client page – contact information

OFFICIUM PARTNER d.o.o. wants to nurture a specific relationship with their clients, so one of their demands was the possibility of logging the tenants of their premises to the website. This allows access to internal notices closed to the public.

Offer pages

Given the different types of services (offers of rooms for rent), it was important to design their presentation individually, so that all the content that will be found on these sites in the future has its own predefined place. For these purposes we created a special so-called post type (content type and internal page templates), among which the most specific is the presentation of small areas.

An example of such a site can be seen at the link 5th floor, which is characterized by the following features:

a) Interactive floor plan of the 5th and 6th floors with all the rooms planned for rent (so-called hubs)

The fields in the sketch are clickable, so if the selected office is available for rent, it is shown in green, if it is busy, it is shown in red. Clicking on the available unit opens a modal window with more information about it (hub name and specifications, followed by photos), with the possibility of clicking on the button leading to more information and the ability to send a query for the desired hub.

Interactive floor plan of the hubs
Clicking on the available hubs on the floor plan opens a modal window with more information

b) Offers search engine

Given the large number of available units for rent, and in order for the user to get to the right one as quickly as possible, we have configured a search engine that filters the offers according to price, area and type of facility. In this way, we saved the user time and accelerated the communication of our client about the presentation of the offer, which until then was mostly resolved orally.

Offers search engine with different parameters

c) Uniformed page of each individual hub

Each hub (e.g. SKY HUB 5.06) has uniform content frames, thanks to which the design remains consistent and neat. To make this possible, it was necessary to expand the standard features of the WordPress CMS. Below you can find a gallery that shows the editing options on each hub page (click on the images for a larger view).

Descriptive text
Descriptive text
Uploading an image to the page header
Uploading an image to the page header
Marking availability (available hubs are displayed as green fields on the floor plan, unavailable are red)
Marking availability (available hubs are displayed as green fields on the floor plan, unavailable are red)
Creating an image gallery
Creating an image gallery
Description of specifications
Description of specifications


The skyoffice.hr website is bilingual, and the second language framework was created using the most popular multilingual plugin on the market – WPML. The advantages of language frameworks created using this plugin lie in the fact that they are accessed through the same interface, and at the same time they can be quite independent of each other (eg content in Croatian does not necessarily correspond to content in English). A great advantage is the ability to optimize for search engines for each language separately, which meets the prerequisites for quality indexing and good ranking on local search engines.


OFFICIUM PARTNER d.o.o. is an enterprising company that has decided to make the most of its own website and attract as many future clients as possible through attractive photos and quality content. This is a young team that, in addition to the video training that we prepared at the end of the project, successfully overcame all the challenges of self-editing and running their own website, so its content is updated on a weekly basis.

Their interest in internet tools and acceptance of suggestions that came from our experience and many years of dealing with this business show that it is a flexible company willing to learn and compromise, which gives them a great strategic advantage in their work.

We are grateful for the trust they have placed in us and look forward to all future joint ventures regarding their internet marketing needs.

Are you in need of a high quality website fully tailored to your needs?

Feel free to contact us by requesting a quote (or simply with a question), via e-mail [email protected], phone +385 91 455 1066 (12 – 17h mon-fri) and ask us about our services.  We are looking forward to working with you in achieving your business goals!

Hire your Codeartist

Looking for a development of your own project?

Is your agency looking for a partner?