Site Logo; How do I change this in 3.3?

[privateer]

Thanks for reply. Apologies in advance, I really struggle with IT.

I have used the gif logo on < https://coachpsy.com > for years, up to the latest version of 3.2.
After the upgrade to 3.3 the phBB svg logo was visible
I have just purged the cache - no difference
The link to my site is https://coachpsy.com
I have just uploaded the original phpBB logo svg file and it's clearly visible. I have now upload my svg logo again and it's not visible.

I have just tried to view my svg logo file on Convert-Online and found I cannot. I guess if I can't see my svg logo image on their site then the svg image file itself must be the problem. Sorry, I should have thought that in the first place. I've emailed Convert-Online for help. I'll get back to you.

Regards, privateer

[invenio]

Are you clearing both the phpBB cache AND browser cache with each retry? I had to do that as the cache would display the old image. You can always use the inspect element function of your browser to confirm what file is being displayed on the web page you have up.

[privateer]

Hi again,

I created my logo again in JPG format, simple navy blue text on white background and then converted it to svg. I now have the logo showing black text only on my forum https://coachpsy.com.

This reply from Convert-Online explains why:

If you convert from raster (images made by a collection of pixels side, by side) images like PNG or JPG, this SVG converter will convert your shapes and objects to black and white vector graphics that are scalable without any loss in quality.

The reason is that we have to trace the shapes and convert them from raster (or pixel images) to vector format. Doing this with color normally does not provide a good result due to the different nature of the image data (raster versus vector). Therefore we focus to the best shapes possible out of raster images.

Seems that I need to create the logo in svg format to overcome the problem. Don't know how to do that yet.
I see also that resizing the logo in "common.css" doesn't actually have any effect. The original size must be set by code written somewhere else. I see its line 178 but I don't know what file that is.

Thanks,
privateer

[Mannix_]

I see also that resizing the logo in "common.css" doesn't actually have any effect. The original size must be set by code written somewhere else. I see its line 178 but I don't know what file that is.

You can control the size by adding background-size property

[Mick]

There’s an svg plugin for Paint.NET which is free, you could do it yourself. Also, I noted reading some of the messages on the Paint.NET site, that browsers are notorious for messing up svg files and there’s information how to get round that.

[invenio]

GIMP does not have an svg export. It's weird how svg is not supported in many image manipulation programs and even some of the online converters seem to have trouble. I question whether moving the default logo to this format was the best option. The format does have it's merits and is technically superior to .gif for web page applications such as this.... if it works.

[Mick]

I think the change was because of user requests, it’s for mobile use really, scalable and all that. The only thing that really worries me about svg is that they’re easily corruptible, a bit like me really

[EA117]

This reply from Convert-Online explains why:

That's more than I assumed they would be doing. Several of the "convert this bitmap to SVG" operations simply wrap the unmodified bitmap in an SVG container and declare "Converted to SVG!", even though it's still the same bitmap with the same bitmap-based limitations.

Seems that I need to create the logo in svg format to overcome the problem.

"The problem" in that context being "how to create an version of my logo named site_logo.svg, so that I can overwrite that file name and cause phpBB 3.3.0 prosilver to load this image without making any other modifications to prosilver."

The implied and inherent alternative there -- and what the Knowledge Base - How to change your board logo that P_I linked to describes, and what Mick and others are also saying -- is "you don't actually have to supply your logo in SVG format."

You can continue providing the PNG or GIF or whatever format you had been using, and then change prosilver's colours.css to point to the actual file name it should use for the logo. In many cases, this can be one of multiple changes you needed to do to prosilver anyway, in order to also account for the dimensions of your image (setting the height & width as needed) which are different from prosilver's default image.

You certainly can provide your logo in SVG form, but it's not that you must do this in order to use phpBB 3.3's prosilver. You weren't required to provide site_logo.gif in phpBB 3.2.9 or earlier either, for that matter, and could have provided whatever alternative format you preferred then, too. Still via the same matter of tweaking the prosilver CSS to use whatever image you did provide.

