Emily Simone
Emily Simone

Reputation: 1

Creating a Shields.io Badge that Links to Email Address

I am creating a Professional README.md Generator. I would like to include a "Gmail" badge - using Shields.io - at the top of the page along with other Badges, including License, GitHub Profile, and Deployed Application URL. The goal is to make the email badge link so that a new email draft opens that is addressed to the provided email address when the badge is clicked. At present my code for the Email Badge in my generateMarkdown.js file is:

function generateEmailBadge(email) {
    return `![Email Badge](https://img.shields.io/badge/Gmail-Contact_Me-green?style=flat-square&logo=gmail&logoColor=FFFFFF&labelColor=3A3B3C&color=62F1CDlink=mailto:${email})`;
}

Originally, I had the link=${email} in the function generateEmailBadge(email), and, after some research, I changed it to link=mailto:${email}. Both attempts failed to make the badge clickable. I understand that in the generateMarkdown function, I can create a link as such: Contact Me. However, I am wondering, is there even a way to make a Shields.io badge link to an email address in the way I am looking to? If so, can someone please share guidance as to how I can make this work?

Upvotes: 0

Views: 707

Answers (1)

Konrad
Konrad

Reputation: 24661

This is how you create a link in markdown:

[link text](link.address)

So you have to wrap your badge with:

[](mailto:[email protected])

Result:

[![Email Badge](https://img.shields.io/badge/Gmail-Contact_Me-green?style=flat-square&logo=gmail&logoColor=FFFFFF&labelColor=3A3B3C&color=62F1CD)](mailto:[email protected])

Upvotes: 0

Related Questions