Extract social and news as separate includes. Overall slight improvements.

_includes/head.html

@@ -16,4 +16,5 @@
   <script src="//cdnjs.cloudflare.com/ajax/libs/KaTeX/{{ site.katex_version }}/katex.min.js"></script>
 
   <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="{{ site.baseurl }}/css/academicons.css">
 </head>

_includes/news.html

@@ -0,0 +1,3 @@
+<div class="news">
+  <h2>news</h2>
+</div>

_includes/social.html

@@ -0,0 +1,13 @@
+<div class="social">
+  <span class="contacticon center">
+    <a href="mailto:you@example.com"><i class="fa fa-envelope-square"></i></a>
+    <a href="https://scholar.google.com" target="_blank" title="Google Scholar"><i class="ai ai-google-scholar-square"></i></a>
+    <a href="https://github.com" target="_blank" title="GitHub"><i class="fa fa-github-square"></i></a>
+    <a href="https://www.linkedin.com" target="_blank" title="LinkedIn"><i class="fa fa-linkedin-square"></i></a>
+    <a href="https://twitter.com" target="_blank" title="Twitter"><i class="fa fa-twitter-square"></i></a>
+  </span>
+
+  <div class="col three caption">
+    You can even add a little note about which of these is the best way to reach you.
+  </div>
+</div>

_layouts/page.html

@@ -8,8 +8,16 @@ layout: default
     <h5 class="post-description">{{ page.description }}</h5>
   </header>
 
-  <article class="post-content">
+  <article class="post-content clearfix">
     {{ content }}
   </article>
 
+  {% if page.news %}
+    {% include news.html %}
+  {% endif %}
+
+  {% if page.social %}
+    {% include social.html %}
+  {% endif %}
+
 </div>

_pages/about.md

@@ -2,27 +2,13 @@
 layout: page
 permalink: /
 title: your name
-description: Affiliations. Address. Contacts. Moto. Etc.
+description: <a href="">Affiliations</a>. Address. Contacts. Moto. Etc.
+news: true
+social: true
 ---
 
 <img class="col one right" src="/img/prof_pic.jpg">
 
-<br/>
+Write your biography here. Tell the world about yourself. Link to your favorite [subreddit](http://reddit.com). You can put a picture in, too. The code is already in, just name your picture "prof_pic.jpg" and put it in the img folder.
-Write your biography here. Tell the world about yourself. Link to your favorite <a href="http://reddit.com" target="blank">subreddit</a>. You can put a picture in, too. The code is already in, just name your picture "prof_pic.jpg" and put it in the img folder.
 
-Link to your social media connections, too. This theme is set up to use <a href="http://fortawesome.github.io/Font-Awesome/" target="blank">Font Awesome icons</a>, like the ones below. Add your Facebook, Twitter, LinkedIn, or just disable all of them.
+Link to your social media connections, too. This theme is set up to use [Font Awesome icons](http://fortawesome.github.io/Font-Awesome/){:target="\_blank"} and [Academicons](https://jpswalsh.github.io/academicons/){:target="\_blank"}, like the ones below. Add your Facebook, Twitter, LinkedIn, Google Scholar, or just disable all of them.
-
-
-<br/>
-<hr/>
-<br/>
-<span class="contacticon center">
-  <a href="mailto:you@example.com"><i class="fa fa-envelope-square"></i></a>
-  <a href="https://github.com" target="_blank"><i class="fa fa-github-square"></i></a>
-  <a href="https://www.linkedin.com" target="_blank"><i class="fa fa-linkedin-square"></i></a>
-  <a href="https://twitter.com" target="_blank"><i class="fa fa-twitter-square"></i></a>
-</span>
-
-<div class="col three caption">
-  You can even add a little note about which of these is the best way to reach you.
-</div>

_sass/_base.scss

@@ -145,6 +145,11 @@ article a {
     }
 }
 
+.social a {
+  color: $text-color;
+
+  &:hover { color: $theme-color; }
+}
 
 
 /**

_sass/_layout.scss

@@ -70,6 +70,24 @@ display: line;
     }
 }
 
+/**
+ * News block   **********************************************************
+ */
+ .news {
+   border-top: 1px solid $grey-color-light;
+   margin-top: 50px;
+   padding-top: 20px;
+ }
+
+/**
+ * Social block **********************************************************
+ */
+.social {
+  border-top: 1px solid $grey-color-light;
+  margin-top: 50px;
+  padding-top: 20px;
+}
+
 /**
  * Site footer  **********************************************************
  */
@@ -88,6 +106,7 @@ width: 100%;
   a { color: #fff; }
   a:hover { color: $theme-color; }
 }
+
 /**
  * Pagination   **********************************************************
  */
@@ -104,6 +123,7 @@ a {
 color: $theme-color;
     }
 }
