JS Loqo is a versatile and visually stunning template designed for digital agencies operating on the Joomla platform. This template offers a complete solution for building a professional and modern website that showcases a digital agencys services and portfolio. With its sleek and contemporary design, JoomShaper Loqo creates a captivating online presence that engages visitors and leaves a lasting impression.

Template Version: 1.0.2
SafariJoomla template JoomShaper Loqo
 

Template Description

The template for Joomla, this template, comes with a range of features and functionalities that make it a powerful tool for any digital agency. Its responsive design ensures that the website will adapt seamlessly across different devices and screen sizes, providing an optimal browsing experience for users on desktops, tablets, and mobile devices.

The templates intuitive user interface enables easy customization, allowing users to personalize their website without the need for advanced coding knowledge. With a wide array of customization options, including color schemes, typography settings, and layout variations, digital agencies can effortlessly create a unique and tailored online presence that aligns with their brand identity.

JS Loqo offers a variety of pre-built page layouts and templates that cater to different needs and purposes. This template includes dedicated sections to showcase services, highlight portfolio items, display team members, and provide contact information. These ready-to-use templates can be easily customized and populated with content, enabling digital agencies to quickly establish their online presence and present their offerings professionally.

This template also prioritizes user experience by integrating various features designed to enhance website functionality. Built-in components such as social media integration, contact forms, Google Maps integration, and smooth scrolling contribute to a seamless browsing experience for visitors, making it easier for them to interact with the website and contact the agency for potential collaborations or inquiries.

Moreover, JS Loqo ensures optimal performance and fast loading times, ensuring that visitors do not encounter any delays or frustrations while browsing the website. This not only enhances the user experience but also contributes to improved search engine rankings, ultimately driving more organic traffic to the agencys website.

In conclusion, the JoomShaper Loqo template for Joomla is a versatile solution for digital agencies seeking to establish a strong online presence. With its visually stunning design, user-friendly customization options, and extensive features, this template empowers digital agencies to create a professional and engaging website that effectively showcases their services, portfolio, and unique brand identity. Whether its attracting new clients or establishing credibility within the industry, this template provides the necessary tools to succeed in the digital landscape.

Template Features:

  • Compliance with W3C XHTML 1.0 Transitional and W3C CSS Valid standards.
  • Support for JavaScript and CSS scripts compression to speed up the website performance.
  • Thanks to the use of the latest versions of PHP and MySQL, the template code is current and secure.
  • A large number of positions for placing modules and several color suffixes.
  • Several built-in color schemes of the template for individual design of your project.
  • The template supports Google fonts and RTL/LTR languages.
  • Multiple menu types, Mega Menu, Dropline Menu, CSS Menu, with smooth animation effects.
  • Integrated support for popular extensions: Helix v3, SP Page Builder Pro, expanding the functional capabilities of the site.
  • QuickStart demo package with support for CMS version Joomla! 6.x.

Specifications:

Release date: 01-04-2024
Last updated: 10-11-2025
Type: Premium
License: GPL 
Subject: Business Hi-Tech & Software
Compatibility: J4.x J5.x J6.x
QuickStart: Joomla! 6.x
Color
schemes:
Developer: JoomShaper

Rating:
4.3719008264463 1 1 1 1 1 (121 Votes)

Download by subscription!

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

Share with your friends!

 

General Features:

 

Powerful Framework

The framework provides an easy access to hundreds of powerful features and tools for more flexible customization and create amazing websites based on Joomla.

Responsive Design

Fully flexible layout template perfectly adapts to the users browser width. And great is displayed on your PC, iPad, iPhone and other mobile devices.

HTML5 & CSS3

Template has a wide range of benefits, since only uses modern web technologies: HTML5, CSS3, LESS, JQuery and Bootstrap 4 & 5.

Quick Start

Install Joomla! website containing demo content, styles and preconfigured extensions and get started in minutes.

Cross-Browser

Impeccable work in all modern browsers, such as Firefox, Chrome, Safari, Opera, Netscape, Yandex Browser and Internet Explorer 10+.

SEO optimization

Code template database is fully optimized to ensure good indexing and the presence of your site by Joomla Search Engine.

Guide to Setting Up JoomShaper Loqo for a Joomla Digital Agency Website

JoomShaper Loqo is best treated not as a finished picture you can install and forget, but as a set of connected layers: Joomla, Helix Ultimate, SP Page Builder Pro, SP Simple Portfolio, menus, modules, template positions, and demo pages. In this guide, we will break down how to turn Loqo into a working agency website: prepare the installation, choose between Quickstart and a clean template install, set up the homepage, portfolio, menus, modules, responsive behavior, and final checks.

This guide does not repeat the short product description at the top of the page. What matters here is the practical logic: where to find the right screen in the Joomla admin panel, which settings to check first, how to preserve the demo look after replacing the content, and why certain blocks may fail to appear on the pages where you expect them.

Loqo is built around the bold visual style of a digital marketing agency: oversized typography, a red-orange accent, a neutral background, service blocks, portfolio, testimonials, blog, and a contact flow. That means template setup is not just about colors and a logo. You need to preserve the rhythm of the sections, replace the demo copy and images properly, and then verify that the pages, menus, and modules work together as a single Joomla system.

Cover image for the JoomShaper Loqo guide with the visual style of the Joomla template
Your first reference point for Loqo: the demo look, the color palette, the oversized typography, and the relationship between the template, Joomla settings, and the finished page.

What Loqo Is Designed For and Where It Fits Best

Loqo is designed for an agency website, studio, marketing team, SEO specialists, branding group, or small consulting company that needs to present services, projects, case studies, a blog, and a contact form quickly. You can see that in the demo homepage structure: a large hero section with a message, a project launch button, a video section, counters, a services block, a project showcase, testimonials, blog posts, and a closing call to action.

The real value of the template is not any one button or color scheme, but the ready-made composition for selling services. It helps you build a page where the visitor first understands your positioning, then sees your areas of work, then reviews the portfolio, and finally gets a clear path to contact you. If your site needs to function as a digital agency landing page, Loqo gives you a strong starting structure.

That said, the template is not a fit for every case. If you need a product catalog, a complex user dashboard, a news portal, a learning platform, or a site with heavy filtering, Loqo will require too much rework. Its strength is the visual presentation of services and project work, not specialized business logic.

Who This Template Works Well For

  • An agency that sells services through case studies, portfolio pieces, a blog, and a contact form.
  • A design or branding studio where large-scale visuals and accent typography matter.
  • A marketing team that needs to launch a Joomla site quickly and edit pages through SP Page Builder.
  • A webmaster who wants to keep the demo structure while replacing text, images, menus, and portfolio items for a client.

When It Makes More Sense to Look Elsewhere

Loqo may be more than you need if the site is built around a large catalog, complex user roles, dashboards, booking, or online payments. Those projects are better started with a template or extension where that logic is already core to the product. Otherwise, you will not be fighting the design, but the fact that Loqo is fundamentally structured around presenting services.

Practical takeaway: choose Loqo if the site needs to sell an agency's expertise through a bold homepage, projects, and fast contact. Do not choose it just because the hero section looks attractive if the real job of the site belongs to a completely different website type.

What the Template Includes and Which Dependencies Matter

The official page and documentation indicate that Loqo is tied to Helix Ultimate, SP Page Builder Pro, and SP Simple Portfolio. That means the site lives across several layers after installation. The template handles the overall visual framework, Helix provides layout and position settings, SP Page Builder controls pages and sections, and SP Simple Portfolio manages the project showcase.

This split works well if you understand where to look for a specific change. The logo, basic layout, and module positions belong to the template and Helix settings. Homepage content is edited in SP Page Builder. Portfolio projects are managed in SP Simple Portfolio. Menus, module assignments, and access permissions remain standard Joomla territory.

The Layers People Most Often Confuse

Where to find Loqo settings after installation
What you need to change Where it is usually configured What to check after saving
Hero section, services, CTA, homepage sections Components -> SP Page Builder Pro -> Pages Open the homepage and confirm the changes appear in the correct block.
Positions, grid, header, hiding columns on devices System -> Site Template Styles -> Loqo style, then the Helix settings Check desktop, tablet, and mobile widths for layout overlap issues.
Portfolio, tags, filtering, and project items Components -> SP Simple Portfolio Check the project list, filters, project page, and links.
Showing a module on a specific page Content -> Site Modules, then the menu assignment tab Open the page where the module should be visible and the page where it should be hidden.

If a change does not work, do not rush to edit the template files. First identify the layer. Very often the issue is not in Loqo at all, but in the fact that someone is editing a module while the needed block was built in SP Page Builder, or editing a page in Page Builder while the portfolio output actually comes from the component.

Preparation Before Installation: What to Check First

