Widgets
The building blocks an Alovai site is made of — each one shown working, with the settings you can change. Nothing here is a screenshot — every widget below is the real one, rendered by this page as you load it.
Want to see them doing actual work? Ember & Oak is a complete site built on Alovai, and you can sign in and look behind the scenes.
What a visitor sees and touches.
A header menu that folds into a hamburger, with the items you choose.
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com, probalist.com, xuantify.com.
A questions-and-answers section that search engines can read.
No. You describe the page you want in your own words and Alovai puts it together. You adjust what comes back.
A small "Powered by Alovai" line in your footer. No card, no trial clock.
Yes. Your content is yours and exports as plain files.
What you can change, without code:
Doing real work on demo.alovai.com, probalist.com.
Customer quotes in two rows that drift past each other.
“This is where a quote from a real customer goes. You paste it in the editor; the section handles the layout, the scrolling and the mobile view.”
“Add as many as you like. Two rows scroll in opposite directions, and the speed is a setting.”
“This is where a quote from a real customer goes. You paste it in the editor; the section handles the layout, the scrolling and the mobile view.”
“Add as many as you like. Two rows scroll in opposite directions, and the speed is a setting.”
“No photos required. If you add them, they get cropped to the same circle automatically.”
“No photos required. If you add them, they get cropped to the same circle automatically.”
What you can change, without code:
Doing real work on demo.alovai.com, probalist.com.
A carousel of your own photos, with a lightbox on click.
What you can change, without code:
Doing real work on demo.alovai.com, probalist.com.
A light/dark switch that remembers what the visitor picked.
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com, probalist.com, xuantify.com.
Your page in 109 languages, with a flag to switch back.
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com, probalist.com.
Turning a visitor into someone you can reply to.
An email signup that lands in your dashboard and mails you.
Thanks — we will be in touch.
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com.
A strip that appears once someone has scrolled far enough.
What you can change, without code:
Doing real work on ayni-holistic.com, demo.alovai.com, probalist.com.
A popup for the moment someone is about to leave.
What you can change, without code:
Doing real work on ayni-holistic.com, demo.alovai.com, probalist.com.
A chat bubble that answers from the text on your own pages.
What you can change, without code:
Doing real work on ayni-holistic.com, demo.alovai.com, probalist.com.
Taking money without becoming a webshop.
A price table that reads its products from your Stripe setup.
Reads its products from your Stripe settings, so prices live in one place:
product_ids: ['prod_basic', 'prod_pro'] featured_id: 'prod_pro' period_toggle: true // monthly / yearly
What you can change, without code:
Doing real work on probalist.com.
One place for your products, prices and Stripe keys.
One place for products, prices and keys. The webhook is the only proof of payment:
data-checkout="prod_pro" on your own button mode: 'payment' | 'subscription' // a successful redirect is not proof; the webhook is.
What you can change, without code:
No visible side. You notice these by what they produce.
Meta tags, sitemap, robots.txt and llms.txt, written for you.
This is really in the robots.txt and the JSON-LD of this page, right now:
# Alovai — public site
User-agent: *
Allow: /
Disallow: /storage/
Disallow: /config/
Disallow: /cms/
Disallow: /dashboard/
Disallow: /console/
{
"@type": "Organization",
"name": "Alovai",
"url": "https://alovai.com",
"logo": "https://alovai.com/assets/logo-mark.png"
}
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com, probalist.com, xuantify.com.
Google Analytics 4, held back until the visitor agrees.
The shape of what loads — only after consent, with Consent Mode v2:
gtag('consent', 'default', { analytics_storage: 'denied' });
// visitor agrees →
gtag('consent', 'update', { analytics_storage: 'granted' });
What you can change, without code:
Doing real work on probalist.com.
Heatmaps and session recordings, from Microsoft, free.
Heatmaps and session recordings, behind the same consent:
// loads nothing until alovaiConsent says 'granted'
clarity('consent');
What you can change, without code:
The consent banner every other measuring widget waits for.
The gate every measuring widget waits at before it loads anything:
window.alovaiConsent.get() // 'granted' | 'denied' | null window.alovaiConsent.onChange(fn) // analytics and clarity register here and stay // silent until the visitor decides.
Doing real work on demo.alovai.com, probalist.com.
Sets the theme before the first paint, so nothing flashes white.
What lands in the head before the first paint, so nothing flashes white:
<script>(function(){
var t = localStorage.getItem('theme')
|| (matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
document.documentElement.setAttribute('data-theme', t);
})();</script>
What you can change, without code:
Doing real work on alovai.com, ayni-holistic.com, demo.alovai.com, probalist.com, xuantify.com.
Also on the platform, not yet in this catalogue:
core/buy-button, core/research-feed, core/research-piece, core/research-piece-card, core/research-view.
The demo is an ordinary Alovai site with the same widgets doing real work — a homepage, an about page, a signup that actually sends.
Open the demo Start free