Quark OP - cannot use custom logo.svg using child theme

1

Hi everyone. Hoping for help…

My goal is to have a custom svg logo, with changes made only to mytheme, and for it to colour invert on scroll, just like the default Grav logo.

Setup: Fresh download of Grav and Quark Open Publishing. Running locally on Linux.

Attempted so far: Changing mytheme.yaml
Using this instruction here: Quark: Using SVG as custom logo …I have been unable to change from default grav logo located in quark/images/grav-logo.svg

This appears to be because the first “if” statement fails and only the “elseif” statement is read. I can tell this by inserting text after the statements as they render onto the page to tell me what is happening.

Notes:

  • Working with a fresh install and skeleton of Quark OP - and am making changes to MyTheme only
  • I have a new logo.svg located in mytheme/images/logo and a copy of it in mytheme/images as well, just in case. I’ve also tried using the default logo, but the issue appears to be elsewhere
  • I have not set a logo in the admin backend as it just inserts an
  • I tried adding a logo variable to mytheme.yaml as suggested elsewhere in forum, but it seemed to be a png specific thing and had no effect on issue

Thank you all so much

1 Like
2

Perhaps, this helps (it’s in german, let google translate):

and/or copy the file themes/quark/templates/partials/logo.html.twig to themes/mytheme/templates/partials/logo.html.twig and adapt the code as follows:

{% set logo = theme_var(mobile ? 'custom_logo_mobile' : 'custom_logo') %}
<a href="{{ home_url }}" class="navbar-brand mr-10">
{% if logo %}
  {% set logo_file = (logo|first).name %}


  {% set logo_end =  (logo_file|split('.')|last) %}
    {% if logo_end == 'svg' %}
      {# Logo ist im SVG-Format - einbetten #}
      {% include('@images/logo/' ~ logo_file) %}
    {% else %}
      {# Logo ist im Bitmap-Format (PNG, JPG etc.) - mit img-Tag einbinden #}
      <img src="{{ url('theme://images/logo/' ~ logo_file)  }}" alt="{{ site.name }}" />
    {% endif %}


{% else %}
  {% include('@images/grav-logo.svg') %} 

{% endif %}
</a>```
1 Like
3

Thanks to pamtbaau I’ve been made aware of this issue and he kindly created a PR which I plan to review very soon. Will post an update here once that is done.

1 Like
4

Submitted PR fix from pamtbaau now merged and released in Quark Open Publishing v2.3.2. If anyone can re-test and report much appreciated.

5

Hi @paulhibbitts

Many thanks! From what I can see this is working perfectly.

Side note: My svg file, generated using Affinity Design, does not appear to allow the css colour flip. I’ve an older logo which was made using Adobe which works fine. There may be a file format element in this that I was also struggling with.

2 Likes
6

I used this code and it worked exactly as expected. Thanks so much for showing me this

2 Likes