Before installing Loqo, it is worth spending time on preparation. This is especially important for a Joomla template that comes with Quickstart, because Quickstart is not a regular extension for an existing site. It is a full demo site package with the CMS, the template, demo data, components, and settings. If you try to install that package over a live site as if it were a regular template, the result will be wrong.

First, decide which path you need: a clean template install on an existing site, or Quickstart on a fresh installation. For a live site, it is usually safer to install the template and required extensions separately, then move pages and modules over gradually. For a new project where getting the demo structure quickly matters most, Quickstart on a clean domain, subdomain, or local copy is more practical.

Mini Checklist Before the First Launch

  • Create a backup of the site and database if you are not working on an empty installation.
  • Check that your Joomla, PHP, Helix Ultimate, SP Page Builder, and SP Simple Portfolio versions meet the current package requirements.
  • Choose a test environment: a local server, a subdomain, or a separate staging site.
  • Prepare your own images, because demo photos in Quickstart may be replaced with placeholders due to licensing.
  • Collect real copy for services, case studies, testimonials, the blog, and the form so the site does not launch with demo content.
  • Write down the menu structure in advance: Home, Works, About, Blog, Services, Contact, or your own equivalents.

For a safe migration workflow, it helps to create a separate template style for testing. Joomla lets you assign template styles to menu items, so you can test Loqo on a hidden page without changing the entire public site at once. This is especially useful if the site is already indexed and you cannot suddenly replace the homepage.

Do not mix up Quickstart with updating an existing site. Quickstart is for deploying a new demo-based site. For an active project, use a backup, a test environment, and step-by-step template assignment to separate menu items.

Installation: Quickstart, Clean Template, and the First Check

Loqo has two practical installation scenarios. The first is Quickstart, where you deploy a ready-made demo package and get a structure close to the official example. The second is installing the template on an existing Joomla system where pages, modules, and content are created separately. Both are valid approaches, but they solve different problems.

When to Choose Quickstart

Quickstart is convenient when the project starts from scratch and the client wants to see a site that resembles the demo early in the process. In that case, you deploy the package in a clean environment, go through the Joomla installation, connect the database, remove the installation folder, sign in to the admin panel, and get ready-made pages, menus, modules, and demo settings.

After installing Quickstart, do not publish the site immediately. First replace the images, text, contacts, links, form email addresses, policy pages, and demo projects. One important point: demo images and text are often not meant to be used as final content. Even if the structure stays intact, the content needs to be yours.

When to Choose a Template Install Without Demo Data

If the site already exists, a clean template install is usually safer. You install Loqo as an extension, verify the required dependencies, create or assign a template style, and then move the sections over one by one. This path takes longer, but it avoids the risk of overwriting the site structure with demo data.

Right after installing without demo data, check three things: whether the Loqo style appears in the list of site templates, whether the necessary components are available under Components, and whether you can assign the template to a specific menu item. If one of those pieces is missing, it is better to stop and review the package, compatibility, and install log instead of continuing blindly.

First Check After Installation

  1. Open the Joomla admin panel and confirm the template installed without errors.
  2. Go to System -> Site Template Styles and find the Loqo style.
  3. Open the homepage on the public site in both a normal and a private browser window.
  4. Check that the menu, logo, hero section, service sections, portfolio, and footer appear in the expected order.
  5. Clear the Joomla cache and browser cache if the appearance does not change after saving.

The short version is simple: an installation is successful not when the package appears in the extension list, but when you can open the public page, edit the correct layer, and safely roll back to the previous setting if the result is not right.

Installation and initial validation map for JoomShaper Loqo in Joomla
The diagram helps you choose the installation path: Quickstart for a new site, or a clean template for an existing project with test-only assignment.

Configuring the Homepage in SP Page Builder

The Loqo homepage in Quickstart is built in SP Page Builder Pro. The documentation says you should find it under Components -> SP Page Builder Pro -> Pages, then edit it through the admin panel or the visual editor. This is an important difference from a regular Joomla article: if you open only the Home menu item, you will see the page assignment, but not the full section structure.

Do not edit the homepage mechanically from top to bottom. Work by content zones instead. Start with the main message and CTA, then the services, then the portfolio, then testimonials, the blog, and the final call to action. That makes it easier to preserve Loqo's rhythm and keep the composition of the large typography intact.

Hero Block and First Screen

In the Loqo demo, the first screen is built around a large keyword, a short promise, and a Start project button. For a real site, replace not only the text but also the purpose of the button itself. If the agency sells consultations, the button can lead to the contact form. If the main path is the portfolio, point it to the projects page. If the site is used as a personal brand showcase, it may make more sense to link to the services block or inquiry form.

