82 lines
3.9 KiB
Text
82 lines
3.9 KiB
Text
<% title("Add the #{community_name} Badge to your personal site") %>
|
|
|
|
<%= content_for :page_meta do %>
|
|
<link rel="canonical" href="<%= app_url("/p/badges") %>" />
|
|
<meta name="description" content="Add the <%= community_name %> Badge to your personal site">
|
|
<meta name="keywords" content="<%= SiteConfig.meta_keywords[:default] %>">
|
|
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:url" content="<%= app_url("/p/badges") %>" />
|
|
<meta property="og:title" content="Add the <%= community_name %> Badge to your personal site" />
|
|
<meta property="og:image" content="https://thepracticaldev.s3.amazonaws.com/i/kjn1gduswyrrisc1basc.png" />
|
|
<meta property="og:description" content="Show visitors that you are an active member of our wonderful community. Put the badge on your personal website or use it as you see fit." />
|
|
<meta property="og:site_name" content="<%= community_qualified_name %>" />
|
|
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:site" content="@<%= SiteConfig.social_media_handles["twitter"] %>">
|
|
<meta name="twitter:title" content="Add the <%= community_name %> Badge to your personal site">
|
|
<meta name="twitter:description" content="Show visitors that you are an active member of our wonderful community. Put the badge on your personal website or use it as you see fit.">
|
|
<meta name="twitter:image:src" content="https://thepracticaldev.s3.amazonaws.com/i/kjn1gduswyrrisc1basc.png">
|
|
<% end %>
|
|
|
|
<div class="blank-space"></div>
|
|
<div class="container article">
|
|
<div class="title">
|
|
<h1>
|
|
Add the <%= community_name %> Badge to your personal site
|
|
</h1>
|
|
</div>
|
|
<div class="body">
|
|
<p>
|
|
Show visitors that you are an active member of our wonderful community. Put the badge on your personal website or use it as you see fit.
|
|
</p>
|
|
<% if user_signed_in? %>
|
|
<p>
|
|
<a href="<%= user_url(current_user) %>">
|
|
<img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg" alt="<%= current_user.name %>'s <%= community_name %> Profile" height="30" width="30" class="dev-badge">
|
|
</a>
|
|
</p>
|
|
<p>
|
|
Make the image as big or as small as you like by modifying the <code>height</code> and
|
|
<code>width</code> attributes. The badge is an SVG hosted on Amazon Cloudfront and is <b>only 1kb</b> in size.
|
|
</p>
|
|
<p>
|
|
Here is the full code for adding the badge with a link to your profile:
|
|
</p>
|
|
<pre class="embed-code">
|
|
|
|
<a href="<%= user_url(current_user) %>">
|
|
<img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg" alt="<%= current_user.name %>'s <%= community_name %> Profile" height="30" width="30">
|
|
</a>
|
|
</pre>
|
|
<p>
|
|
You can embed the <%= community_name %> badge in markdown with this snippet:
|
|
</p>
|
|
<pre class="embed-code">
|
|
[](<%= user_url(current_user) %>)
|
|
</pre>
|
|
<p>You can add the <%= community_name %> badge via
|
|
<b><a href="https://fontawesome.com/icons/dev?style=brands" target="_blank" rel="noopener">Font Awesome</a></b> with this snippet:
|
|
</p>
|
|
<pre class="embed-code">
|
|
<a href="<%= user_url(current_user) %>">
|
|
<i class="fab fa-dev" title="<%= current_user.username %>'s <%= community_name %> Profile"></i>
|
|
</a>
|
|
</pre>
|
|
<p>
|
|
<small>
|
|
<a href="https://fontawesome.com/how-to-use/on-the-web/setup/getting-started?using=web-fonts-with-css" target="_blank" rel="noopener">Getting Started with Font Awesome</a>
|
|
</small>
|
|
</p>
|
|
<% else %>
|
|
<p>
|
|
<img src="https://d2fltix0v2e0sb.cloudfront.net/dev-badge.svg" height="30" width="30" alt="<%= community_name %> badge" class="dev-badge">
|
|
</p>
|
|
<h2 style="text-align:center;">
|
|
<a href="/enter">Log in to view your custom embed code</a>
|
|
</h2>
|
|
<br /><br />
|
|
<% end %>
|
|
|
|
</div>
|
|
</div>
|