Add a printable membership card to your members-only area using a custom HTML template with merge data fields.
Creating the membership card article
- Go to Website > Articles.
- Select New and name the article "Membership Card".
-
Select the HTML icon in the toolbar and paste the following code:
<h2>ART Membership Card</h2> <div id="printArea"> <div style="font-family: Verdana, Arial, sans-serif; font-size: 10pt;"> <table style="border-width: medium; border-style: dashed; height: 239px; width: 922px;" border="1" frame="border" cellspacing="5"> <tbody> <tr valign="top"> <td style="width: 430px; height: 120px; text-align: left;" align="left" valign="top"> <div style="font-size: 10pt; text-align: center; margin-top: 10px;"><img style="margin: 0px 0px 0px 0px;" title="" src="https://irby.memberclicks.net/assets/site/art-5.png" alt="" align="" /></div> <div style="font-size: 10pt; text-align: center; margin-top: 10px;"><span style="font-size: 10pt;">Thank you for your membership payment. Your membership is valid until the date shown on the card.</span></div> </td> <td style="width: 430px; text-align: center; height: 120px;" align="left" valign="top"> <h2>ART Membership Card</h2> <p> <strong>Member Name:</strong> ##[Name | First]## ##[Name | Last]##<br /><strong>Expires:</strong> ##[Expiration Date]##<br /><strong>Membership Level:</strong> ##[Member Type]## </p> <div style="font-size: 10pt; margin: 10px;">_________________________________________<br />Signature of Member</div> </td> </tr> </tbody> </table> </div> </div> <p><input onclick="coderHakan()" type="button" value="Print" /></p> <script type="text/javascript">// <![CDATA[ function coderHakan() { var sayfa = window.open('','','width=925,height=240'); sayfa.document.open("text/html"); sayfa.document.write(document.getElementById('printArea').innerHTML); sayfa.document.close(); sayfa.print(); } // ]]></script> - Select Apply.
- Modify the images and fonts as needed, then select Save.
Note: Replace "ART" in the heading and card title with your organization's name. Update the
src URL in the image tag to point to your own logo in the Media Manager.To give members access to the card, link the article to a menu item. See Linking an article to a menu item.