Check the hero section at mobile width. Large lettering and long Russian phrases can break the grid, and long English phrasing can do the same if you are not careful. If the heading spills outside the container, do not scale down the whole site with random CSS. It is better to shorten the phrase, move part of the meaning into the subheading, or split the text across two lines in the section settings.

Services, Counters, and Trust Signals

The services block in Loqo works best when each card answers the visitor's question: what do you do, who is it for, and what is the next step. Do not leave abstract items like "Development" with no explanation. For an agency, more useful labels are things like site audit, branding, SEO strategy, ad campaign launch, service landing page, or Joomla site support.

Use counters carefully. If you do not have verified numbers, replace them with facts you can stand behind: years of team experience, number of service areas, project types, or regions you work in. Do not add impressive numbers just because the demo has four numeric blocks. Trust is built on verifiable content, not on keeping demo numbers in place.

Testimonials, Blog, and the Contact Flow

Testimonials in the template should be real, or removed until you have them. The blog is useful if the agency is actually ready to publish expert content. If there are no plans to maintain a blog, it is better not to leave an empty section on the homepage. In Joomla, you can handle that through SP Page Builder: hide the section, replace it with case studies, or add a short "how we work" block instead.

Check the contact block separately. The demo may include a nicely styled form, but on a real site you need to make sure the fields match the task, notifications go to the right address, and the consent text and privacy policy are no longer demo placeholders.

Editing the Loqo homepage through SP Page Builder Pro
The homepage is edited as a set of meaningful sections: hero, services, portfolio, testimonials, blog, and the contact path.

Portfolio and Project Showcase with SP Simple Portfolio

One of the most useful parts of Loqo is the project showcase. In the demo, it displays projects with images, titles, categories, and links. The documentation connects this workflow to SP Simple Portfolio, which supports tags, different thumbnail styles, filtering, lightbox, images, video, and layout settings.

For an agency, the portfolio should not be just a gallery of attractive images. Each project should explain the task, the team's role, the outcome, and the context. If the component allows a detailed project page, use it as a mini case study. If the homepage shows previews only, make sure the titles and categories help visitors understand your specialization.

How to Prepare Projects

  1. Open Components -> SP Simple Portfolio.
  2. Create or edit portfolio items, replacing demo titles with real projects.
  3. Organize tags by meaning: branding, SEO, landing pages, Joomla, advertising, strategy, or other service areas.
  4. Upload images in the correct size and with a consistent visual style.
  5. Check that the filters do not create empty categories.
  6. Open the public page and confirm that the cards, animation, and lightbox do not conflict with caching or optimization.

What Matters for SEO and Usability

SP Simple Portfolio may support clean URLs and multilingual setup, but that does not replace a solid content structure. Each project benefits from a human-readable title, a short description, meaningful image alt text, and a link to a full case study if one exists. If the portfolio is used only as a visual gallery, it helps with impression, but it is less effective as a source of search traffic.

Do not overload the homepage with dozens of projects. For the first portfolio view, it is enough to show a strong selection and move the full list to a separate page. That preserves speed, visual rhythm, and focus on the call to action.

Template Styles, Module Positions, and Menus in Loqo

With a Joomla template, it is critical to understand the relationship between the template style, module positions, and menu assignment. Loqo uses Helix Ultimate, and the Helix documentation for Layout Builder explains the grid, rows, columns, positions, device-based visibility, and header setup. This is not just a "design panel." It is the layer that determines where Joomla can output modules and how they behave at different widths.

In Loqo, the header, off-canvas navigation, blocks around the component area, footer, and positions used for menus, contact blocks, social links, or extra CTAs are especially important. If a module does not show up, the cause is usually in one of three places: it is published in the wrong position, not assigned to the needed menu item, or hidden by access permissions.

How to Change the Template Style Safely

Open System -> Site Template Styles and make a copy of the Loqo style before making major changes. You can keep one style as the working version and use the second one for experiments. Then assign the test style only to a hidden menu item or a separate page. That lets you validate the header, layout, and module positions without risking the entire site.

Checking Positions

Joomla and Helix let you work with module positions. In standard practice, you first enable the position preview, then open the page with the ?tp=1 parameter, review the available zones, and only then publish the module. On a production site, position preview should be disabled after testing because it is meant for diagnostics, not ongoing use.

Menu Assignment for Modules

