XF 2.1 Apple Music Embed

[slothly]

The current embed design for a track on Apple Music currently looks like an unfurled url card. Here's an example:



But the official Apple Music embed for a track looks like this:


Which is a nicer layout and more interactive. Is there any way to update the embed?

Here are some links with more information on Apple Music embed API that may be helpful:

Market with Apple Music

Marketing Tools and Resources

tools.applemusic.com

Market with Apple Music

Marketing Tools and Resources

tools.applemusic.com

 

[slothly]

Bumping this to see if it's possible to change the apple music embed/

 

[slothly]

Bumping again

 

[Paul B]

Disable the default media bb code and add your own with the configuration you want.

 

[CoZmicShReddeR]

Maybe see if @JoshyPHP can add it to his addon??

s9e Media Sites

This add-on will: Add a carefully curated collection of the most useful and most requested media sites. A list of supported URLs can be found on this page. Improve the performance and efficiency of the default media sites. Pages will load as...

xenforo.com

 

[Kevin]

Bumping this to see if it's possible to change the apple music embed/

Disable the default media bb code and add your own with the configuration you want.

Turns out that the XF2 default code can already do what the OP wants. The problem is that Apple has changed their URLs so now itunes.apple.com redirects to music.apple.com as part of the iTunes unbundling.

Slothly, if you temporarily switch your site to turn on debug mode then go into {YOUR XF INSTALL}/admin.php?bb-code-media-sites/applemusic/edit and add music.apple.com/{$id} to the list of 'Match URLs' then it should give you what you're after. Turn off debug mode again after and then tag one of the guys (Chris/Mike/Kier) about making the change for the next release (if they haven't already done it).

URL: https://music.apple.com/us/album/antisocial/1464549183?i=1464549858
Result

 

[slothly]

Turns out that the XF2 default code can already do what the OP wants. The problem is that Apple has changed their URLs so now itunes.apple.com redirects to music.apple.com as part of the iTunes unbundling.

Slothly, if you temporarily switch your site to turn on debug mode then go into {YOUR XF INSTALL}/admin.php?bb-code-media-sites/applemusic/edit and add music.apple.com/{$id} to the list of 'Match URLs' then it should give you what you're after. Turn off debug mode again after and then tag one of the guys (Chris/Mike/Kier) about making the change for the next release (if they haven't already done it).

URL: https://music.apple.com/us/album/antisocial/1464549183?i=1464549858
Result
View attachment 208481

I enabled debug mode but the 'Match URLs' area was still grayed out? I couldn't add anything

So I tried making a new BBcode instead and that didn't work either, nothing loaded

 

[Kevin]

I enabled debug mode but the 'Match URLs' area was still grayed out? I couldn't add anything

Thinking out loud, you may need to enable dev' mode.

$config['debug'] = true;                                                                                                
$config['development']['enabled'] = true;

 

[slothly]

Thinking out loud, you may need to enable dev' mode.

$config['debug'] = true;                                                                                              
$config['development']['enabled'] = true;

This did the trick! Thanks for all of your help

A bit unrelated but the new apple music embed reminded me of a consistent bug that I've been encountering on mobile. I've noticed this with other embeds before in the past too, particularly on instagram. In the case of the new apple music embed, sometimes whenever a playlist / album is posted with a really long song title, it'll break out of the viewport on mobile and overlap outside the post making everything weird and difficult to scroll. This happens a lot too whenever someone posts an instagram embed and the caption has a really long word or some kind of link that won't truncate. Has anyone encountered this before? Does anyone know how to fix this?

I'll probably post a separate thread addressing this issue eventually, just something I've noticed

 

[Kevin]

This did the trick! Thanks for all of your help

No problem; don't forget to turn off the settings again on your live site.

Has anyone encountered this before? Does anyone know how to fix this?

Is there a particular example you can give that shows it in action? If it can be duplicated then it should be fixable.

 

[slothly]

No problem; don't forget to turn off the settings again on your live site.

Is there a particular example you can give that shows it in action? If it can be duplicated then it should be fixable.

My Beautiful Dark Twisted Fantasy (Deluxe Edition (Explicit)) by Kanye West on Apple Music

Album · 2010 · 15 Songs

music.apple.com

Posting this album shows the full embed with the tracklisting, which looks great on desktop:

However on mobile...

You can see that the embed has become too wide for the mobile viewport and breaks out of the post due to the long track titles