Jump to content
Sign in to follow this  
manojgupta26

Twitter, Facebook Button in Metabar Below Post Title

Recommended Posts

manojgupta26

Adding Social buttons below the Post title is the most common requirement and I don't think iBlogPro 5 provides a way to add twitter, facebook, Google+ buttons. Can you guys tell me what should I do to add those buttons? I tried using the following function in functions.php of pagelines customize plugin but the alignment is not proper. Site URL: http://bit.ly/w9ATGW iblogproerror1.png add_action('pagelines_loop_before_post_content', 'after_post_title_social'); function after_post_title_social() { if (is_single()) { ?>

<?php } }

Share this post


Link to post
Share on other sites
Danny
Hi Mano, Would it be possible for you to try using the "the_post" hook location instead of "pagelines_loop_before_post_content" and then reply here when you have done so. You may need to then position it with CSS.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
manojgupta26
I have now called the hook 'the_post'. but now the button appears above the post-title. I want to add the twitter button in metabar http://img10.imageshack.us/img10/3043/iblogproerror1.png

Share this post


Link to post
Share on other sites
Jenny
I recommend installing the Action Map plugin from the PageLines Store. This will show you all hook areas live on your site. After installing, you activate it through the admin bar at the top of your live site to see the hook locations.

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
manojgupta26
Simple_mama, This is general answer I would appreciate if you can tell me what code should I write and where.. Since the iBlogPro 5 theme is standard, it should not be rocket science for you.

Share this post


Link to post
Share on other sites
Jenny
Okay.... Put the hook back how you had it and then position it with CSS as Danny stated above. It looks like your twitter button has inline styling so you can position it using a margin-top negative value.

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
manojgupta26
This works well on single post but not on home page...Can you suggest me how can I achieve that?

Share this post


Link to post
Share on other sites
catrina
I think you'll need to use one hook for displaying the buttons on the homepage and another hook for adding it on the single post page so that the buttons in each hook can use different CSS (i.e. be in different DIV layers). You can hide the DIV layer for the buttons in the homepage using CSS that can hide it ONLY on the homepage and the same can be done in the single post page. For example: Code for buttons on homepage: [code]
BUTTON CODE
[/code] Code for buttons on single post page: [code]
BUTTON CODE
[/code] CSS for hiding homepage buttons on single post page: [code]body.home div.buttons-home {display: none}[/code] CSS for hiding single post buttons on homepage: [code]body.SELECTORFORSINGLEPOSTHERE div.buttons-single {display: none;}[/code]

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
manojgupta26
Not Working. I used the following function under the DIV layer as sugested by you. [code]add_action('pagelines_loop_before_post_content', 'after_post_title_social_h'); function after_post_title_social_h() { ?>

Share this post


Link to post
Share on other sites
Simon
Use a different action for the front page, like Catrina said. pagelines_loop_before_post_content will only work on a post_content page/post, it will never work on the main blog index page. [code]add_action( 'the_post', 'after_post_title_social_front'); function after_post_title_social_front() { if ( !is_home() ) return; }[/code]

Share this post


Link to post
Share on other sites
manojgupta26
But the function shows the buttons at wrong position. I want to render the buttons at this position as shown in image.. http://img717.imageshack.us/img717/7350/twitterbuttongb.png [code]add_action( 'the_post', 'after_post_title_social_front'); function after_post_title_social_front () { if (is_home()) { ?>

Share this post


Link to post
Share on other sites
Danny
Hi, Can you add this to your custom css and see if this works please. [code].buttons-home {position: relative;top: 9em;}[/code]

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
manojgupta26
Voila! That was a life saviour

Share this post


Link to post
Share on other sites
manojgupta26
Another issue has popped up.. See the second last post available at the homepage of my site. [url="http://bit.ly/w9ATGW"]http://bit.ly/w9ATGW[/url] The alignment is improper if the post title is of single line..Same is the issues if the title exceeds to three lines or even more..

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×