Staff replied Templates

Adjustment of Logo Display in Agentik Template

Asked by WOLF Anlagen-Technik 7 months ago Last activity 6 months ago

hey,
In the “Agentik” template, our logo is correctly displayed in white on the start page when the blurred/transparent version is active. However, once scrolling activates the sticky menu with a white background, the logo currently changes to black.

We would like to adjust this behavior as follows:

Blurred/transparent version: logo in white
Sticky menu with white background: logo in its original multicolor version

At the moment, the logo switches from white to black. Our requirement is a change from white to the original multicolor version (not black).

Could you please let us know how this setting can be adjusted or what modifications are required?

Thank you in advance.

Kind regards,

19 replies

Mehtaz Afsana Borsha Staff

7 months ago

Thanks for contacting us. Could you please give me your site URL and also a screenshot of your issue?

-Regards.

WOLF Anlagen-Technik Asked this

7 months ago

Hey,

here the Link
https://www.joomshaper.com/joomla-templates/agentik

HOME / AI SaaS Creative

Mehtaz Afsana Borsha Staff

7 months ago

Please give me your site URL, it will help me to investigate it properly. And for uploading screenshots you can use it.

https://imgur.com/upload

WOLF Anlagen-Technik Asked this

7 months ago

see hidden content

Mehtaz Afsana Borsha Staff

7 months ago

Ok, but for further investigation I need your site URL. Dont worry, when it will be online just knock me here, I will help you.

WOLF Anlagen-Technik Asked this

7 months ago

see hidden contenct - internal company content!

Mehtaz Afsana Borsha Staff

7 months ago

You can use this CSS in your custom.css file

.home-default #sp-header #sp-logo .logo-image, .creative-home #sp-header #sp-logo .logo-image, .view-dynamic.services-page #sp-header #sp-logo .logo-image {
    filter: unset !important;
}

-Regards.

WOLF Anlagen-Technik Asked this

7 months ago

Hey, The currently implemented code unfortunately does not achieve the desired effect.

The intended logo behavior is as follows:

At the top of the page (no scrolling): white logo

Only after scrolling down: switch to the colored logo

With the current custom CSS, the logo remains permanently colored, regardless of the scroll position.

For clarification, I have recreated the desired effect in Photoshop and attached corresponding screenshots for your reference.

Please review the implementation and provide a working solution where the logo changes to the colored version only after scrolling.

Thank you in advance.

https://imgur.com/a/JwXKiTT

Mehtaz Afsana Borsha Staff

7 months ago

Hi,

Thank you for your inquiry.

Please note that it is not possible to change the logo color directly through the template settings. The logo would need to be edited externally (for example, using Photoshop or another image editing tool) and then re-uploaded to your site. You can modify the header or menu background colors from the template settings, but the logo itself cannot be adjusted there.

If you require further changes beyond the available settings, that would involve customization. Unfortunately, customization services are outside the scope of our support policy.

We appreciate your understanding.

Thanks.

WOLF Anlagen-Technik Asked this

7 months ago

Hello,

I have the impression that my request may not have been fully understood or that the template you provided has not yet been properly reviewed.

In the original template, the logo is also being replaced. Therefore, I kindly ask you to carefully read my specific question again and to review the template delivered by your team accordingly.

I am not requesting anything that is technically impossible. I am referring to a function that is already implemented within your own template. For this reason, I consider my request to be within the scope of regular support.

I would appreciate a renewed review of the matter and a concrete solution.

Thank you in advance.

Kind regards,

see: https://www.joomshaper.com/joomla-templates/agentik navigate to: Home / AI SaaS Creative. there are two differenz Logo colors showing . and the coloring ist from your preset css!

Mehtaz Afsana Borsha Staff

7 months ago

Allow us some time please, we will check and get back to you soon.

Atick Eashrak Shuvo Staff

7 months ago

Please add the following CSS code to your Template Options -> Custom Code -> Custom CSS or in your custom.css file

#sp-header.header-sticky #sp-logo .logo-image {
    filter: unset !important;
}
#sp-header #sp-logo .logo-image {
    filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(25deg) brightness(108%) contrast(101%) !important;
}

WOLF Anlagen-Technik Asked this

7 months ago

Hello,

I was only able to review this now. It is partly correct, but on the subpages the logo is also displayed in white and therefore not visible.

Could the logo on the subpages always be displayed in color?

Thank you very much and best regards

Atick Eashrak Shuvo Staff

7 months ago

Hi there,

Thank you for your message, and I apologize for the inconvenience caused.

To ensure the logo displays correctly, please remove the earlier CSS and replace it with the following:

#sp-header.header-sticky #sp-logo .logo-image {
    filter: unset !important;
}

#sp-header #sp-logo .logo-image {
    filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(25deg) brightness(108%) contrast(101%) !important;
}

body:not(.creative-home) #sp-header #sp-logo .logo-image {
    filter: unset !important;
}

This adjustment will ensure that the header logo appears white only on the “AI Saas Creative” page, while remaining in full color on all other subpages.

