Calendly: როგორ ჩავდოთ განრიგის ამომხტარი ფანჯარა ან ჩაშენებული კალენდარი თქვენს ვებსაიტზე ან WordPress საიტზე

Calendly დაგეგმვის ვიჯეტი

რამდენიმე კვირის წინ ვიყავი საიტზე და შევამჩნიე, როდესაც მათთან შეხვედრის დასაგეგმად დავაწკაპუნე ბმულზე, რომ არ ვიყავი მიყვანილი დანიშნულების ადგილზე, იყო ვიჯეტი, რომელმაც გამოაქვეყნა კალენდარულად გრაფიკი პირდაპირ ამომხტარ ფანჯარაში. ეს შესანიშნავი ინსტრუმენტია… ვინმეს თქვენს საიტზე შენარჩუნება ბევრად უკეთესი გამოცდილებაა, ვიდრე მათი გადაგზავნა გარე გვერდზე.

რა არის Calendly?

კალენდარულად ინტეგრირდება პირდაპირ თქვენსთან Google სამუშაო სივრცე ან სხვა კალენდარული სისტემა დაგეგმვის ფორმების შესაქმნელად, რომლებიც ლამაზი და მარტივი გამოსაყენებელია. რაც მთავარია, თქვენ შეგიძლიათ შეზღუდოთ დრო, რომლის საშუალებითაც ვინმეს თქვენთან დაკავშირების უფლებას აძლევთ თქვენს კალენდარში. მაგალითად, მე ხშირად მაქვს მხოლოდ რამდენიმე საათი ხელმისაწვდომი კონკრეტულ დღეებში გარე შეხვედრებისთვის.

მსგავსი გრაფიკის გამოყენება ასევე ბევრად უკეთესი გამოცდილებაა, ვიდრე უბრალოდ ფორმის შევსება. ჩემისთვის ციფრული ტრანსფორმაციის საკონსულტაციო ფირმაჩვენ გვაქვს ჯგუფური გაყიდვების ღონისძიებები, სადაც ლიდერთა გუნდი იმყოფება შეხვედრაზე. ჩვენ ასევე ვაერთიანებთ ჩვენი ვებ შეხვედრის პლატფორმას Calendly-ში ისე, რომ კალენდარული მოსაწვევები მოიცავს ყველა ონლაინ შეხვედრის ბმულს.

Calendly-მ გამოუშვა ვიჯეტის სკრიპტი და სტილის ფურცელი, რომელიც შესანიშნავად ასრულებს განრიგის ფორმის პირდაპირ გვერდზე, გახსნილი ღილაკიდან ან თუნდაც თქვენი საიტის ქვედა კოლონტიტულის მცურავი ღილაკიდან. Calendly-ის სკრიპტი კარგად არის დაწერილი, მაგრამ დოკუმენტაცია მის საიტზე ინტეგრირებისთვის სულაც არ არის კარგი. სინამდვილეში, მიკვირს, რომ Calendly-ს ჯერ არ გამოუქვეყნებია საკუთარი დანამატები ან აპლიკაციები სხვადასხვა პლატფორმისთვის.

ეს წარმოუდგენლად სასარგებლოა. ხართ თუ არა საშინაო სერვისებში და გსურთ მიაწოდოთ საშუალება თქვენს კლიენტებს, რომ დანიშნოთ შეხვედრა, ძაღლების მოსიარულე, SaaS კომპანია, რომელსაც სურს, რომ ვიზიტორებმა დაგეგმონ დემო ვერსია, ან დიდი კორპორაცია მრავალი წევრით, რომლებიც მარტივად უნდა დაგეგმოთ… Calendly და ჩაშენებული ვიჯეტები შესანიშნავი თვითმომსახურების ინსტრუმენტია.

როგორ ჩავდოთ Calendly თქვენს საიტზე

უცნაურია, რომ თქვენ იპოვით მხოლოდ მითითებებს ამ ჩაშენებაზე ღონისძიების ტიპი დონე და არა ფაქტობრივი მოვლენის დონე თქვენს Calendly ანგარიშში. თქვენ იპოვით კოდს ღონისძიების ტიპის პარამეტრების ჩამოსაშლელ სიაში ზედა მარჯვენა კუთხეში.

calendly ჩანერგვა

მას შემდეგ რაც დააწკაპუნებთ, დაინახავთ ჩაშენების ტიპების ვარიანტებს:

ამომხტარი ტექსტის ჩასმა

თუ თქვენ აითვისებთ კოდს და ჩადებთ მას სადაც გინდათ თქვენს საიტზე, რამდენიმე პრობლემაა.

  • თუ გსურთ რამდენიმე სხვადასხვა ვიჯეტის გამოძახება ერთ გვერდზე... შესაძლოა გქონდეთ ღილაკი, რომელიც გაუშვებს განრიგის (Popup Text) და ასევე ქვედა კოლონტიტულის ღილაკს (Popup Widget)... თქვენ დაამატებთ სტილის ცხრილს და რამდენიმე სკრიპტს. ჯერ-ჯერობით. ეს ზედმეტია.
  • გარე სკრიპტისა და სტილის ფურცლის ფაილების თქვენს საიტზე გამოძახება არ არის ყველაზე ოპტიმალური საშუალება თქვენს საიტზე სერვისის დასამატებლად.

