Update of widget.php needed for width and height

Hi there,
since there are responsive issue when including width and height properties, we are not going to be adding them. Furthermore, the image icons are now deprecated, in favor of the new Font Awesome widget.
You might want to update and try that instead.

Hope this helps ??

I tried, not did not yet switch… The reason: I could not get 4 icons aligned nicely and visually attractive on a colored background.

I want to have fa facebook square, fa twitter square, fa google plus square and flick 24 pixels large on a colored background. That’s off course possible by not setting the background color, but then the icons are almost I unreadable. So I tried to set a (smaller) white background to have the icon content show white. Bad luck. Backgrounds are square, icons not completely. And a smaller background also didn’t solve this. It always stayed ugly. And with the google plus icon not aligned equally.

Hope this can be fixed before removing the current working functionality.

A URL or a few screenshots would really help me see what the exact problem is. Is this possible?

The image icons aren’t going away anytime soon. They will eventually, but not soon. We just won’t be updating them anymore.

Did you have a look into this? I assumed the detailed description above would be enought to reprodure 4 square non-aligned icons. If not, let me know.

I can really reproduce your issue, or perhaps, I just can’t see the problem.
Are you using the latest plugin version? The widget includes a “Icon Color” option, which is really the foreground color (i.e. the ‘color:’ css property) of the icons.
Setting that to anything you want, and having a clear background, should give good results.

As I said before, a screenshot would be really helpful.

I created a screenshot by re-configuring the widget and adding the 4 square icons I wanted. There is however no upload option in this comment form, can I therefore email it instead?

My settings are:
Title: TEST
Icon color: dark blue (matching my light blue background)
Icon background color: white
Icon size: 24
Background size: 24
Border radius: empty
Opacity: 1
Open in new windows: checked
4 icons: fa-facebook-square, fa-twitter-square, fa-google-plus-square, fa-flickr

I noticed I also couldnt reproduce the not-outlined issue. My main remark is however that I would like to have the icons itself (in my case) darkblue AND white inside on a lightblue background. Thus not only replying on a clear background color. Can this be the case?

But let me mail you my screenshot with both the current icons I like and the results of the settings above! And thanks in advance for looking into this btw!!

I believe you mean that the icons become a bit misaligned inside their containers in small sizes, is that correct? This is a thing we’ve been trying to overcome but unfortunately this is the case everywhere with font icons, there will be small differences between browsers about a pixel of difference.

Anyway, I’m still not sure what the issue is because you’re not using very small sizes, the thing is if you set your background size exactly equal to your icon size you will get this kind of behaviour: https://d.pr/i/kqr5 which is aligned but looks weird.

It’s all a matter of tinkering with the settings, for example, with your exact above settings, simply changing the background size to 30 gives me perfectly aligned icons: https://d.pr/i/AmxK

I’m not sure if what you are trying to achieve is even possible.
I’ve just notified my CSS ninja colleague to take a look at your issue too, so it would be best if you could upload the screenshot into a public image hosting site, such as https://imgur.com so that we can all see the problem at hand (don’t forget to provide a link to the image), and being public will also double as a reference to anyone having the same issue as you.

Whooops, he was faster than me!

https://d.pr/i/vijO

As you can see on the image its really about the possibility of using the plugin on a colored background. The images displayes both the current and new “icon-set” of your plugin. The new Awesome icons should in my opinion be without the white border; the color white should only be shown INSIDE the image itself. Ie without a square or round white border…

About the misalignment: yep, that indeed occurs when you make the icon sizes smaller. Good to know!

Thanks for looking into this. I really would like to switch to the new styling!!

Now I’m a bit confused. This shouldn’t be possible to happen. https://d.pr/i/LT3I Where are you seeing this? Is there a URL I can inspect the icons? this must be some kind of external CSS interfering with them.

I prefer not to post my URL here in public. So I just posted an new topic in the secured Pintores forum of your company. Is it ok to continue the discussion over there and communicate the end results here? Thanks!

Absolutely, thanks.