Q: Hey Carlo,

Again thank you for the most amazing theme ever written. How can I implement Facebook likes for the main page and not just for every post? If I want it at the top of the page, where do I place it?

Continue doing what you're doing, cause you're doing it spectacularly well.

sempler

Hey Jacob,

First of all, thanks for the kind words :) To get the Like Button in your header, you’ll first need to access the HTML source of the theme. To do this, go into the Theme Tab of the Customize Panel and click Use Custom HTML to reveal the source. Now scroll down until you reach this chunk of code:

{block:IfPagesInTopBar}
{block:HasPages}
<ul class="pages">
	{block:Pages}
	<li><a href="{URL}">{Label}</a></li>
	{/block:Pages}
</ul>
{/block:HasPages}
{/block:IfPagesInTopBar}
		
<!-- PASTE HERE -->

Simply paste the button code below to where I’ve placed PASTE HERE marker.

Button Code

<!-- Twitter Share Button -->
<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://log.carlofranco.ca">Tweet</a>

<!-- Facebook Like Button -->
<iframe scrolling="no" frameborder="0" allowtransparency="true" style="height: 20px; width: 90px;" src="http://www.facebook.com/plugins/like.php?href=http://log.carlofranco.ca&layout=button_count&show_faces=false&width=90&action=like&colorscheme=light&height=20" class="facebook-like-button"></iframe>

I’ve also included Twitter’s share button in the code for anyone else that is interested in it. * Remember to replace “log.carlofranco.ca” with the URL of your own site for both snippets.

Custom CSS

Finish things off with a bit of Custom CSS in the Advanced Tab, and that should do it!

#header .facebook-like-button,
#header .twitter-share-button {
  float: left;
  margin-top: 14px;
}

14 Notes/ Hide

  1. carlofranco posted this

Recent comments

Blog comments powered by Disqus