Please apply the update and let me know if everything displays correctly afterward.

Kind regards

WOLF Anlagen-Technik Asked this

7 months ago

Hello,

Thank you very much – it looks good overall.

However, on the subpages the logo shifts slightly to the right and is therefore not aligned in the same position as on the main page.
The colors are now matching well.

Please adjust the logo position on the subpages accordingly.

Thank you.

Atick Eashrak Shuvo Staff

7 months ago

Could you please share a screenshot of the issue?

WOLF Anlagen-Technik Asked this

7 months ago

https://imgur.com/a/FY33aSd

WOLF Anlagen-Technik Asked this

7 months ago

@ Atick Eashrak Shuvo can you fix the problem? need more informations? I need to make progress on this project.

Mehtaz Afsana Borsha Staff

6 months ago

Please use this CSS in your custom.css file

@media (max-width: 575px) {
    #sp-header .logo {
        height: 85px !important;
    }
}

WOLF Anlagen-Technik Asked this

6 months ago

hey, thanks, but doesn´t work. the problem is still not fixed

Mehtaz Afsana Borsha Staff

6 months ago

Could you please give me your super admin access? So that I can check. Please make sure you have a full site backup.

WOLF Anlagen-Technik Asked this

6 months ago

see hidden content

Mehtaz Afsana Borsha Staff

6 months ago

It seems ok in my end.

WOLF Anlagen-Technik Asked this

6 months ago

did you unerstand the problem? see video!

https://imgur.com/a/uEz6U6w

Atick Eashrak Shuvo Staff

6 months ago

I apologize for the inconvenience caused. Could you please check now and let me know if the issue is resolved on your end?

Looking forward to your response.

Best regards

WOLF Anlagen-Technik Asked this

6 months ago

no its smaller!

also in mobile and tablet view, it remains different from the homepage. Please also adjust the bottom page of the mobile site to match the homepage of the mobile and tablet view (responsive)

Atick Eashrak Shuvo Staff

6 months ago

Check the logo issue and share screenshot of the responsive issue

WOLF Anlagen-Technik Asked this

6 months ago

https://imgur.com/a/7EDEOuB

I am more than surprised that, despite purchasing a finished product, I keep receiving repeated follow-up questions and am constantly asked to provide additional screenshots.

It is not acceptable that the responsibility for identifying issues is repeatedly pushed onto the customer. The technical and support team should be able to independently review and identify what is going wrong.

The issues are clear:

The logo shifts position across different pages and is inconsistently scaled.
The navigation behaves inconsistently.
Subpages are not aligned with the layout of the homepage.
These problems occur on desktop, tablet, and mobile.

I have already provided multiple screenshots. I even took the time to overlay them in Photoshop with transparency and marked the different logo positions and navigation misalignments with red lines.

However, it is not the customer’s responsibility to keep identifying and documenting these issues. The programmer/designer who is being paid for this work is responsible for ensuring everything functions correctly.

What is needed is:

A complete technical review by your team
A thorough and permanent fix of all display issues
Consistent and professional rendering across all devices
A final quality check before delivering the product again

Please update the template for all customers and provide me with a final solution as soon as possible so I can go live.

Atick Eashrak Shuvo Staff

6 months ago

Hello,

Thank you for your message, and I apologize for the inconvenience.

The issue is caused by using different header layouts across your site. The homepage uses one header design, while other pages use another. Since these headers have different spacing and structure, this results in logo misalignment, inconsistent navigation, and layout differences across devices.

With different header designs, it is not possible to maintain identical positioning or spacing across all pages.

To resolve this, please use the same header layout on all pages. This will ensure consistent positioning and appearance throughout the site.

Kind regards

WOLF Anlagen-Technik Asked this

6 months ago

I do not accept your previous response in this form.

As already demonstrated, the functionality works correctly in the desktop view. Therefore, it is not clear to me why this should allegedly not be possible in the mobile view.

I kindly ask for a concrete and comprehensible explanation for this limitation. From my perspective, all necessary conditions are met, and the feature should also be implementable in the same way on mobile devices.

It gives the impression that this is not a technical limitation, but rather a lack of implementation.

I expect a clear statement as well as a solution to this issue.

Atick Eashrak Shuvo Staff

6 months ago

Hello,

Thank you for your clarification.

There is no technical limitation preventing this from working on mobile. The behavior you are experiencing is due to the template design itself. Different headers used across pages have distinct structures, spacing, and styling, which leads to alignment differences—especially on mobile.

This is not a template issue because the same alignment differences exist in the demo available on our site. The template is designed this way when different header layouts are used.

Additionally, regarding the desktop view, the consistent alignment you are seeing there was achieved by applying custom CSS on your site. It is not part of the default template behavior.

Achieving identical, pixel-perfect alignment between two different header designs requires further customization. This falls outside standard support scope and is considered custom development.

Recommended options:

Use a single header layout across all pages for consistent results.

Kind regards