How do you align the Super Share Button?

Hi @uftukel

Thanks for using Super Web Share plugin. I clicked on the link you have mentioned above and noticed that our share button is not yet added or not loading when I checked the page mentioned above on multiple devices. Can you please confirm whether it’s already added to the page or not?

Looking forward to hearing from you soon.

Hi Jose. Sorry about that. I removed the plugin when I couldn’t align it or adjust the styling of the button. Anyway, I put it back on a test page and made it visible for all platforms.

The SMS Share button and the Email Share button is some custom stuff that my developer is working on. You can see your Super Web Share button to the right. I can’t adjust the size or padding, how it looks on mobile vs desktop or center align it. These would be nice features of your plugin / widget.

You can see below how the button is left aligned.

Test SMS Share –

Can you take a look and give me your thoughts?

Hi @uftukel

Thanks for installing the plugin again and sharing the URL with us. I’m not sure how you’ve added the share button. Is that via the Elementor widget we offer or via a shortcode or the inline button? Those details will help us to add this to our feature request sheet.

The following CSS will help you set the Super Web Share share button to show at the center

.superwebshare_prompt.superwebshare-button-small {
display: flex;
justify-content: center;
align-items: center;
margin: auto;
}

Please let us know the results.

Hi Jose –

Thanks for getting back to me.

I am using the Elementor Widget and and thanks for the CSS code. I pasted it into the module custom CSS and it fixed the alignment.

My point, though, is that in a future update, perhaps you add the Alignment, buttons size, padding, etc in the styling tab in the elementor widget.

Test SMS Share –

Any idea how I can adjust the typography, and padding to make the button match other buttons? Anyway to put the script into a button?

Thanks

Uf

Hi @uftukel

Good to hear that. I will add this to our feature request document.

If you want to add the native share action and fallback to trigger for any other button you have created on your page, you can add this by adding a CSS class superwebshare_trigger to it. You can follow the steps below:

1. Create a button within the Elementor editor
2. Set the button styling based on your preference
3. Within the Button > Advanced tab > click on the Layout
4. And within that you can see a field to add the CSS classes, then add the superwebshare_trigger to it and save the page.

See screenshot attached for your reference: https://ibb.co/tbfNSFD

Looking forward to hear from you.

thanks. Can you share the fext of the trigger here? It got cut off on the image.

NEVER MIND – I found it: superwebshare_trigger

• This reply was modified 5 months ago by uftukel.

Jose – this works great. It’s exactly what I was looking for. So all anyone has to do is download your plugin and add the superwebshare_trigger to the class and this will work.

You should do a YouTube tutorial video for this. Very nicely done.

5 star functionality, 10-Star Service from you. Thank you!

Test SMS Share –

The fourth gray button is the custom button you helped me with.

Uf

Tada!!! Yes, these are our hidden and silent features ??

Happy to hear that, @uftukel, and it looks fantastic, and thanks for the kind words ??!

We have plans to create tutorials and add a ton of additional features. However, time is a significant factor, as we are focused on preparing a new release with even more features.

If you are satisfied with our support and plugin, we would greatly appreciate it if you could rate us 5 stars here. Your review will help us to reach a wider audience and motivate us to improve and add new features.