Mjml: social media links not working

[cly3]

I can't link social media icons to the desired network profiles.

REPRODUCTION STEPS

1. [First Step] - using the <mjml-social> tag I can display the 3 desired social networks I want;
   Twitter, Facebook and Instagram. See the code below for my Twitter logo:

<mjml>
  <mj-body>
    <mj-container>
      <mj-section>
        <mj-column>
          <mj-social display="twitter" twitter-href="https://twitter.com/mailjet"/>
        </mj-column>
      </mj-section>
    </mj-container>
  </mj-body>
</mjml>

1. [Second Step] The icons are displayed in the email as expected
   

However, when they are clicked on they do not bring me to the mailjet twitter profile as expected, but instead I'm brought to:

I'm using Google Chrome.

Any help appreciated.

[mattlub]

@cly3 try display="twitter:url"

This is documented here but is not correct in the documentation on the website currently...

[iRyusa]

Hi @cly3

As @mattlub said, it's documented here : https://mjml.io/documentation/#mjml-social (in the blue warning)

[mattlub]

@iRyusa oh ok it is there, but still I think without looking at the blue box, the description in the table is misleading:

attribute | unit | description | default value
-- | -- | -- | --
facebook-href | url | button redirection url | [[SHORT_PERMALINK]]

[cly3]

@iRyusa, ah ok I see, but what I'm looking to do is for the social media buttons to direct users to social network profiles? Does that make sense?

[iRyusa]

@mattlub Well the component has been refactored in MJML4 to a new syntax with less magic interaction like :url

@cly3 As @mattlub said, <mj-social display="twitter:url" twitter-href="https://twitter.com/mailjet"/>

[cly3]

@mattlub @iRyusa thanks to you both. Problem solved, it's now working as I expect.
This is my first time using Github, thanks for your help. It was probably a daft question. But you got me there in the end!