02 July 2021, 18:06

Hi

We have installed newest update from Git Mahara and are trying to get the social Media Links section working.
Unfortunately it does not display all Icons, even it recognizes all icons on Google and could simply pull them actually from Google, but it is not doing it.

02 July 2021, 22:08

This is how a nice Link section would look like. It is pulling the icons from Google "https:/ /www.google.com/s2/favicons?domain=domain.name" and adding a title and alt tag. (only Github does not have a Favicon on Google and therefore got pulled direct from Githubassets.com instead

<a href="https:/ /github.com/lisandi"><img title="GitHub" src="https:/ /github.githubassets.com/favicons/favicon.png" alt="GitHub" width="28" height="28" /></a> 

(empty spaces betweem / and / need to be eliminated to make the links working. They have been added so we are able to upload the complete links.) The icons from Google are actually 16x16 but to get the Github favicon - which is actually 32x32 to display at the end 16x16 in a Mahara text block you need to enter 28x28 - simple logic - isn't it :-) Not sure why?

04 July 2021, 20:12

Hi Andi,

As far as I'm aware the favicons are pulled from Google already like we do in the 'Allowed iframe sources'. However, the second screenshot you shared shows a URL that goes to the WebArchive and not WordPress. Thus, it wouldn't pull the correct icon for WordPress.

Cheers

Kristina

17 July 2021, 20:02

The problem is I can't enter another icon!

18 July 2021, 12:27

Hi Andi,

That is a non-existent feature at this stage. If you like to give it a go, you could check the code in the 'Allowed iframes' where it is possible to define an icon host.

Cheers

Kristina

21 August 2021, 20:55

Hmm - I try to reply here but can't it says always "processing" I am trying again with that post here

--
hmm that worked but the other previous post is still loading, I tried now already twice. Not sure why I can't reply with that other post it contains the same content - Text and 2 graphics and linked social icons in the text. - perhaps you can see something in your log files why it won't work, so it could get solved. Thanks

I uploaded a screenshot from the reply I wrote to that post.

21 August 2021, 21:18

Hi Kristina

I checked again with those icons and all of them actually get displayed on the profile page but unfortunately not in the form you enter the icons.

2 problems exist when using external links/icons/images to get displayed 

1. the general GDPR/DSGVO problem - as linking to google without consent of the user could cause legal problems
2. when the internet speed is not good and several external server places have to be contacted before page gets displayed completely.

For the icons probably using FontAwsome Icons might be a better option as backup for the Google Solution which definitely provides much more icons, even the Mahara Icon and our Company Icon too - which is great (if you are outside of Germany ;-))

You can check the icons above as I entered this in the profile page the same way - actually using the Google links - but the same links won't display the icon on the Profile Edit Social Connection Tab (check screenshots)

I cannot be a CSP I think as in that case also the frontend icons won't display. Any ideas on what could cause the problems in the edit form?

Than there is another question just coming up from the upload of the graphics - why can't they be displayed in a Lightbox or modal box or inside the text. If you need to download the images to see them it is another burden for people to do so and they might get bored because they can't easily actually see the image. It is also not good to have the images not visible if you describe and refer in your text to things seen in the images. I would suggest to make those available as popup I a Lightbox image or even better to be available inside the text in or below the paragraph they belong too and/or opening up in a higher resolution and screen size in a Lightbox. Thanks

21 August 2021, 21:22

Hi Kristina

I checked again with those icons and all of them actually get displayed on the profile page but unfortunately not in the form you enter the icons.

2 problems exist when using external links/icons/images to get displayed 

1. the general GDPR/DSGVO problem - as linking to google without consent of the user could cause legal problems
2. when the internet speed is not good and several external server places have to be contacted before page gets displayed completely.

For the icons probably using FontAwsome Icons might be a better option as backup for the Google Solution which definitely provides much more icons, even the Mahara Icon and our Company Icon too - which is great (if you are outside of Germany ;-))

You can check the icons above as I entered this in the profile page the same way - actually using the Google links - but the same links won't display the icon on the Profile Edit Social Connection Tab (check screenshots)

I cannot be a CSP I think as in that case also the frontend icons won't display. Any ideas on what could cause the problems in the edit form?

Than there is another question just coming up from the upload of the graphics - why can't they be displayed in a Lightbox or modal box or inside the text. If you need to download the images to see them it is another burden for people to do so and they might get bored because they can't easily actually see the image. It is also not good to have the images not visible if you describe and refer in your text to things seen in the images. I would suggest to make those available as popup I a Lightbox image or even better to be available inside the text in or below the paragraph they belong too and/or opening up in a higher resolution and screen size in a Lightbox. Thanks

23 August 2021, 9:44

Hi Andi,

I took a look at the screenshot of the social profile options that look broken and tried adding them with the same name / url to my local version and they display as expected. I see either the brand icons supplied by google or the generic globe icon if the brand icon not found. It is odd that your display shows the url as the alt text for the <img> tag as that should be the name value, eg for the LinkedIn entry I made the markup for the icon is:

<img src="http://www.google.com/s2/favicons?domain=www.linkedin.com" alt="LinkedIn">

So I see the icon when I have internet access or I see 'LinkedIn' when I don't

I do agree that we should use more of the font awesome icons for the more common social profile that do exist. It will mean editing the code to handle them more like how we handle twitter / facebook.

Ideally there would be an admin system so we could turn on / off options and pick the font-awesome icon / colour then one would just need to pick from the dropdown the option rather than needing to choosing 'other'

Cheers

Robert

24 August 2021, 15:18

Thanks Robert for having a look at it.

Yes using as default Fontawesome icons, especially the newest ones with lots of existing social platform icons would be a good way beside having Google. I will check the CSPs of the server perhaps they are causing problems. I checked already the headers settings and couldn't find any issues here.