ჩემი რეკომენდაცია იქნება, ჩატვირთოთ სტილის ცხრილი და Javascript თქვენს სათაურში… შემდეგ გამოიყენეთ სხვა ვიჯეტები, სადაც მათ აზრი აქვთ თქვენს საიტზე.

როგორ მუშაობს Calendly-ის ვიჯეტები

კალენდარულად აქვს ორი ფაილი, რომლებიც საჭიროა თქვენს საიტზე ჩასართავად, stylesheet და Javascript. თუ თქვენ აპირებთ მათ ჩასმას თქვენს საიტზე, მე დავამატებ შემდეგს თქვენი HTML-ის თავში:

<link href="https://calendly.com/assets/external/widget.css" rel="stylesheet">
<script src="https://calendly.com/assets/external/widget.js" type="text/javascript"></script>

თუმცა, თუ WordPress-ში ხართ, საუკეთესო პრაქტიკა იქნება თქვენის გამოყენება functions.php ფაილი WordPress-ის საუკეთესო პრაქტიკის გამოყენებით სკრიპტების ჩასასმელად. ასე რომ, ჩემი ბავშვის თემაში მე მაქვს შემდეგი კოდის სტრიქონები სტილის ფურცლისა და სკრიპტის ჩასატვირთად:

wp_enqueue_script('calendly-script', '//assets.calendly.com/assets/external/widget.js', array(), null, true);
wp_enqueue_style('calendly-style', '//assets.calendly.com/assets/external/widget.css' );

ეს აპირებს მათ ჩატვირთვას (და ქეშირებას) მთელ ჩემს საიტზე. ახლა შემიძლია ვიჯეტების გამოყენება სადაც მინდა.

Calendly-ის ქვედა კოლონტიტულის ღილაკი

მე მსურს დავარქვათ კონკრეტული მოვლენა, ვიდრე ღონისძიების ტიპი ჩემს საიტზე, ამიტომ ვტვირთავ შემდეგ სკრიპტს ჩემს ქვედა კოლონტიტულში:

<script type="text/javascript">window.onload = function() { Calendly.initBadgeWidget({ url: 'https://calendly.com/highbridge-team/sales', text: 'Schedule a Consultation', color: '#0069ff', textColor: '#ffffff', branding: false }); }</script>

თქვენ დაინახავთ კალენდარულად სკრიპტი იშლება შემდეგნაირად:

  • URL – ზუსტი მოვლენა, რომლის ჩატვირთვა მინდა ჩემს ვიჯეტში.
  • ტექსტი – ტექსტი, რომელიც მინდა ღილაკს ჰქონდეს.
  • ფერი – ღილაკის ფონის ფერი.
  • ტექსტი ფერი - ტექსტის ფერი.
  • ბრენდინგის – Calendly-ის ბრენდინგის მოხსნა.

Calendly's Text Popup

მე ასევე მინდა ეს ხელმისაწვდომი იყოს მთელ ჩემს საიტზე ბმულის ან ღილაკის გამოყენებით. ამისათვის თქვენ იყენებთ onClick ღონისძიებას თქვენს საიტზე კალენდარულად წამყვანი ტექსტი. ჩემსას აქვს დამატებითი კლასები ღილაკის სახით გამოსატანად (ქვემოთ მოცემულ მაგალითში არ ჩანს):

<a href="#" onclick="Calendly.initPopupWidget({url: 'https://calendly.com/highbridge-team/sales'});return false;">Schedule time with us</a>

ეს შეტყობინება შეიძლება გამოყენებულ იქნას ერთ გვერდზე რამდენიმე შეთავაზების მისაღებად. შესაძლოა, თქვენ გაქვთ 3 ტიპის მოვლენა, რომლის ჩასმა გსურთ... უბრალოდ შეცვალეთ URL შესაბამისი დანიშნულების ადგილისთვის და ის იმუშავებს.

Calendly's Inline Embed ამომხტარი

Inline embed ოდნავ განსხვავდება იმით, რომ ის იყენებს div-ს, რომელსაც სპეციალურად უწოდებენ კლასის და დანიშნულების ადგილს.

<div class="calendly-inline-widget" data-url="https://calendly.com/highbridge-team/sales" style="min-width:320px;height:630px;"></div>

კიდევ ერთხელ, ეს სასარგებლოა, რადგან თქვენ შეგიძლიათ გქონდეთ მრავალჯერადი div თითოეულში კალენდარულად გრაფიკი იმავე გვერდზე.

გვერდითი შენიშვნა: მე ვისურვებდი, რომ Calendly-მ შეცვალოს მისი განხორციელების გზა, ასე რომ არ იყოს ტექნიკური. კარგი იქნება, თუ უბრალოდ გქონდეთ კლასი და შემდეგ გამოიყენოთ დანიშნულების href ვიჯეტის ჩასატვირთად. ეს მოითხოვს ნაკლებ პირდაპირ კოდირებას შინაარსის მართვის სისტემებში. მაგრამ… ეს შესანიშნავი ინსტრუმენტია (ამჟამად!). მაგალითად – WordPress მოდული მოკლე კოდებით იდეალური იქნება WordPress გარემოსთვის. თუ გაინტერესებთ, Calendly… მე მარტივად შემეძლო ამის აგება თქვენთვის!

დაიწყეთ Calendly-ით

უარი პასუხისმგებლობაზე: მე ვარ Calendly-ის მომხმარებელი და ასევე მათი სისტემის შვილობილი კომპანია. ამ სტატიას აქვს შვილობილი ბმულები მთელი სტატიის განმავლობაში.