Log in
go back

Back

Customize the Page Where Your Members Download their Membership Card

Leverage this template to customize your /account/membership/# page with a custom template.

First off, to enable this template on your website, make sure you set the page keyword to membercard under the SEO & Options.  This will then override our out of the box page with this custom screen.  Enjoy.


	<div class="container" data-pv-component="membership" data-pv-type="membershipcard" data-pv-parameters="">		<div class="row">			<div class="col-sm-12 col-md-8 col-lg-5 col-xl-4 mb-4">				<div class="card card-shadow digital-id">					<div class="card-header">						<img class="digital-id-symbol" src="https://members.thefbrk.com/media/212147/media/1008/assets/img/fbrk-symbol.png" />					</div><!-- // .card-header -->					<div class="card-body">						<h2 class="card-title" data-pv-element="membership_details.customer_name">Israel Idonije</h2>						<ul class="digital-id-list">							<li data-pv-element="membership_details.membership_title">Network Member</li>							<!--<li>Access Member</li>-->							<!--<li>Private Office</li>-->						</ul><!-- // .digital-id-list -->						<div class="digital-id-details">							<span class="card-subtitle d-block"><strong>MEMBER # {@membership_details.membership_id@}</strong></span>							<span class="card-subtitle d-block"><strong>MEMBER SINCE: <span data-pv-element="membership_details.created_on" data-pv-formatter="date(MMM d, yyyy)">Aug 23, 2018</span></strong></span>						</div><!-- // .digital-id-details -->					</div><!-- // .card-body -->					<div class="card-footer row">						<img class="digital-id-qrcode d-inline" src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl=/verify.aspx%3Freference_type%3Dmembership%26reference_no%3D{@membership_details.membership_card_no@}%26serial_number%3DM{@membership.membership_no@}|{@membership_details.membership_id@}%26customer_no%3D{@membership_details.customer_no@}&choe=UTF-8" />						<div class="digital-id-logo">							<img class="img-fluid" src="https://members.thefbrk.com/media/212145/media/1008/assets/img/fbrk-logo.png" alt="FBRK" />						</div>					</div><!-- // .card-footer -->				</div><!-- // .card -->			</div><!-- // .col -->			<div class="col-lg-6 col-xl-6">				<h4>Add to your Phone</h4>				<p class="lead text-black">Did you know that if you open this on your mobile phone, you can save it directly to Apple Wallet or Pass Wallet on Android? Visit your account to login via your mobile device.</p>				<div class="row">					<div class="col-xl-8">						<h4 class="mt-4">Get a link to open on your phone:</h4>						<a href="?generate=memcard" class="btn btn-primary btn-block"><strong>Download Digital ID</strong></a>					</div><!-- // .col -->					<div class="col-xl-8 mt-3">						<h4 class="mt-4">or send to yourself via:</h4>						<a href="?send=sms" class="btn btn-outlined">Text</a>						<a href="?send=email" class="btn btn-outlined">Email</a>					</div><!-- // .col -->				</div><!-- // .row -->			</div><!-- // .col -->		</div><!-- // .row -->	</div><!-- // .container -->

Additional Help Tutorials

Find more ways to grow on PeopleVine.

Configure Salto to Work with Peoplevine Check-In

Follow these steps to configure your Salto to auto Check-In members when they use a Salto keycard.

Posted January 12, 2024

© Peoplevine 2025. Powered by PeopleVine. Terms of use | Privacy & cookies