Skip to content

Instantly share code, notes, and snippets.

@marisqaporter

marisqaporter/font.html

Last active May 23, 2018 20:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save marisqaporter/58668df637b8886d61dacd2e6c42435b to your computer and use it in GitHub Desktop.
Save marisqaporter/58668df637b8886d61dacd2e6c42435b to your computer and use it in GitHub Desktop.
Download ZIP
Using font awesome on drupal
Raw
font.html
/*put this in the html, like in your page template or block or bean block or view. Following are for facebook, twitter, youtube and pinterest */
<i class="fab fa-facebook-f"></i><i class="fab fa-twitter"></i><i class="fab fa-youtube"></i><i class="fab fa-pinterest"></i>
Raw
fontawesome.css
/*this is for the css. #block-block-15 is my block and .svg-inline--fa is how to target the icons */
#block-block-15 .svg-inline--fa {
color: #5698d2;
font-size: 20px;
padding: 5px;
background: #fff;
border-radius: 50%;
width: 20px;
margin: 0 5px;
}
Raw
html.tpl.php
<!-- check for latest script on font awesome dot com-->
<!-- place this before head tag -->
<script defer src="https://use.fontawesome.com/releases/v5.0.13/js/all.js" integrity="sha384-xymdQtn1n3lH2wcu0qhcdaOpQwyoarkgLVxC/wZ5q7h9gHtxICrpcaSUfygqZGOe" crossorigin="anonymous"></script>
<!-- example of full file -->
<?php print $doctype; ?>
<html lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>"<?php print $rdf->version . $rdf->namespaces; ?>>
<head<?php print $rdf->profile; ?>>
<?php print $head; ?>
<title><?php print $head_title; ?></title>
<?php print $styles; ?>
<?php print $scripts; ?>
<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<script defer src="https://use.fontawesome.com/releases/v5.0.13/js/all.js" integrity="sha384-xymdQtn1n3lH2wcu0qhcdaOpQwyoarkgLVxC/wZ5q7h9gHtxICrpcaSUfygqZGOe" crossorigin="anonymous"></script>
</head>
<body<?php print $attributes;?>>
<div id="skip-link">
<a href="#main-content" class="element-invisible element-focusable"><?php print t('Skip to main content'); ?></a>
</div>
<?php print $page_top; ?>
<?php print $page; ?>
<?php print $page_bottom; ?>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment