How can I adjust the positioning of my Flare bar?

Out of the box, Flare gives you a bunch of different placement options for your sharing bars - all you need to do is toggle the position, using the placement selector:

https://s3.amazonaws.com/assets-filament-io/knowledge_base/screenshots/how-can-i-adjust-the-positioning-of-my-flare-bar_1.png

Just click on the box that approximates the position you want for your Flare bar. You can have one position designated for the top, bottom, left and right of your content. Note that the vertical positions are either/or - you cannot put Flare bars on both sides of your content. You can also select from a couple of different page layout templates, to help you get a better sense of where your Flare bar will be placed.

Using Custom CSS
 To really fine-tune the position of your Flare bar, you'll need to add some custom CSS to your page:

<style type="text/css">
.flare[data-orientation="vertical"] { margin-top: 80px !important; }
</style>

You can adjust the "margin-top" property to the desired size. If you wish to adjust the horizontal positioning, use the following code snippet:

<style type="text/css">
.flare[data-orientation="horizontal"] { margin-left: 80px !important; }
</style>

If you want an easy way to apply these code snippets to your site, check out the CodeDrop app!

Feedback and Knowledge Base