Quick logo question

Hello all,

Thank you for taking the time to look at my question.

I was just wondering how do I change my logo on my website?

It is in the top left, right now it is stuck to my theme’s logo: Afterburn 2.0

Thank you for your time
Sonam

There’s no Afterburn theme in the official repository. Where did you get it? If you can’t link us to the source code, I doubt anyone can help.

Here is the link to it

Thank you

Please get into the habit of looking for yourself and trying things before posting questions here. If you found nothing, tell us what you tried.

I feel that if you are having trouble with this question, you will really struggle to make further customisations. You will need a strategy that is not simply asking here every time you get stuck. You should develop more independent troubleshooting skills.

Saying that, I know this can be hard to learn and the theme is not well documented at all.

So here’s what I did to investigate changing the logo.

I looked in the theme’s templates for where the logo code is. If you don’t know what you are looking for, you can use your browser tools to inspect the source HTML where the logo is. The logo code is in the base template:

  <div class="logo-surround">
      <a href="{{ base_url == '' ? '/' : base_url }}" id="logo"></a>
      <span class="logo-accent"></span>
  </div>

So from that, it looks like the logo is added with CSS. So I search the repository for logo-accent where I can see a reference to the logo file in the line above where logo-accent is defined in the SCSS. So I search for logo-image and see that it is defined in _header.scss.

So if you just edit the theme directly, which is not a great idea but OK for learning, there are now two ways to customise this:

  • replace the logo file at images/logo.png
  • add some CSS to override the rule #logo { background: ...}.

I highly recommend setting up a child theme that inherits from this one. Then it’s easier to customise and you won’t lose customisations when you update your theme.

There’s a lot to learn just there and hopefully you can see that it’s not going to be practical to answer every question you have here. Experimentation is the best way to learn. Good luck!

What made you think this was a quick question? :thinking:

I hope that helped you find a way. Next time you post here, please read our important guidelines and how to ask good questions first.

There is not much info on how to troubleshoot specifically, which is why I felt generous to you this time. Though I gave you a solution, I was really hoping you and others will see the process I followed and try it out yourself.

Just thought I should explain that. I’m normally very grumpy about these kinds of low effort questions :face_with_raised_eyebrow:

The question itself was quick, because there was no sign of effort made to even try to answer it by himself :laughing: