Adopt a Pet provides you with a customizable Portable Pet List tool, which generates code you can copy and paste into your website HTML to display your adoptable pets embedded in a scrolling iframe on your organization's own website.
The tool lets you customize several options, but if you are comfortable carefully typing over numbers in the code it generates, you can also adjust the size of the iframe it creates. It defaults to 450 width for easier viewing on a phone, so keep that in mind.
Note: Do NOT change the numbers where it says 'size'.
To adjust the width, change the 450 in three places. Like to 500.
To change the height, change the 320 in TWO places. Like to 600 or more.
Below is an example. DO NOT USE THIS CODE. Use you own Portable Pet List code.
<script language="JavaScript">
var AAPPetScrollerSettings = {
'searchtools_box_width': '450',
'searchtools_box_height': '320',
'size': '450x320_listnew',
'title': '',
'clan_name': '',
'color': 'blue',
'shelter_id': 'THISISAUNIQUENUMBER',
'sort_by': 'pet_name'
};
</script>
<div style="height: 320px; width: 450px; -webkit-overflow-scrolling: touch; overflow-y: scroll;">
<script language="JavaScript" src="https://images.adoptapet.com/js/st-portable-pet-list.js "></script></div>
<div style="background-color:#fff; width:450px; text-align:center; height:53px;"><p style="font-family:Helvetica, Arial, Geneva, sans-serif; font-size:12px; color: #444444;">Pet adoption and rescue powered by <a href="https://www.adoptapet.com/ " title="Pet adoption and rescue powered by Adopt-a-Pet.com"><img src="https://images.adoptapet.com/images/st-logo-lg.gif " alt="Adopt-a-Pet.com" width="150" height="37" border="0" style="vertical-align:middle; margin-left:15px;" /></a></p></div>
<script language="JavaScript">
var AAPPetScrollerSettings = {
'searchtools_box_width': '450',
'searchtools_box_height': '320',
'size': '450x320_listnew',
'title': '',
'clan_name': '',
'color': 'blue',
'shelter_id': 'THISISAUNIQUENUMBER',
'sort_by': 'pet_name'
};
</script>
<div style="height: 320px; width: 450px; -webkit-overflow-scrolling: touch; overflow-y: scroll;">
<script language="JavaScript" src="https://images.adoptapet.
<div style="background-color:#fff; width:450px; text-align:center; height:53px;"><p style="font-family:Helvetica, Arial, Geneva, sans-serif; font-size:12px; color: #444444;">Pet adoption and rescue powered by <a href="https://www.adoptapet.