The Subscribfy app has an already built Manange Membership page with a default structure and styles.
In the theme customization, the app embeds section contains an embed from Subscribfy: Membership Dash Link. Enabling this will add a Link in the Account page that will lead the customer to the Default Manage Membership page built by Subscribfy.
In the case you would like to place the link to the Manage Membership page yourself in the code of the theme, or in other parts of the store you can use this simple liquid code:
<div class="exm_dashboard_link">
<a href="/apps/subscribfy-api/store/manage-membership-dashboard?cid={{customer.id}}&exm=1&hash={{customer.metafields.exison.exison_hash}}">
Manage Membership
</a>
</div>
Liquid variables included in the code:
The variables are already placed in the code above, you can safely copy/paste the code in the theme files and the functional link will appear in the desired location.
This default page already implements the Subscribfy AP for Managing membership: Canceling, Pausing, Updating Payment Method and other. There is no need for further implementation while using this Default Page.
The default Page comes with a default CSS file: manage-membership-dashboard.css
This CSS file cannot be modified, but styles placed in this file may be overwritten by other custom styles coming from your Themes files, for further customization of the Page. The selectors from the page may be used for custom styles on the page
Here is a skeleton CSS file with a couple of selectors that may be used to change the styles of the Default page, in order to get a more customized Page:
.exm_customer_info {
}
.exm_customer_name {
}
.exm_customer_email {
}
.exm_membership_status_block {
}
.exm_cms {
}
.exm_mn_wrapper {
}
.exm_membership_name {
}
.exm_membership_name__addition {
}
.exm_membership_image {
}
.exm_membership_status_separator {
}
.exm_m_active {
}
.exm_customer_action_manage {
}
.exm_cms_pd {
}
.exm_cnp {
}
.exm_customer_action {
}
.exm_skip_month_wrapper {
}