Add CSS Button to Membership Area
Add a clickable button to your membership area courses.
Button Content Code:
Sites> Memberships>Settings>Site Settings> Custom JS
(Paste everything between the solid lines)
______________________________________________________________________________
var ButtonName = "Button Title"
var ButtonLink = "Button URL"
var body = document.querySelector("body");
body.addEventListener("DOMNodeInserted", function(event) {
var postPlaylistContainer = document.querySelector(".post-playlist-container");
if (event.target?.id "product-breadcrumbs" || event.target?.id "post-completion-button") {
//Code Test
console.log("Code Working Fine")
//New Element Create For DOM Insert
var newPromotElement = document.createElement("div");
newPromotElement.classList.add("post-materials-container", "block", "mt-5");
//Button link Create
var New_Button_URI = document.createElement("a");
New_Button_URI.target = "_blank";
New_Button_URI.href = ButtonLink;
newPromotElement.appendChild(New_Button_URI);
//Create New Button
var newButtonElement = document.createElement("button");
newButtonElement.id = 'Custom-BTN';
newButtonElement.textContent = ButtonName;
New_Button_URI.appendChild(newButtonElement);
//DOM inserted Here
postPlaylistContainer?.appendChild(newPromotElement);
}
}, false);
_________________________________________________________________________________
Button Style Code:
Sites> Memberships>Settings>Site Settings> Custom CSS
(Paste everything between the solid lines)
______________________________________________________________________________
#navigation-header{
background: #fff !important;
}
#Custom-BTN{
width: 100%;
text-align: center;
background: #FFB758;
padding: 1rem;
font-size: 25px;
text-transform: uppercase;
font-weight: 700;
color: #fff;
}
____________________________________________________________________________
🙋HAVE QUESTIONS?
To access the High Level knowledgebase: CLICK HERE
Join us for open office hours (Free to everyone): Join Us
Join us for our weekly QA session (Members Only): Join Us
Book a private consultation (Build It With Me): Book Here