[futurefinancepartnersParticipant]

Hi,

I have this calendly code:

<!– Calendly link widget begin –>
<link href=”https://calendly.com/assets/external/widget.css” rel=”stylesheet”>
<script src=”https://calendly.com/assets/external/widget.js” type=”text/javascript”></script>
Schedule time with me
<!– Calendly link widget end –>

I want to embed that into a button instead of the default plain text provided by the code above.

thank you

[ThaiModerator]

Hi There,

It seems like the embed code is incorrect.

Could you please double check?

Thanks.

[futurefinancepartnersParticipant]

Hi Thai,

cut and paste from calendly:

<!– Calendly link widget begin –>
<link href=”https://calendly.com/assets/external/widget.css” rel=”stylesheet”>
<script src=”https://calendly.com/assets/external/widget.js” type=”text/javascript”></script>
Schedule time with me
<!– Calendly link widget end –>

[futurefinancepartnersParticipant]

or sorry the code is
/*
<!– Calendly link widget begin –>
<link href=”https://calendly.com/assets/external/widget.css” rel=”stylesheet”>
<script src=”https://calendly.com/assets/external/widget.js” type=”text/javascript”></script>
Schedule time with me
<!– Calendly link widget end –>

*/

[futurefinancepartnersParticipant]

The browser automatically change the tag to a link.
i removed the a tag below.

<!– Calendly link widget begin –>
<link href=”https://calendly.com/assets/external/widget.css” rel=”stylesheet”>
<script src=”https://calendly.com/assets/external/widget.js” type=”text/javascript”></script>
<a-tag href=”” onclick=”Calendly.showPopupWidget(‘https://calendly.com/instago/60min’);return false;”>Schedule time with me
<!– Calendly link widget end –>

[ThaiModerator]

Hi There,

Please try adding the following code to the raw content element:

<!-- Calendly link widget begin -->
<link href="https://calendly.com/assets/external/widget.css" rel="stylesheet">
<script src="https://calendly.com/assets/external/widget.js" type="text/javascript"></script>
<a href="#" class="x-btn x-btn-blue-green x-btn-real x-btn-square x-btn-regular" onclick="Calendly.showPopupWidget('https://calendly.com/instago/60min');return false;">Schedule time with me</a>
<!-- Calendly link widget end -->

Hope it helps 🙂

P/S: next time you can use the code button to wrap your code:

View post on imgur.com

[futurefinancepartnersParticipant]

perfect
thank you

[futurefinancepartnersParticipant]

actually i spoke to soon.

The code seem to conflict with my existing scroll down javascript for navbar background on scroll down.

my site is: instago.com.au

Hope you can help

[ThaiModerator]

Hi There,

In this case, please add the following code under functions.php file locates in your child theme:

add_action( 'wp_head', 'add_custom_script' );
function add_custom_script(){
	?>
		<link href="https://calendly.com/assets/external/widget.css" rel="stylesheet">
		<script src="https://calendly.com/assets/external/widget.js" type="text/javascript"></script>
	<?php
}

After that add the following code to the raw content element:

<a href="#" class="green-btn" style="padding-top:10px;" onclick="Calendly.showPopupWidget('https://calendly.com/instago/60min');return false;">Book Your Free Consultation</a>

Let us know how it goes!

[futurefinancepartnersParticipant]

Hi Thai,

unfortunately that doesn’t work.

the Calendly script appears to conflict with other javascript

[Rue NelModerator]

Hello There,

To assist you better with this issue, would you mind providing us the url of your site with login credentials, if necessary, so we can take a closer look? This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

To do this, you can make a post with the following info:
– Link to your site

– WordPress Admin username / password (only if necessary)

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thank you.

[futurefinancepartnersParticipant]

This reply has been marked as private.

[RadModerator]

Hi there,

Thanks, may I know where the button is being applied? I checked and this is what I see,

<a href="" onclick="Calendly.showPopupWidget('https://calendly.com/instago/skype-call');return false;">Skype appointment</a>

I clicked it and it displays the pop-up.

May I know some details of the conflict you’re getting?

Thanks!

[futurefinancepartnersParticipant]

hi the conflict is the Navbar.
When you scroll down the page the Navbar background should change from transparent to color background which is triggered by a Script.

[Rue NelModerator]

Hello There,

Thanks for updating in! Please have the JS code updated and use this instead:

(function($) {
    $(window).on('scroll', function() {
        var vtop = $(window).scrollTop();
        if (vtop > 100) {
            $('.x-navbar').addClass("x-navbar-fixed-top");
        } else {
            $('.x-navbar').removeClass("x-navbar-fixed-top");
        }
        console.log(vtop);
    });
})(jQuery);

Do you have any caching plugin or does your server has a caching feature? Please clear your site cache first before testing your site.

Please let us know how it goes.

[Author]

Posts