Open Closed

Logo and Icon #8906


User avatar
0
nabass created

hi
this is second time asking this question and no body give me the solution so i asked again within new task
i got problem within (web.public) layer which is i can't change
1- favicon
2- Lepton logo load then my logo load i want to avoid this behavior
i attached video for the problem and this is some screenshots for what i did
i changed the extension to .ico and .svg nothing work

the video:
https://streamable.com/a6qg11

screenshots:
Screenshot 2025-03-05 111938.png
Screenshot 2025-03-05 111950.png
Screenshot 2025-03-05 115952.png

  • ABP Framework version: v8.02

  • UI Type: MVC


14 Answer(s)
  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    Hi, what's your LeptonX Theme package version? It's 3.0.2 I guess, right? There was a flicker problem on the logo, it was first showing the default logo and then replaced it with your own logo. But, we have already fixed this problem with v3.2.0-rc.1.

    image.png

    Therefore, if you upgrade your LeptonX Theme package version to 3.2.0+, then this problem will be fixed.

    Regards.

  • User Avatar
    0
    nabass created

    hi
    tell me the steps to avoid that behavior
    1- where should i go to know the version of lepton
    2- how to put my logo i mentioned before the path of my logo within screen shot
    3- how to change the favicon
    thanks

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    hi
    tell me the steps to avoid that behavior
    1- where should i go to know the version of lepton
    2- how to put my logo i mentioned before the path of my logo within screen shot
    3- how to change the favicon
    thanks

    1- where should i go to know the version of lepton

    You can open your application's csproj file (web application) and see the version of the LeptonX package. It's probably 3.0.2 in your application.

    2- how to put my logo i mentioned before the path of my logo within screen shot

    Defining your logo in the global-css file should be enough for now:

    :root .lpx-theme-dim,
    :root .lpx-theme-dark {
      --lpx-logo: url('/images/logo/leptonx/icon-logo.svg');
      --lpx-logo-icon: url('/images/logo/leptonx/icon.svg');
    }
    
    :root .lpx-theme-light {
      --lpx-logo: url('/images/logo/leptonx/icon-logo.svg');
      --lpx-logo-icon: url('/images/logo/leptonx/icon.svg');
    }
    

    3- how to change the favicon

    You can add a new favicon to the ~/wwwroot/favicon.svg and ~/wwwroot/favicon.ico paths to override the current favicon.

  • User Avatar
    0
    nabass created

    hi sir
    1- here is Lepton version
    Screenshot 2025-03-05 141005.png

    2- i changed any thing deal with logo with my path
    Screenshot 2025-03-05 141048.png

    3- i already changed my global style
    Screenshot 2025-03-05 111950.png

    4- in this path web/theme/leptonX/layout/application/sideMenuLayout
    i put this
    Screenshot 2025-03-05 141146.png

    i got couple of problems
    1- favicon works for web but not works for web.public
    2- same behavior still work even if i delete any abp logo from my project form where that logo comes to end it

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    For the web.public project you should also add the related favicons to the web.public project. Did you do that? They are two separate applications.

    2- same behavior still work even if i delete any abp logo from my project form where that logo comes to end it

    This is normal because your LeptonX Theme package version is 3.0.* which is lower than 3.2.0. So, please update the package version and retry again.

  • User Avatar
    0
    nabass created

    yes yes that is what i'm talking about i can not find the same path of sideMenuLayout to change the favicon i just changed
    it's global.css
    here is the full files
    Screenshot 2025-03-05 115952.png

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    yes yes that is what i'm talking about i can not find the same path of sideMenuLayout to change the favicon i just changed
    it's global.css
    here is the full files
    Screenshot 2025-03-05 115952.png

    To add a favicon, you don't need to add a line to the sideMenuLayout. You can just create files in the ~/wwwroot/favicon.svg and ~/wwwroot/favicon.ico paths to override the current favicon.

  • User Avatar
    0
    nabass created

    sorry sir but I'm going crazy
    where is the wrong
    favicon.svg is already my logo i put the same name to override

    Screenshot 2025-03-05 161320.png
    Screenshot 2025-03-05 161419.png
    Screenshot 2025-03-05 161521.png
    Screenshot 2025-03-05 171530.png

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    sorry sir but I'm going crazy
    where is the wrong
    favicon.svg is already my logo i put the same name to override

    Screenshot 2025-03-05 161320.png
    Screenshot 2025-03-05 161419.png
    Screenshot 2025-03-05 161521.png
    Screenshot 2025-03-05 171530.png

    Hi, it seems correct. Can you clear the browser cache? Because with this change, it should show your own favicons. I have tried just before:

    image.png

  • User Avatar
    0
    nabass created

    1- if i put within this (web/themes/LeptonX/Layout/Application/SideMenuLayout)
    this code
    <link rel="icon" href="/images/favicon/favicon.svg" type="image/svg+xml">
    it will work just for web layer but won't work for web.public layer because this (web/themes/LeptonX/Layout/Application/SideMenuLayout)
    not exist in web.public layer
    according to your solutions it's enough to put my logo.svg in root path to override but it doesn't work
    so is there another file should i place my logo ?

    2- share with me documentation of how to upgrade LeptonX theme without effecting on my project
    my project version is 8.0.2 i want to keep it as it is but upgrade just LeptonX
    is that possible ?

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    it will work just for web layer but won't work for web.public layer because this (web/themes/LeptonX/Layout/Application/SideMenuLayout)
    not exist in web.public layer

    Hi, for the web.public application it uses TopMenuLayout, not SideMenuLayout, this is the reason why there is no file in the project. Putting the related favicon files should work:

    image.png

    favicon.png

    If you made any customizations or changes that might affect this behaviour, you should share them with me so I can provide you a new solution. But with the default structure, it should work seamlessly as can be seen from the screenshots above.


    Please clear your browser cache and ensure it is related to that or not:

    ClearCache-Chrome-F12-Pic1.png

  • User Avatar
    0
    nabass created

    okay i will try but note that i searched for TopMenuLayout not found
    image.png

    2- please share with me documentation of how to upgrade LeptonX theme without effecting on my project
    my project version is 8.0.2 i want to keep it as it is but upgrade just LeptonX
    is that possible ?

  • User Avatar
    0
    nabass created

    yes yes it works yes thanks you
    Screenshot 2025-03-06 101834.png

    final step to avoid that behavior
    please share with me documentation of how to upgrade LeptonX theme without effecting on my project
    my project version is 8.0.2 i want to keep it as it is but upgrade just LeptonX
    is that possible ?

  • User Avatar
    0
    EngincanV created
    Support Team .NET Developer

    yes yes it works yes thanks you
    Screenshot 2025-03-06 101834.png

    Great to hear that :)

    final step to avoid that behavior
    please share with me documentation of how to upgrade LeptonX theme without effecting on my project
    my project version is 8.0.2 i want to keep it as it is but upgrade just LeptonX
    is that possible ?

    Yes, it's possible but there is no specific ABP CLI command that only updates LeptonX package versions, so you should do it manually.

Boost Your Development
ABP Live Training
Packages
See Trainings
Mastering ABP Framework Book
Do you need assistance from an ABP expert?
Schedule a Meeting
Mastering ABP Framework Book
The Official Guide
Mastering
ABP Framework
Learn More
Mastering ABP Framework Book
Made with ❤️ on ABP v9.2.0-preview. Updated on March 13, 2025, 04:08