Building out a page using DNN for my job, I don't like their shortcode button options, trying to code one myself. Main importance, I don't know how to code from scratch. I can jack other code together for a functional element, usually.
Code below (alternatively, Codepen) is as far as I've gotten. I want a blue button, white text, and a white hover action, got that far. My issue is in getting the button to GO. I substituted a link to Facebook instead of our site. Really, I just want an easy fill in the blank code we can drop into any block on the site to quickly change colors, link, and shown text. I feel like I'm close, but not quite there. Any suggestions on making my button go??
body {
padding-left: 100px;
}
input#go {
background-color: #4c9ed9;
color: #ffffff;
padding: 20px 40px;
border: 1px solid #111;
}
input#go:hover {
background-color: #ffffff;
color: #4c9ed9;
border: 1px solid #111;
} <html>
<head>
<title>MK Button 2</title>
</head>
<body>
<form>
<input type="button" id="go" onclick="window.location.href='https://www.facebook.org';" value="Register">
</form>
</body>
</html>Your button should 'go' as is - but you might consider using an actual button element rather than an input element with type=button that lives in a form tag. This is easier to drop in.
button#go {
background-color: #4c9ed9;
color: #ffffff;
padding: 20px 40px;
border: 1px solid #111;
}
button#go:hover {
background-color: #ffffff;
color: #4c9ed9;
border: 1px solid #111;
}<button id="go" onclick="window.location.href='https://www.facebook.org';">Register</button>