In Joomla, a module can be visible on all pages, hidden everywhere, shown only on selected menu items, or shown everywhere except selected menu items. That matters a lot in Loqo: the footer and main navigation are usually needed globally, while a promo block or sidebar module is better shown only on the services, blog, or contact page.

Module positions and menu assignment in the Loqo template for Joomla
The Joomla module position -> menu assignment -> frontend result chain helps you quickly understand why a module appears or disappears.

Demo Pages, Menus, and a Practical Editorial Workflow

The live Loqo demo includes more than just the homepage. The navigation shows Works, About, Blog, and a set of internal pages under Pages: services, contact, login, registration, error, coming soon, and FAQ. On a real site, this is not just a list of links, but a map of user intent. Visitors arrive with different goals: to review projects, understand the team, read expert content, send an inquiry, or find an answer to a common question.

After installation, do not remove demo pages at random. First decide which routes the site actually needs, which ones can be hidden, and which ones are worth keeping as drafts. If a page is no longer needed, it is better to unpublish it or remove it from the menu than to leave it live with demo text. For pages like Login and Registration, the decision depends on whether the site has a real user flow for them. If visitors do not need to sign in, those items should not distract from the inquiry path.

How to Bring the Menu in Line with the Real Site Structure

Loqo menus are best configured after you define the role of each page. The homepage handles first contact and positioning. Works provides proof. About explains the team and approach. Blog supports expertise. Services explains what you do. Contact closes the inquiry. If a page does not serve one of those roles, its place in the menu should be reconsidered.

  1. Open the site menu and check which items are actually published.
  2. Make sure the Home item is assigned as the homepage and linked to the correct SP Page Builder page.
  3. Check that Works points to the portfolio, not to an empty demo section.
  4. Keep Blog only if you already have at least a few real posts or a clear editorial plan.
  5. Remove utility pages from the public menu if users do not need them.
  6. Check the off-canvas menu separately, because the mobile menu may use a different module or position.

After changing the menu, check the breadcrumbs, active items, and links inside CTA buttons. A common mistake is updating the main menu but leaving an old link in the hero block or footer. Visually, the site looks finished, but the button still points to a demo page that no longer matches the structure.

Editorial Workflow for a Team

If Loqo is being configured by a team rather than a single webmaster, agree on an editing workflow. A designer may change images and sections, a content editor may handle copy and blog posts, and the Joomla administrator may manage menus, modules, cache, and permissions. Without that separation, it is easy to create conflicts: one person hides a section in Page Builder, another searches for it as a module, and a third clears the cache and assumes the change disappeared.

A practical order is this: first page structure, then text, then images, then menus and modules, then responsive checks, and only after that cache and optimization. If optimization is turned on before content is finished, troubleshooting gets harder. If text is edited after the final responsive pass, longer phrases may break the layout again.

For team work, keep a simple change log: which page was edited, which layer was affected, and what still needs to be checked. With a Joomla template built around Page Builder, that often saves more time than trying to guess where a missing block actually went.

Localization and a Multilingual Launch

Loqo can be prepared for a Russian-language or multilingual site, but localization is not just a matter of translating the hero heading. You need to go through every place where the demo leaves English labels: menus, CTA buttons, forms, system messages, portfolio tags, blog categories, footer, policy pages, and email notifications. Some text lives in SP Page Builder, some in Joomla articles, some in modules, and some may come from extension language files.

For a single-language Russian site, it is enough to replace the visible content carefully and test the forms. For a multilingual project, there is one more layer: content languages, menus for each language, page associations, language modules, and translated portfolio items. If that layer is configured carelessly, a user may jump from a Russian page to an English contact page or see a portfolio without the correct language version.

What to Translate First

  • Menu items and page titles, because they define the primary navigation.
  • The hero block, CTA, and contact forms, because they directly affect inquiries.
  • Services and portfolio content, because they explain your expertise.
  • System form labels, post-submit messages, and email notifications.
  • The footer, policy pages, and utility pages, which are often forgotten after a demo import.

When to Use a Language Override

If the text comes from Joomla or an extension and cannot be edited on the page itself, use Joomla language overrides instead of editing files. That is safer for updates and easier to support. A language override is appropriate for system strings, buttons, messages, and labels that repeat across the interface. But if the phrase is located directly inside a Page Builder section, it is usually easier to replace it in the page editor.

For testing, open the site in a private window, switch languages, go from the homepage to the form, and submit a test inquiry. Then check the email. In a multilingual project, it is important that the message not only arrives, but also contains clear fields, the correct language, and the right sender address.

