Use the following code as a template for customizing multiple share instances using AddToAny's JavaScript API.

Using data attributes

Data attributes provide the quickest way to set multiple AddToAny instances. Using this method, AddToAny's JavaScript only needs to be referenced one time can be placed anywhere on the page that is valid.

<div>Share Page 1:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style" data-a2a-url="http://www.example.com/page_1.html" data-a2a-title="Example Page 1">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<div>Share Page 2:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style" data-a2a-url="http://www.example.com/page_2.html" data-a2a-title="Example Page 2">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<div>Share Page 3:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style" data-a2a-url="http://www.example.com/page_3.html" data-a2a-title="Example Page 3">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript" src="//static.addtoany.com/menu/page.js"></script>

Using JavaScript

Alternatively, you can use JavaScript for the same configuration and to add additional AddToAny properties if needed.

<div>Share Page 1:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
var a2a_config = a2a_config || {};
a2a_config.linkname = 'Example Page 1';
a2a_config.linkurl = 'http://www.example.com/page_1.html';
</script>

<script type="text/javascript" src="//static.addtoany.com/menu/page.js"></script>

<div>Share Page 2:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
a2a_config.linkname = 'Example Page 2';
a2a_config.linkurl = 'http://www.example.com/page_2.html';
a2a.init('page');
</script>

<div>Share Page 3:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
a2a_config.linkname = 'Example Page 3';
a2a_config.linkurl = 'http://www.example.com/page_3.html';
a2a.init('page');
</script>

JavaScript Details

<div>Share Page 1:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
var a2a_config = a2a_config || {};
a2a_config.linkname = 'Example Page 1';
a2a_config.linkurl = 'http://www.example.com/page_1.html';
</script>

For the first button, the a2a_config object needs to be declared once, then the linkname and linkurl properties can be set. This is a good place to set additional AddToAny properties if needed.

<script type="text/javascript" src="//static.addtoany.com/menu/page.js"></script>

This calls the required external script and also initiates the first AddToAny instance. (To initiate on a subsequent buttons, you can use a2a_init('page') instead, as seen below.)

<div>Share Page 2:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
a2a_config.linkname = 'Example Page 2';
a2a_config.linkurl = 'http://www.example.com/page_2.html';
a2a.init('page');
</script>

For the second instance, the linkname and linkurl properties are given new values to setup another AddToAny instance. There is no need to redeclare the a2a_config object.

The call to a2a.init('page') initiates the latest AddToAny instance. Since the external script (static.addtoany.com/menu/page.js) has already been called, a2a.init('page') can be used instead of having to call the external JavaScript again.

<div>Share Page 3:</div>

<div class="a2a_kit a2a_kit_size_32 a2a_default_style">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_dd" href="https://www.addtoany.com/share"></a>
</div>

<script type="text/javascript">
a2a_config.linkname = 'Example Page 3';
a2a_config.linkurl = 'http://www.example.com/page_3.html';
a2a.init('page');
</script>

Again for the third instance, properties of a2a_config are given new values, and a2a.init('page') initiates another AddToAny instance with those values.