Jump to content

Help Center Eventbrite Embedded Button on Website

Recommended Posts

Hi team,

We've tried to style the button to be centred on the page, but it doesn't seem to work. Is there any chance anyone can help admen the CSS code for it to actually trigger and center itself on the page?

 

Thanks,

 

 

Code:

<!-- Add CSS style to make the button on brand -->
<style>
  #eventbrite-widget-modal-trigger-712614187217 {
    font-size: 20px;
    padding: 10px 20px;
    background-color: #5e4936;
    color: white;
    border: none;
    cursor: pointer;
    
     /* Center align the button */
    display: flex;
    justify-content: center;
    align-items: center;
  }
</style>

<!-- Noscript content for added SEO -->
<noscript><a href="https://www.eventbrite.ca/e/bespoke-market-in-squamish-tickets-712614187217" rel="noopener noreferrer" target="_blank">Buy Tickets on Eventbrite</a></noscript>
<!-- You can customize this button any way you like -->
<button id="eventbrite-widget-modal-trigger-712614187217" type="button">Buy Tickets</button>

<script src="https://www.eventbrite.ca/static/widgets/eb_widgets.js"></script>

<script type="text/javascript">
    var exampleCallback = function() {
        console.log('Order complete!');
    };

    window.EBWidgets.createWidget({
        widgetType: 'checkout',
        eventId: '712614187217',
        modal: true,
        modalTriggerElementId: 'eventbrite-widget-modal-trigger-712614187217',
        onOrderComplete: exampleCallback
    });
</script>

Link to comment
  • Replies 1
  • Views 1.3k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.