An SEO Detail for Translated Pages

Do not copy the same meta text across all language versions. Services, case studies, and CTAs should be written for the specific audience, not translated mechanically. If the translation is not ready yet, it is better to hide that language version of the page temporarily than to publish a half-empty copy with demo text. That affects both user trust and indexing quality.

Responsive Behavior, Speed, and Visual Consistency

Loqo relies visually on oversized typography, generous spacing, and a high-contrast accent. That is one of the template's strengths, but it also creates risk when you replace the demo content. Long headings, images with different aspect ratios, and unprepared logos can break the balance of the sections. That is why responsive testing should happen not just at the end, but after every major change.

Helix Layout Builder includes settings for the grid and responsive column behavior. The documentation describes breakpoints and the ability to hide rows or columns on specific devices. Use that carefully. If you hide an important block on phones, it still remains in the HTML, but the visitor will not see it. For SEO and accessibility, it is usually better not to hide important meaning, but to rebuild it in a more compact form.

What to Check on Mobile Screens

  • The logo should not overlap the menu or button.
  • The large hero heading should wrap without causing horizontal scrolling.
  • CTA buttons should remain easy to tap and not collapse into narrow strips.
  • Service and portfolio cards should preserve a clear reading order.
  • The off-canvas menu should open, close, and display the correct items.
  • The contact form should still work after CSS and JavaScript optimization.

Performance Without Overpromising

You cannot guarantee that a single template will automatically make a site fast. Performance depends on images, caching, hosting, extensions, fonts, and third-party scripts. For Loqo, portfolio and hero images matter especially. Compress your own images before publishing, do not upload camera photos as-is, and test the page again after turning on optimization extensions.

If animations, menus, or the form disappear after minification or file combining, temporarily disable the problematic optimization, clear the cache, and test again. Restore stable behavior first, then come back to performance tuning. That is safer than trying to fix a visual issue on top of aggressive optimization that is still enabled.

Practical Example: Building an Agency Homepage with Loqo

Below is a scenario you can repeat on a test copy of the site. It is not tied to one specific niche, but it shows the logic of using Loqo: replacing the demo agency structure with a real visitor journey from the first screen to the inquiry.

Goal

You need a homepage for a digital agency: a strong opening screen, 3 to 4 service areas, a selected portfolio, a trust block, a blog or expert section, and a contact CTA. The result should feel like a cohesive page, not like a demo where only the logo was changed.

Preparation

  • Loqo is installed in a test environment or deployed through Quickstart.
  • SP Page Builder Pro, Helix Ultimate, and SP Simple Portfolio are available.
  • Real copy for the hero, services, portfolio, and form is prepared.
  • Your own project images that can be used on the site are uploaded.

Steps

  1. In SP Page Builder Pro, open the page assigned to the Home menu item.
  2. Replace the main heading with a short agency promise. If the phrase is too long, move part of it into the subheading.
  3. Change the first-screen button so it leads to the contact form, portfolio, or services block.
  4. In the services block, keep only the areas the team actually provides.
  5. In SP Simple Portfolio, create 4 to 6 projects and assign meaningful tags to them.
  6. Go back to the homepage and confirm that the project showcase displays the correct work.
  7. In the menu module, check the Works, About, Blog, Services, and Contact items.
  8. In the template style, verify the header, off-canvas menu, and footer.
  9. Clear the cache and open the site in a private window.

Checking the Result

On the public page, it should be clear who you are, which services you offer, which work you showcase, and where to click to get in touch. The portfolio should filter without empty categories, the menu should point to real pages, and the form should not contain a demo email address or placeholder text.

Quick test: ask someone who has never seen the admin panel to open the page and, within 30 seconds, answer what the agency does, where to view the work, and how to send an inquiry. If they cannot do that, the problem is not the template, but the content structure.

A Detail That Often Gets in the Way

After replacing the images, card heights and the section rhythm may change. If the portfolio cards become uneven or the images crop poorly, prepare thumbnails in a consistent aspect ratio and check the SP Simple Portfolio settings. Do not try to fix every card with random CSS while the source images still have mismatched proportions.

Practical Ways to Use Loqo on Real Websites

Loqo can be used for more than a generic marketing agency site. Its structure fits several related scenarios, as long as you do not invent extra functionality and instead work with what is already there: SP Page Builder pages, portfolio, blog, menus, CTAs, and module positions.

Agency Focused on Case Studies

