WordPress.org

Forums

AddThis Sharing Buttons
[resolved] How to make it vertical, floating, like the addthis website says it can? (4 posts)

  1. jasonpaulweber
    Member
    Posted 2 years ago #

    This loads faster than Digg Digg or getsocial, or others, but I'm not sure if it's possible to make the buttons vertical and social, as the addthis website suggests..

    • It's quite unclear on how one can accomplish this. I'd like to figure it out so my buttons are on the homepage, every post, page, category archive, etc., floating vertically on the left.
    • Additionally, I don't know of any php code offered so you can manually insert it into single.php or category.php or home.php/index.php; the only option I see is for your sidebar.

    Any guidance in this regard would be greatly appreciated!

    Jason

    http://wordpress.org/extend/plugins/addthis/

  2. Srijith V
    AddThis Samurai
    Plugin Contributor

    Posted 2 years ago #

    Hey Jason, you can use the custom codes in AddThis plugin for this. First you need to get the needed code snippet from https://www.addthis.com/get/sharing

    Let's take this as a sample code.

    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:50px;top:50px;">
    <a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
    <a class="addthis_button_tweet" tw:count="vertical"></a>
    <a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
    <a class="addthis_counter"></a>
    </div>
    <script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js"></script>
    <!-- AddThis Button END -->

    You can now paste it in the custom code box in AddThis Share plugin's settings panel in WordPress admin end. You may need to adjust the position to match your theme. Give a few try with different combination of left:50px;top:50px in the first line of code.

    Let me know if you need further assistance.

  3. jasonpaulweber
    Member
    Posted 2 years ago #

    Yes, Srijith ... I see we're posting on two separate threads. Anyway, thank you for your response!

    I think I understand what to do, but I'm unable to do it. When I put your sample code in, for instance:

    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:50px;top:50px;">
    <a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
    <a class="addthis_button_tweet" tw:count="vertical"></a>
    <a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
    <a class="addthis_counter"></a>
    </div>
    <script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js"></script>
    <!-- AddThis Button END -->
    • The style="left:50px;top:50px;" disappears when I try to save.
    • The <script type="text/javascript" src="//s7.addthis.com/js/300 disappears when I try to save.

    So after I save, this is the resulting code in my WP admin:

    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_floating_style addthis_counter_style">
    <a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
    <a class="addthis_button_tweet" tw:count="vertical"></a>
    <a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
    <a class="addthis_counter"></a>
    </div>
    var addthis_config = {"data_track_addressbar":true};
    
    <!-- AddThis Button END -->

    I'm unsure as to what I'm doing wrong, or if I can just hard-code it somewhere in some file, manually. All of my other plugins are working normally. Thanks again for your time, Srijith!

  4. jasonpaulweber
    Member
    Posted 2 years ago #

    Solved .... just hardcoded the code into the places I wanted it (page.php, single.php, category.php, archive.php, index.php .... just a matter of copy and pasting.

    Then, of course, adjusted the css x & y values to fit the placement I wanted.

    And I got the particular code names (stumbleupon_badge, etc.) from the addthis website.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • AddThis Sharing Buttons
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic