Jump to content


Photo

How can I show social icons in post excerpts


  • Please log in to reply
13 replies to this topic

#1 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 01 February 2012 - 01:11 AM

What I want is to show a Tweet, Like and a +1 button on my excerpts when users reads my postloop. I have a plugin that did it before, but now it seems to be broken, after switching to iBlogPro5. I guess I need to do some custom code to achieve this?

#2 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 01 February 2012 - 01:11 AM

My site is http://Apple-Blog.dk

#3 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 01 February 2012 - 01:17 AM

Posted Image

#4 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 01 February 2012 - 02:51 AM

I have looked into all the possible variables in settings and can't find an option to change to accommodate your request. However, I am confident that one of our Professional developers could handle this issue for you. Could you copy a link to this topic into an email going to hello@pagelines.com requesting a quote for professional development services. I believe this requires a hook and custom coding for a new section.

#5 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 01 February 2012 - 11:15 AM

I really want to do this my self without any help from the professionals... It should not be that difficult to achieve what I want if I just put it directly into my iBlogPro5 theme and style it with CSS... But where is the code supposed to go?

#6 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 02 February 2012 - 03:09 AM

Putting it directly in the theme isn't advisable because that change will be lost when the theme is upgraded. This is why rangelone mentioned adding a hook first and using CSS to style it. In order to add a hook, you'll need the Pagelines Customize plugin, which is available from the Store (under the PageLines tab on your Dashboard).

#7 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 02 February 2012 - 11:18 PM

Okay thanks. I will look into this :)

#8 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 03 February 2012 - 03:32 AM

Let us know if you need further assistance.

#9 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 03 February 2012 - 10:31 AM

Hi catrina.

I did used some time to put this code together, but I cannot get it to show up anywhere.

 <?php add_action('get_continue_reading_link', 'social_icons_on_postloop');
	
	function social_icons_on_postloop () {
	
	    ?><div class="social_icons_on_postloop">
	    	<div class="facebook_button"
				<fb:like href="HERE GOES THE POST URL" send="false" layout="button_count" width="450" show_faces="false" action="recommend" font="lucida grande"></fb:like>
	        </div>
	        <div class="twitter_button"
	        	<a href="https://twitter.com/share" class="twitter-share-button" data-url="HERE GOES THE POST URL" data-text="HERE GOES THE POST TITLE" data-via="AppleBlogDK" data-lang="da" data-count="none">Tweet</a>
	<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
	        </div>
	        <div class="google_plus_one_button"
	        	<!-- Placer dette tag, der hvor +1 knappen skal vises -->
	<g:plusone size="medium" annotation="none" href="http://apple-blog.dk"></g:plusone>
	
	<!-- Placer denne visningskommando, hvor det er passende -->
	<script type="text/javascript">
	  window.___gcfg = {lang: 'da'};
	
	  (function() {
	    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
	    po.src = 'https://apis.google.com/js/plusone.js';
	    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
	  })();
	</script>
			</div>
	    </div> <?php
	    ;
	
	} ?>
	
	<style type="text/css">
	.social_icons_on_postloop {
		float:left;
		display:block;
	}
	</style>

Can you tell me where the missing piece of the pussle is?

I also need to pull the post-url and post title from my database and I do not know how to do this.

#10 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 03 February 2012 - 04:13 PM

This CSS code you have at the end must be placed in Custom Code > Custom CSS in the Settings, not the functions.php file:

 <style type="text/css">
	.social_icons_on_postloop {
		float:left;
		display:block;
	}
	</style>


#11 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 05 February 2012 - 09:23 PM

Hi catrina. It does not show up anywhere when the custom code css code is put in the custom CSS field. I think that there must be something wrong with my piece of code. //Aleksander

#12 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 06 February 2012 - 07:52 PM

Aleksander,

Your code, up to Plugins > Editor, then select the plugin and function.php to edit. Make sure it's CHMODed to 777. Same for style.css.

The code below goes into Custom Code in CSS Rules.
 .social_icons_on_postloop {
		float:left;
		display:block;
	}


#13 ahansson89

ahansson89

    Advocate

  • Members

  • 522 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 06 February 2012 - 08:49 PM

Nothing shows up in the excerpt... I tried everything now but it seems that I cannot add a function to 'get_continue_reading_link' or any other functions in the excerpts... however 'the_post' hook works, but that is not the place where I want to put my code!

#14 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 07 February 2012 - 03:26 AM

The "get_continue_reading_link" doesn't work because it isn't a hook. You'll need to find the appropriate hook in this list (it's labeled as an ACTION): http://api.pagelines.com/hooks.