Make the portfolio the main proof of expertise. On the homepage, keep 4 to 6 strong projects, and use a dedicated Works page as a case study catalog with tag-based filters. In each case study, show the task, the team's role, and the outcome. The test is simple: a visitor should be able to get from the hero section to the work in one click.

Branding or UI/UX Studio

For a design studio, visual fragments, oversized typography, and clean transitions between sections matter. Loqo already has those built in, so it is better not to overload the first screen with long text. Use the hero area for positioning, the services block for directions, and the portfolio for visual proof. Make sure the images do not feel like a random photo gallery.

SEO or Content Agency

If the agency sells SEO and content services, the blog becomes a working section rather than a decorative one. On the homepage, you can show 2 to 3 recent articles, and keep a dedicated Blog item in the menu. At the same time, do not promise search growth without context. It is better to show expert articles, checklists, deep dives, and case studies.

Small Consulting Team

For consulting, you can reduce visual noise and put more emphasis on trust: the team, the process, testimonials, contact details, and a short form. Loqo supports that approach, as long as you do not overload the portfolio or keep aggressive marketing copy that does not match the service.

Loqo usage scenarios for an agency, studio, SEO team, and consulting business
One template can support several related scenarios if you preserve the real functionality: pages, portfolio, blog, menu, and the contact path.

Safe Improvements Without Editing the Template Core

You do not need to start customizing Loqo by editing template files. Most tasks can be handled through Helix settings, SP Page Builder, Joomla modules, and careful custom CSS. Editing the template core makes updates harder and your changes may be lost the next time the package is updated.

A safe customization should be small, reversible, and easy to understand. For example, if the buttons in the hero section on a Russian-language version feel too cramped because the text is longer, you can add a custom section or button class in SP Page Builder, then place the CSS in the template's custom field or the standard custom CSS area if your Helix version provides one.

Example CSS for a More Stable CTA

First, add a custom class to the section or button in SP Page Builder, for example loqo-cta-check. Then add a small CSS snippet. It does not depend on the template's internal classes and will not break updates, because you control the custom class yourself.

.loqo-cta-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 28px;
  line-height: 1.2;
  text-align: center;
}

@media (max-width: 575px) {
  .loqo-cta-check {
    width: 100%;
    max-width: 320px;
    padding-left: 18px;
    padding-right: 18px;
  }
}

Check the result at phone, tablet, and desktop widths. If the button fits the design worse after the change, remove the class from the section or temporarily comment out the CSS. Rolling back should be just as easy as enabling the tweak.

When It Is Better Not to Add Code

Do not add PHP if the task can be solved through module assignment, position settings, or page editing. Do not create an override just to change a single label if you can replace it in Page Builder or through a Joomla language override. A template override is useful when you need to change the output of an extension, but it requires an understanding of PHP, the template structure, and a test environment.

How to Check the Result Before Publishing

Before publishing, Loqo needs to be checked as a design, as a Joomla build, and as a user journey. Simply viewing the homepage is not enough. The template involves menus, modules, Page Builder, portfolio, forms, the blog, caching, and responsive settings. An error in one layer can look like "the template is broken" when the real issue is menu assignment or caching.

Structure Check

  • All menu items lead to real existing pages.
  • The Home page is assigned as the homepage and opens without an unnecessary redirect.
  • The portfolio contains real projects and does not show empty filters.
  • The blog is either populated, or the blog section is removed from the homepage until content is ready.
  • The contact form sends notifications to the correct address and shows a clear message after submission.

Visual Check

Open the page on desktop, tablet, and mobile. Check that the large heading does not cause horizontal scrolling, images are not stretched, buttons do not overlap text, the off-canvas menu works, and the footer does not turn into a long unstructured wall of content. If something looks bad only at one width, look for the grid or responsive setting rather than changing the entire design.

Check After Caching and Optimization

After enabling Joomla cache or optimization extensions, recheck the menu, animations, form, and portfolio. Some visual issues appear only after files are combined or minified. If an error shows up after one specific optimization, roll back that change only and test again.

Typical Loqo Problems and Fast Ways to Diagnose Them

Below are the issues most typical of a Joomla template built around Page Builder, Helix, and a portfolio component. This is not an "every possible case" list, but a practical map: symptom, likely cause, what to check, and a safe fix.

The Homepage Does Not Look Like the Demo

Symptom: after installation, you see an empty or almost empty page with no large sections, no portfolio, and no expected menu. One likely cause is that only the template was installed without Quickstart, or the Home menu item is not assigned to an SP Page Builder page.

