Language selection

Search

Chat wizard - Provisional feature

Unstable feature

To be used at your own risk. All functionality described bellow can be removed in any subsequent minor/major release and are excluded from the gcweb public API.

The documentation and/or a working example for those feature could be incomplete or not available.

Views all the provisional feature.

Below is the code to achieve the demo on this page with an HTML form.

<section class="provisional wb-chtwzrd hidden">
	<h2 data-wb-chtwzrd-replace="I can help you find the information you need">Help us help you</h2>
	<form class="mrgn-bttm-xl" action="https://google.ca" method="GET">
		<p class="wb-chtwzrd-greetings">Hi! I can help you find resources that are available to help you in your quest to find information.</p>
		<p>If you just want to surf the internet, go to <a href="https://google.ca">Google search</a></p>
		<fieldset id="q1">
			<legend>It would help me out if I knew a little more about you. Are you ready?</legend>
			<ul class="list-unstyled mrgn-tp-md">
				<li>
					<label>
						<input type="radio" name="ask" value="yes" data-wb-chtwzrd-next="q2" />
						<span>Yes</span>
					</label>
				</li>
				<li>
					<label>
						<input type="radio" name="ask" value="no" data-wb-chtwzrd-next="none" />
						<span>No</span>
					</label>
				</li>
				<li>
					<label>
						<input type="radio" name="ask" value="skip" data-wb-chtwzrd-next="q3" />
						<span>Go straight to the point</span>
					</label>
				</li>
			</ul>
		</fieldset>
		<fieldset id="q2">
			<legend>Do you have a preferred language?</legend>
			<ul class="list-unstyled mrgn-tp-md">
				<li>
					<label>
						<input type="radio" name="preference" value="yes" data-wb-chtwzrd-next="q3" />
						<span>Of course</span>
					</label>
				</li>
				<li>
					<label>
						<input type="radio" name="preference" value="" data-wb-chtwzrd-next="none" data-wb-chtwzrd-url="https://canada.ca/home.html" />
						<span>No</span>
					</label>
				</li>
			</ul>
		</fieldset>
		<fieldset id="q3">
			<legend>Which one is it?</legend>
			<ul class="list-unstyled mrgn-tp-md">
				<li>
					<label>
						<input type="radio" name="lang" value="en" data-wb-chtwzrd-next="none" data-wb-chtwzrd-url="https://canada.ca/en.html" />
						<span>English</span>
					</label>
				</li>
				<li>
					<label>
						<input type="radio" name="lang" value="fr" data-wb-chtwzrd-next="none" data-wb-chtwzrd-url="https://canada.ca/fr.html" />
						<span>Français</span>
					</label>
				</li>
			</ul>
		</fieldset>
		<p class="wb-chtwzrd-farewell wb-inv">Thank you! Your personalized results are ready for you.</p>
		<div class="mrgn-tp-md"></div>
		<button type="submit" class="btn btn-sm btn-primary" data-wb-chtwzrd-replace="Show results">Search</button>
	</form>
</section>
Report a problem on this page
Please select all that apply:

Thank you for your help!

You will not receive a reply. For enquiries, please contact us.

Date modified: