[alert style=”danger”]This article is intended for HTML web designers:[/alert]
Connect button will still appear using the merge keys, please do not modify this configuration. However, using Java and CSS custom scripts can make the “Connect” button look different on guest’s device browser.
- Add some custom CSS code to the page under a <head> tag.
<style>
.button-go-online{
border-radius: 70px;
padding: 4px 25px 4px 25px;
border: 2px solid #f2d383;
background: none;
color: #f2d383;
float: right;
font-size:20px;
font-family: 'Slaberlin';
font-weight: bold;
}
</style>
- Add Javascript anywhere at the bottom of the HTML inside the <body> tag.
<script>
$('#connectBtn').prop('class','button-go-online').text('CONNECT');
</script>3. “CONNECT” can be replaced with desired text.