Check SP Page Builder Pro -> Pages and the Home menu item. If you installed only the clean template, the demo structure has to be built manually or imported using the method provided by the developer. If you deployed Quickstart, make sure the installation finished completely and the installation folder was removed.

Demo Images Were Replaced by Gray Blocks

This is expected with many templates: demo photos may be excluded from the package due to licensing. Check which images are needed for the hero section, portfolio, testimonials, and blog, then replace them with your own files. Do not try to "restore" demo photos from the live preview if you do not have the right to use them.

A Module Does Not Appear on the Needed Page

First check the module's publication status, position, and menu assignment. In Joomla, module behavior depends on Menu Assignment and access permissions. If the module is assigned only to a different menu item, it will not appear even in the correct position. Then clear the cache and open the page in a private window.

Animations, Menu, or Form Disappeared After Optimization

Disable the last optimization setting you enabled, clear the Joomla and browser cache, and test the page again. If the issue disappears, add the optimizations back one parameter at a time. Do not turn on minification, combining, defer, and lazy modes for every script all at once before checking the form, off-canvas menu, portfolio, and Page Builder blocks.

The Portfolio Filters Incorrectly

Check the project tags in SP Simple Portfolio. If a filter returns an empty result, the items usually do not have the required tag, or the homepage is set to display only a limited number of projects. Fix the tags, order, and output limit, then test the public page again.

The Mobile Version Breaks the Large Heading

Shorten the phrase, move part of the text into the subheading, or adjust the section in SP Page Builder. If the problem is in the columns, check the responsive settings in Helix Layout Builder. Roll back any random CSS if it shrinks the whole site and hurts readability.

Loqo issue diagnostics for modules, cache, portfolio, and responsive behavior
This diagnostic map shows the path from symptom to verification: menus, module positions, cache, portfolio, and responsive settings.

Questions Worth Resolving Before Launching Loqo

Can Quickstart Be Installed Over an Existing Site?

Quickstart is intended for deploying a ready-made demo package in a clean environment. For an existing site, it is safer to install the template and dependencies separately, create a copy of the style, and assign it to a test menu item. A backup is required before any work begins.

Where Is the Loqo Homepage Edited?

In Quickstart, the homepage is built in SP Page Builder Pro. Find it under Components -> SP Page Builder Pro -> Pages, and treat the Home menu item as the assignment for that page.

Why Might the Demo Photos Be Missing from the Package?

Demo photos are often used only for the live preview and may be excluded from Quickstart due to licensing. For a real site, prepare your own images and check their sizes so they do not break the hero layout, portfolio, or card grid.

What Should I Do If a Module Does Not Render in the Right Position?

Check the module publication status, position, Menu Assignment, access level, and cache. If the position is new or custom, make sure it is available in the layout settings or properly added through Helix or Joomla features.

Can I Change the Appearance with CSS?

Yes, if the change is small, reversible, and placed in custom CSS rather than the template core files. It is better to add your own classes to SP Page Builder sections and style them selectively.

Is Loqo Suitable for a Multilingual Site?

Joomla supports multilingual websites, and SP Simple Portfolio lists multilingual capability as a feature. But before launch, you still need to check menus, language versions of pages, interface strings, portfolio items, and SEO-friendly URLs separately. Do not assume multilingual support is ready just because the template is installed.

Should I Enable All Effects and Animations?

No. Keep only the effects that improve navigation and perception. If an animation hurts performance, accessibility, or the contact form, it is better to disable it or simplify it.

When Loqo Is the Right Choice

JoomShaper Loqo is a strong choice if you need a Joomla template for an expressive agency website where the homepage, portfolio, services, blog, and contact path should feel like a single presentation. Its strengths show best when you use SP Page Builder for sections, SP Simple Portfolio for projects, Helix for layout control, and Joomla modules for page-specific output.

Before publishing, check not just the appearance, but the full working chain: installation -> homepage setup -> portfolio -> menu -> module positions -> responsive behavior -> form -> cache. If that chain works without hidden errors, you can download JoomShaper Loqo and test the template on your own copy of the site.

Loqo delivers the best result not when you copy the demo blindly, but when you carefully replace the demo structure with real services, real projects, and a real user path. Preserve the visual rhythm, do not invent unsupported features, test each Joomla layer separately, and the template becomes a solid foundation for an agency website rather than just a nice-looking screenshot.

By OceanTheme.org Editorial Team

You are not logged in to post comments.