GIMP does not have an svg export. It's weird how svg is not supported in many image manipulation programs and even some of the online converters seem to have trouble. I question whether moving the default logo to this format was the best option. The format does have it's merits and is technically superior to .gif for web page applications such as this.... if it works.

That's similar to pondering "why doesn't this word processing program provide any good way to save documents as an image." It's two different things, and not suited to the type of data the application is designed to manage.

GIMP, Photoshop, Paintshop, etc., are designed for bitmap-based images; i.e. pixels. Illustrator, CorelDRAW, Inkscape, etc., are vector-based drawing programs. SVG is a vector-based format, not withstanding that you can embed bitmaps inside an SVG container too. If you have a particular bitmap image, it's not a matter of "oh, I should just save this as SVG" like it is for the choice between PNG, GIF or JPG. A bitmap is not the kind of data intended for what makes SVG format a good choice.

Indeed, having provided logos (and for many styles, forum icons) and FontAwesome icons in SVG or vector format, the phpBB pages look sharp and correct on anything from a phone all the way up to your dual-stacked 4K 32" desktop displays. Because there aren't any "pixels" involved in how the images are being delivered. All logos and icons are being drawn "as if for the very first time", at whatever resolution your screen is designed to display. Whether that's 320p, 1080p, 2160p or higher.

[privateer]

Thank you for your detailed explanation EA117.

Quite a lot to take in - so I'll have a thorough read through tomorrow.

Best wishes,
privateer

[EA117]

Take it to whatever depth you think best serves your own desire to understand it, and/or you think will best serve how you want to maintain the site going forward. Looking back in archive.org at how the logo displayed, it looks like you might have also been having a "background-repeat:" issue even with the previous site_logo.gif, because its dimensions were less than the phpBB-supplied logo default dimensions.

So I'll throw one more thing out there: If you want a drop-in replacement -- not just for the new site_logo.svg format in prosilver 3.3.0, but also for the "width: 149px; height: 52px;" default size prosilver sets -- take a look at the attached site_logo.svg. (Renamed to site_logo.svg.txt just for uploading to phpbb.com/community, because this format is not supported for attachment in this forum.)

This attached SVG changes the dimensions of the "gray" background behind the text, so that it will fill the dimensions of 149x52 without repeating. As opposed to what you would get "literally converting or using the current site_logo.gif." Intended to give you a display more like what's in the attached example.png:

example.png

[privateer]

Morning EA117, bit of a late start.

Well, what a hero. Thank you so much It's really very kind of you to have created the logo (site name) for me in svg. I have uploaded it to https://coachpsy.com and it does the job fine.

Many thanks,
Kind regards,
privateer

ps. I did discover this free svg online editor https://vectr.com

[privateer]

Short footnote.

Struggled with the free .svg editor so decided to splash out and and bought DrawPad. Given the arguments for using svg images thought it would be worth learning to use.

Thanks All,
privateer

[invenio]

Short footnote.

Struggled with the free .svg editor so decided to splash out and and bought DrawPad. Given the arguments for using svg images thought it would be worth learning to use.

Thanks All,
privateer

I've used inkscape in the past. It's a rather powerful program, probably the most popular free vector graphics drawing program, and uses SVG as it's native format. It's also free.

https://inkscape.org/develop/about-svg/

[MuddyFlint]

Either make an .svg image,
or covert an image to .svg
A quick search for a free converter came up with https://image.online-convert.com/convert-to-svg

I'm having the same issue. I've always just uploaded the gif (s) to the styles folder. I Just updated and am on the higher PHP verson now too. Everything went great......

....but the site logos instead of looking like this:

and this:

They are looking standard at this;

and this:

Sadly the svg ends up all garbled up....using this converter.... but they won't load here as the file extension is unsupported

[janus_zonstraal]

Upload it as a gif and change the extension in colours.css

I never understood why it was changed is .svg, nobody is using that extension