Before you ask please READ THIS

Logo

in Rife Posts: 78
Hi

I have read the docs but there are multiple places add logos so I think I am missing something..

How does the logo work - if you dont use header variants is the logo only set in site identity?

Is SVG Logo Enabled in Site Identity. If I add an SVG that is sized to 101 x 75 its not visible.

Whats the recommended high DPI for non SVGS

How can I have an SVG Header Logo thats sized to fit

I can only get a logo to work if I use the header variant and disable SVG - I would like to use an SVG Logo once only for the whole site that gets picked up by headers, sticky etc - is this possible?

Thanks

Comments

  • AirAir
    Posts: 9,693
    Hey:-)
    MyMetta said: How does the logo work - if you dont use header variants is the logo only set in site identity?
    No, it is set in Logo settings https://rifetheme.com/help/docs/customizing-the-theme/header/logo/

    MyMetta said: Is SVG Logo Enabled in Site Identity. If I add an SVG that is sized to 101 x 75 its not visible.
    I don't think so. You have to use theme logo settings for SVG. Read more https://rifetheme.com/help/docs/customizing-the-theme/header/svg-logo/


    MyMetta said: Whats the recommended high DPI for non SVGS
    There is no such thing, as SVGs are always sharp no matter how you create them. Unless you will embed in SVG some JPG ;-)
    MyMetta said: I would like to use an SVG Logo once only for the whole site that gets picked up by headers, sticky etc - is this possible?
    Yes, just setup SVG logo like explained in above links to documentation.

    Hope this helps.

    With kind regards.
  • edited January 10 Posts: 78
    Hi I have read your docs before I posted.

    Are you saying that site identity logo is not used with your theme?? Its in customizer so it looked like thats where you set the logo??

    If I use non SVG's - this is what your doc says - so whats the recommended high DPI size please?
    Uploaded logo will be resized by CSS to fit layout in some cases.

    You also have field Image for HIGH DPI screen to upload a bigger logo for retina like devices. Use there bigger size image but in the same proportions as the normal logo.
    I will try to get SVG working again
    Post edited by Air on
  • AirAir
    Posts: 9,693
    MyMetta said: Are you saying that site identity logo is not used with your theme?? Its in customizer so it looked like thats where you set the logo??
    These options were added to WordPress much later =WordPress history. Before it was added to WordPress we had already our own Logo settings.
    So yes, we support settings from "site identity", but ONLY if you have not set logo in our theme settings - backward compatibility is important for our clients:-)
    You have set logo in theme settings, so site identity settings will be ignored.
    MyMetta said: If I use non SVG's - this is what your doc says - so whats the recommended high DPI size please?
    Double of normal logo size that you have used. Just keep same proportions of the image - that is most important.

    With kind regards.
  • Posts: 78
    Hi

    Thanks. I seem to have the SVG Logo working but I have an issue now with its alignment - its not in line with the menu nav items.

    I tried changing the SVG height, padding, but still have the issue.

    The SVG is exported from AI but to be fair I really dont know AI well. I just did export as SVG and it auto selects a few options - I may need to change this?

    I have read your SVG Logo doc but its over my head :)

    So yes there could be some entries in the SVG file that are causing an issue??

    Heres the original SVG dimensions as loaded into WP - so it was quite big

    testlogo.svg
    January 10, 2019
    18 KB
    754.94 × 599.08


    I changed the width to be 100 then 93 as the JPG was 93 but no change

    Heres a screenshot as im on local dev for now again.

    Do you have any suggestions?? I only have AI for 1 more day until the trial expires!! :)

    Thanks a lot.

    Just one more SVG logo question - in your docs it says this

    The SVG logo is inlined in theme

    If you enable SVG logo, then image used will be part of the code of your website, not a separate image like with classic logo.


    Does this mean the logo file will no longer be recognised by SEO plugins??

    Thanks
    Screenshot 2019-01-10 20.37.05.png
    1920 x 1080 - 208K
  • AirAir
    Posts: 9,693
    Hey :-)
    MyMetta said: I tried changing the SVG height, padding, but still have the issue.
    Top/bottom padding should help here. Could you add it to test site?
    MyMetta said: So yes there could be some entries in the SVG file that are causing an issue??
    I don't think this the issue. I will help you with position, once I could see it :-)
    Padding settings in Appearance → Customize → Header Settings → Logo should solve that unless you have some white space in your logo file, that is pushing it down.
    MyMetta said:
    Does this mean the logo file will no longer be recognised by SEO plugins??
    Great question:-)

    I will try to explain how you should treat it:
    Adding SVG logo to your site is an optimization, however, it is still marked as the logo for search engines. So Google should recognize it.

    As for plugin like Yoast - if they are looking for the logo in "site identity" settings, you should set it there as well. Theme will not use it on front-end, but it will be available for WordPress and other plugins that might want to use it(Elementor Pro for example).

    I don't know how other plugins are working in depth, I can only speak about this that I know.

    Anyway, in this case, having set logo in 2 places(Site identity & theme logo settings) will not cause any conflicts.

    Hope this will help :-)

    With kind regards.


  • Posts: 78
    Hi

    Many Thanks. Your support is exceptional. If anyone is reading - you wont go wrong with this theme and the first class support :)

    Okay - I have uploaded the latest version including the logo.

    Same login but its on the sub domain beta.xxxx.vip

    Thanks
  • AirAir
    Posts: 9,693
    Hey :-)
    MyMetta said: Your support is exceptional. If anyone is reading - you wont go wrong with this theme and the first class support
    Thanks for that! Hope we could close your issues very soon :-)

    OK, so your SVG is almost good. It uses float number where it should use decimal, and this creates the issue.

    However, thanks to this I will be able to prepare the theme for such issue in future.
    I have made the change in your installation, but you should copy it to your main site.

    In file rife\advance\utilities\media.php line ~539 change:
    $is_match = preg_match("#viewbox=[\"']\d* \d* (\d*) (\d*)#i", $svg, $values);
    to
    $is_match = preg_match("#viewbox=[\"']\d* \d* ([0-9]*\.?[0-9]+) ([0-9]*\.?[0-9]+)#i", $svg, $values);

    The second thing is you have to empty value for height in the logo settings:
    Appearance → Customize → Header Settings → Logo → Height.

    With kind regards.

  • Posts: 78
    Hi

    Many Thanks! That seems to work. I just have one small question/issue

    The header height seems to be quite large and I am not sure if this is due to the logo or the orange background CSS I added to the menu item

    Its also expanding on mobiles and I have not made any changes here - its way to big for mobiles - should I just change the mobile width?

    Thanks

    New dev site up at metta3.vip same logins
  • AirAir
    Posts: 9,693
    Hey :-)

    Yes, logo size is setting up the height of the whole header.

    As logo height is dependant on its width you will have to adjust the width of the logo for desktop and mobile.

    You can also tweak top/bottom padding of the logo, as it also adds to height.

    Remember that sticky header variant has its own values for above settings :-)

    With kind regards.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

In this Discussion