+
 /**
  * Page content   **********************************************************
  */
@@ -116,18 +136,20 @@ font-size: 20px;
 .post-list {
   margin: 0px 0;
   list-style: none;
+
   > li {
     margin-bottom: $vertical-spacing-unit;
   }
 }
 .contacticon {
-font-size: 60px;
   display: block;
+  font-size: 60px;
   margin: 10px;
 }
 .center{
   text-align: center;
 }
+
 /**
  * Posts  **********************************************************
  */
@@ -164,8 +186,8 @@ font-size: 18px;
   }
 }
 .post-meta {
-font-size: $small-font-size;
   color: $grey-color;
+  font-size: $small-font-size;
   margin-bottom: 0px;
 }
 .post-link {
@@ -183,7 +205,6 @@ font-size: 16px;
   }
 }
 
-
 /**
  * Portfolio grid **********************************************************
 */
@@ -198,24 +219,24 @@ display: table;
   clear: both;
 }
 .project {
-width: 33.33%;
-height: 250px;
-float: left;
-vertical-align: middle;
   box-sizing: border-box;
+  float: left;
+  height: 250px;
   padding: 10px;
+  vertical-align: middle;
+  width: 33.33%;
 }
 .thumbnail {
-width: 100%;
-height: 230px;
   overflow: hidden;
+  height: 230px;
+  width: 100%;
 }
 .thumbnail img{
-width: 500px;
   height: auto;
   position: relative;
     left: -25%;
     top: -5%;
+  width: 500px;
 }
 .thumbnail a{
   float: left;
@@ -238,6 +259,7 @@ text-align: center;
 .thumbnail a:hover span {
   display: block;
 }
+
 /**
  * Portfolio pages **********************************************************
 */

css/academicons.css

@@ -0,0 +1,99 @@
+/*!
+ *  Academicons 1.5.0 by James Walsh - https://github.com/jpswalsh
+ *  Fonts generated using the IcoMoon app - http://icomoon.io/app
+ *  Square icons designed to be used alongside Font Awesome square icons - https://fortawesome.github.io/Font-Awesome/
+ *  License - Font: SIL OFL 1.1, CSS: MIT License
+ */
+
+@font-face {
+	font-family: 'academicons';
+	src:url('fonts/academicons.eot?qbqm87');
+	src:url('fonts/academicons.eot?#iefixqbqm87') format('embedded-opentype'),
+		url('fonts/academicons.ttf?qbqm87') format('truetype'),
+		url('fonts/academicons.woff?qbqm87') format('woff'),
+		url('fonts/academicons.svg?qbqm87#academicons') format('svg');
+	font-weight: normal;
+	font-style: normal;
+}
+
+.ai {
+	display:inline-block;
+	font:normal normal normal 14px/1 Academicons;
+	font-size:inherit;
+	text-rendering:auto;
+	-webkit-font-smoothing:antialiased;
+	-moz-osx-font-smoothing:grayscale;
+}
+
+.ai-google-scholar:before {
+	content: "\e600";
+}
+.ai-google-scholar-square:before {
+	content: "\e601";
+}
+.ai-researchgate:before {
+	content: "\e612";
+}
+.ai-researchgate-square:before {
+	content: "\e613";
+}
+.ai-mendeley:before {
+	content: "\e604";
+}
+.ai-mendeley-square:before {
+	content: "\e605";
+}
+.ai-orcid:before {
+	content: "\e606";
+}
+.ai-orcid-square:before {
+	content: "\e607";
+}
+.ai-impactstory:before {
+	content: "\e608";
+}
+.ai-impactstory-square:before {
+	content: "\e609";
+}
+.ai-academia:before {
+	content: "\e60a";
+}
+.ai-academia-square:before {
+	content: "\e60b";
+}
+.ai-zotero:before {
+	content: "\e60c";
+}
+.ai-zotero-square:before {
+	content: "\e60d";
+}
+.ai-figshare:before {
+	content: "\e60e";
+}
+.ai-figshare-square:before {
+	content: "\e60f";
+}
+.ai-dryad:before {
+	content: "\e610";
+}
+.ai-dryad-square:before {
+	content: "\e611";
+}
+.ai-arxiv:before {
+	content: "\e616";
+}
+.ai-arxiv-square:before {
+	content: "\e617";
+}
+.ai-scirate:before {
+	content: "\e614";
+}
+.ai-scirate-square:before {
+	content: "\e615";
+}
+.ai-researchgate-old:before {
+	content: "\e602";
+}
+.ai-researchgate-old-square:before {
+	content: "\e603";
+}