If you're using one of our stock themes, first you'll need to create a custom theme, so that you can edit the Flash + Share template.
Once that's done, head to Theme > Current custom theme and open up the _flash_share.html file. From there, you can replace all the code in that template with one of the following snippets, based on a few of our stock themes.
Publish
<div class="flash-share">
<div class="share">
<button class="flash-close">×</button>
<h3 class="headline">{{ flash.message }}</h3>
Please Share:
<div class="row-fluid padbottom">
<div class="span4">
<a class="button center" style="display:block" href="mailto:?subject={{ flash.page.headline }}%20on%20{{ site.name }}&body={{ flash.page.default_face_tweet_text }}%0A%0A{{ flash.page.full_url_with_recruiter }}" target="_blank"><i class="fa fa-envelope"></i> Email</a>
</div>
<div class="span4">
<a class="button center" style="background:#3b5998;display:block" href="http://www.facebook.com/share.php?u={{ flash.page.full_url_with_recruiter | urlencode }}" target="_blank"><i class="fa fa-facebook"></i> Facebook</a> </div> <div class="span4"> <a class="button center" style="background:#00aced;display:block" href="{{ flash.page.tweet_url }}" target="_blank"><i class="fa fa-twitter"></i> Twitter</a>
</div>
</div>
</div>
</div>
Action
<div id="flashModal" class="flash-share modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="share-left">
<img src="share.png">
<h2 class="headline">{{ flash.message }}</h2>
Please share:
</div>
<div class="share-right">
<div class="row">
<div class="col-md-12">
<a class="submit-button btn btn-block btn-default margintopmore used" href="mailto:?subject={{ flash.page.headline }}%20on%20{{ site.name }}&body={{ flash.page.default_face_tweet_text }}%0A%0A{{ flash.page.full_url_with_recruiter }}" target="_blank"><i class="icon-user"></i> Email</a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a class="submit-button btn btn-block btn-default margintopmore used facebook" href="http://www.facebook.com/share.php?u={{ flash.page.full_url_with_recruiter | urlencode }}" target="_blank"><i class="icon-facebook"></i> Facebook</a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a class="submit-button btn btn-block btn-default margintopmore used twitter" href="{{ flash.page.tweet_url }}" target="_blank"><i class="icon-twitter"></i> Twitter</a>
</div>
</div>
<div class="row margintopless">
<div class="col-xs-12">
<button type="button" class="h6 close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">Close</span></button>
</div>
</div>
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script type="text/javascript">
$(window).load(function(){
$('#flashModal').modal('show');
});
</script>
Bootstrap
<div class="flash-share panel panel-default">
<div class="panel-heading share"><h3 class="panel-title">{{ flash.message }}</h3></div>
<div class="panel-body">
<p>Please share:</p>
<div class="row-fluid">
<div class="col-sm-4 padtop">
<a class="btn btn-block btn-primary" href="mailto:?subject={{ flash.page.headline }}%20on%20{{ site.name }}&body={{ flash.page.default_face_tweet_text }}%0A%0A{{ flash.page.full_url_with_recruiter }}" target="_blank">Email</a>
</div>
<div class="col-sm-4 padtop">
<a class="btn btn-block btn-primary" style="background:#3b5998" href="http://www.facebook.com/share.php?u={{ flash.page.full_url_with_recruiter | urlencode }}" target="_blank">Facebook</a> </div> <div class="col-sm-4 padtop"> <a class="btn btn-block btn-info" style="background:#00aced" href="{{ flash.page.tweet_url }}" target="_blank">Twitter</a>
</div>
</div>
<div class="row-fluid">
<div class="col-sm-12">
<a class="flash-close padtop" style="float:right;"><small>No thanks</small></a>
</div>
</div>
</div> <!-- /.panel-heading share -->
</div> <!-- /.flash-share panel panel-primary -->