Over the last few days I have mostly been taking a break from programming. Even so, I found the time to get a few things done. The improvements mostly concern the Lyrics website, but occasionally some of the others too. To give this some structure, I will list them:
- I added this Angular component to the search results on the Lyrics website: https://material.angularjs.org/latest/#/demo/material.components.tabs . However, there were 2 problems:
- the extremely large minified libraries of Angular and
angular-material - there was a problem on mobile devices – after tapping the arrow, for example to show only matches with translated lyrics, the whole page reloaded and jumped back to the first item.
In the end I reverted it to how it was, knowing that I will have to finish it at some point later with Metro Css Ui, my own solution, or a 3rd-party one.
- the extremely large minified libraries of Angular and
- I added 3 video lists to every song on the Lyrics website:
- The artist’s most popular songs – At most 10 of the artist’s most popular songs. I am still considering whether to also include songs with zero views, so that they also get a chance to stand out.
- Songs from the same album – all songs from the same album and artist.
- You might also like – 5 songs by the artist currently being viewed. Another 5 songs come primarily from similar artists, and if that does not fill the list, further similar songs by genre are picked.
- For every artist for whom last.fm returns a short description in
en, that description is shown on the song page. Of course, I do not fetch it on every request from last.fm; it is stored in my own database and is updated only when a new artist is created and otherwise when I intervene as an admin. - On the song page of the Lyrics website and on the gallery/album pages of the Photos website, I added microtags for facebook (Open Graph) and google (schema.org).
Relevant information should now show up in search results and when sharing on social networks. The only thing is that I have not figured out why it suddenly refuses to load images – facebook sometimes loads the top image in the header, sometimes not even that, and google Plus never loads anything. Facebook claims “the image is probably low resolution” – 120×90.
Google does not have a console as sophisticated as FB‘s; it only parses the tags and tells you which ones it parsed, and with these options it reports no errors. - I fixed the display of the template columns on the GeoCaching website. Once again, using the directives paid off
display: table,table-row,table-cell. Even the green border around the entire wrapping div started working.