Is there currently a way to use the AddToAny floating share bar?

Right now it appears that when I select a content type, I also have to select an area _within_ that content type for the sharing icons. What I'm looking for is the ability to add a floating share bar as in the link above for specific content types.

Happy to submit a PR if the functionality doesn't currently exist it would be welcomed!

CommentFileSizeAuthor
#2 wordpress-floating-share-bar-options.png146.53 KBmicropat
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

YPCrumble created an issue. See original summary.

micropat’s picture

micropat CreditAttribution: micropat commented
Title: Allow Floating Share Bar option » Floating Share Bar option
Status: Active » Needs work
FileSize
wordpress-floating-share-bar-options.png146.53 KB

Right now a custom block is the best way.

In Drupal 7, Admin > Structure > Blocks > Add block > Text format: Full HTML > Block body:

<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style" style="left:0px; top:150px;">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_button_google_plus"></a>
    <a class="a2a_button_pinterest"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

In Drupal 8, Admin > Structure > Block layout > Custom Block library > Add custom block > Text format: Full HTML > Source > use the above example HTML code.

Patches for an AddToAny floating share block will be welcomed. :) For guidance, check out the floating bar fields that the WordPress plugins offers.

VladimirAus’s picture

VladimirAus
Primary language English
Location Brisbane 🇦🇺
CreditAttribution: VladimirAus at Tomato Elephant Studio commented
Status: Needs work » Postponed (maintainer needs more info)

Is this still an issue?

micropat’s picture

micropat CreditAttribution: micropat commented
Version: 7.x-4.x-dev » 8.x-1.x-dev
Status: Postponed (maintainer needs more info) » Needs work
chike’s picture

chike
Primary language English
Location Nigeria
CreditAttribution: chike at Skillmatic Ace commented

Using Drupal 10.1.1, CKEditor wipes out the code at #2 if inserted through the UI. I haven't tried making the block programmatically.

micropat’s picture

micropat CreditAttribution: micropat commented
Version: 8.x-1.x-dev » 2.0.x-dev

Since Drupal now strips empty elements in a Full HTML block, a workaround is to add some span.a2a_label text elements which are visually hidden by AddToAny.

<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style" style="left:0px;top:150px;">
    <a class="a2a_button_facebook">
        <span class="a2a_label">Facebook</span>
    </a>
    <a class="a2a_button_pinterest">
        <span class="a2a_label">Pinterest</span>
    </a>
    <a class="a2a_button_whatsapp">
        <span class="a2a_label">WhatsApp</span>
    </a>
    <a class="a2a_dd">
        <span class="a2a_label">AddToAny</span>
    </a>
</div>

Just insert the code with Source enabled in editor toolbar and Full HTML set for Text format.

chike’s picture

chike
Primary language English
Location Nigeria
CreditAttribution: chike at Skillmatic Ace commented

Thank you this worked!