Access Plan Button
Access Plan Button
Renders one button linked to the checkout page of an access plan you pick. It extends Elementor's Button widget, so you can either style the button with the full Elementor Button controls or let LifterLMS render it with its own button markup.
Usage
Single call-to-action on a sales page — Place the button anywhere on the site (a landing page, a pricing section, a sidebar) and point it at one plan. To show every plan on a course with prices and features, use the Course Access Plans widget or the Pricing Table widget instead.
Button that matches the rest of your Elementor design — Leave Render on Custom button and use the Elementor Button style controls (typography, colours, border, hover state).
Button that matches LifterLMS's own buttons — Set Render to LifterLMS render so the button uses LifterLMS's button classes and the plan's own enroll text, consistent with buttons elsewhere in your LifterLMS pages.
Enroll button inside a course template — Because the plan is picked per widget, the button does not follow the current course. For a button that adapts to whichever course is being viewed, use a Button widget with the plan dynamic tags (for example Course First Featured Plan URL as the link and Course First Featured Plan Enroll Text as the label).
How it works
| Situation | Behaviour |
|---|---|
| Plan selected | The button links to that plan's LifterLMS checkout URL. The Access plan list contains every access plan on the site, across all courses and memberships, sorted by title. |
| No plan selected | LifterLMS render outputs nothing. Custom button still renders the button, but with an empty link. |
| Visitor is already enrolled | The button does not change or hide; it still links to checkout, where LifterLMS handles the already-enrolled case. To hide it for enrolled students, add a Conditional Logic rule on the Advanced tab. |
| Plan is set to Use for Group Enrolment in LifterLMS Groups | The button links to checkout as usual, but no seat-count field is shown. The seat selector is inserted only by the Course Access Plans widget — see How to Sell Seat-Based Group Enrollment. |
| Elementor element caching | The widget is registered as dynamic content, so the link is resolved on every page load rather than served from Elementor's element cache. |
Settings
Content
| Setting | Description |
|---|---|
| Access plan | The plan the button links to. Lists every LifterLMS access plan on the site by title. Default: none selected. |
| Render | LifterLMS render outputs the [lifterlms_access_plan_button] shortcode, so the button uses LifterLMS's markup and CSS. Custom button (default) outputs Elementor's Button widget with the link replaced by the plan's checkout URL. The Button section below changes with this choice. |
Button — shown when Render is LifterLMS render
| Setting | Description |
|---|---|
| Use custom text | Off by default. When Off, the button shows the plan's own enroll text as set in the plan's LifterLMS settings. When On, reveals Custom text. |
| Custom text | The button label. Shown only when Use custom text is On; if left empty the plan's enroll text is used. |
| CSS Classes | Extra classes added to the button, separated by spaces and without the leading dot. Default: Join. |
| Size | Default, Small, or Large — LifterLMS's button sizes. |
| Type | Primary (default), Secondary, Action, or Danger — LifterLMS's button colour styles. Your theme or custom CSS may change these colours. |
Button — shown when Render is Custom button
These are Elementor's own Button widget controls; see Elementor's Button widget help. The Link field is hidden because the widget sets it from the selected plan.
| Setting | Description |
|---|---|
| Type | Default, Info, Success, Warning, or Danger — Elementor's preset button colour styles. |
| Text | The button label. Accepts dynamic tags. |
| Alignment | Left, center, right, or justified within the container, per device. |
| Size | Elementor's button sizes, from Extra Small to Extra Large. |
| Icon | Optional icon from the icon library or an uploaded SVG, with Icon Position and Icon Spacing once an icon is set. |
| Button ID | An HTML id for the button, useful for analytics events. Accepts dynamic tags. |
Style — shown when Render is Custom button
With LifterLMS render the Style tab is empty; the button takes its appearance from LifterLMS and your theme.
| Setting | Description |
|---|---|
| Typography, Text Shadow | Font settings and shadow for the button label. |
| Text Color, Background Type, Border Color | Colours for the Normal and Hover states; hover also has a Hover Animation option. |
| Border Type, Border Radius, Box Shadow | Border style, width and colour, corner rounding, and drop shadow. |
| Padding | Inner spacing between the label and the button edges. |
Advanced
The Advanced tab holds Elementor's own layout, motion, responsive and custom-CSS controls — see Elementor's documentation. Lifter Elements adds one section, Conditional Logic, which shows or hides this widget by the visitor's LifterLMS status — see the Conditional Logic reference.
Notes
- The plan list is site-wide, not filtered by the current course. If a plan is renamed in LifterLMS, the widget keeps working because it stores the plan ID.
- For a whole set of plans with pricing, features and per-plan buttons, see Course Access Plans (one course's plans) or Pricing Table.
- To build a plan button from dynamic data instead of a fixed plan, see the featured plan dynamic tags.