Pages
Manage all individual page layouts from one place, quickly switch between pages, and edit their layout in the YOOtheme Pro page builder.
Features
Explore all features of the YOOtheme Pro website builder and create modern Joomla and WordPress websites and WooCommerce shops.
Site Builder
Templates
Create site-wide templates for posts, category and tag pages, search results, 404 pages and custom post types with the page builder and dynamic content.
Mega Menus
Create content-rich mega menu dropdowns with the full power of the YOOtheme Pro page builder and dynamic content.
Live Search
Unlock a completely new search experience for your site with Live Search! Combine AJAX search results with the power of the YOOtheme Pro page builder and build any search layout possible.
Header and Navbar Layouts
Build sophisticated header and navbar layouts that arrange logos, menus and header content for everything from compact to content-rich navigation.
Footer Builder
Build site-wide footers visually with the full power of the YOOtheme Pro page builder and create create content-rich footer sections for your site.
Menus
Publish menus anywhere on your site, add menu item images and subtitles and create sophisticated dropdowns all in one place.
Dropdown Menus Anywhere
Place multilevel dropdown menus anywhere on your site, from toolbars and footers to custom page builder layouts.
Mobile Header
Create a dedicated mobile header and navbar as an alternative to your desktop header, with its own layout, logo, menu and content.
Search Results Page
Create a custom search result page with the YOOtheme Pro page builder and dynamic content.
Boxed Site Layout
Frame your entire website inside a boxed layout and turn the surrounding background into part of the design with an image or video.
404 Error Page
Design a custom 404 error page with the YOOtheme Pro page builder and turn missing pages into a helpful part of your site.
Page Builder
Page Builder
Design your website visually and build responsive, accessible and well-structured layouts, from individual pages to dynamic templates, in one flexible workflow.
Layout Library
Launch faster with responsive, professionally designed layouts for every part of your website, from complete pages and templates to footers and mega menu dropdowns.
Element Library
Display your content with versatile, ready-to-use page builder elements – from text, images and videos to grids, galleries, sliders, slideshows and more.
Element Preset Library
Speed up your workflow with ready-to-use element presets. Browse variations visually, insert them with a click, and reuse your favorites across projects.
Sublayout Element
Build flexible nested layouts with rows, columns, and elements inside existing layout structures for more freedom in the page builder.
Videos as Animated Images
Bring your images to life with videos. Use them like animated images in hero sections, product galleries, or slideshow backgrounds. All loaded lazy for a great site performance.
Fill Available Column Space New
Create perfectly aligned multi-column layouts in the page builder by expanding the height of elements or pushing content down to fill the available column space.
Content Sliders
Showcase your content in fully responsive sliders with cards or images with text overlays. Move items individually or together as a set.
Unsplash and Pexels Integration
Search, preview and save high-quality free-to-use images from Unsplash and Pexels directly in YOOtheme Pro, and use them anywhere in your layouts.
YOOtheme Image Library
Browse and download handcrafted icons, images and illustrations from all YOOtheme Pro starter websites directly into your layout with just a click.
Icon Library
Add lightweight SVG icons from the built-in icon library across your layouts, which automatically match your site colors.
Focal Point Cropping
Keep the important details of an image visible when it is resized and cropped using focal point.
Flexible Column Layouts
Build responsive column layouts with flexible widths, custom styling, and precise control across every breakpoint.
Transform Elements
Instantly transform any element into another or apply an element preset to explore different layouts without losing your content.
Viewport Height With Automatic Offsets
Create perfectly aligned layouts that fill the first visible screen on any device with viewport-based heights and automatic offsets.
One-Page Navigation with Smooth Scroll
Create a one-page navigation using anchor links which smoothly scroll to specific sections with automatic offsets for sticky headers and active states.
Style Editor
Global Style System
Create a consistent design system for your whole website, with global colors, typography and spacing applied across buttons, forms, cards and other UI components.
Style Editor
Customize your website visually in one place, from colors, spacing and typography to borders and shadows, without writing any custom CSS.
Style Library
Start with a refined, professionally designed style, explore different visual directions and change the complete look of your site with just a click.
Inverse Style
Keep text and UI components readable on light, dark, colorful and image backgrounds with automatically adjusted inverse styles.
CSS Style Effects
Add advanced CSS effects with just a few clicks and create anything from minimal, glassmorphic and neumorphic to bold expressive designs.
Inline SVG Images
Inject SVG images into the markup to style icons, logos and illustrations with your global colors and animate them directly in your layouts.
Box Decorations, Shadows and Masks
Give images and videos a distinctive look with decorative shapes, expressive masks, floating shadows and animated hover borders.
Headline Effects
Design expressive headlines with gradients, outlines and decorative elements that add visual impact and structure to your typography.
Section Overlap Images
Give your layouts a more layered look with section overlaps that create smooth transitions and reflect the character of the selected style.
Effects & Interactions
Scroll-driven Animations
Create smooth scroll-driven animations that respond to the scroll position, with precise visual controls directly in the page builder.
Sticky Scroll Animations
Create immersive scroll experiences by combining sticky elements with scroll-driven animations directly in the page builder.
Lightbox Gallery
Display your images and videos in their best light with modern lightbox gallery including swipe navigation, scrollable zoom, color-adaptive controls and fast, accessible browsing.
Sticky and Transparent Header
Create sticky headers that keep navigation accessible while scrolling, and transparent headers with navbar colors that automatically adapt to any background.
Masonry Grids with Scroll Animations
Create gap-free masonry grids with tightly packed columns and align them at the bottom with smooth scroll animation directly in the page builder.
Sliders and Slideshows with Scroll Animations
Create immersive scroll-driven sliders and slideshows with a stepless animation that move through every slide as you scroll down the page, all with just a click.
Background Colors with Scroll Animations New
Add some extra color to your website with custom background colors for sections and columns and bring them to life with scroll-driven animations.
Animated Grid Filter
Filter Grid and Gallery items by tags with responsive navigation and smooth animations directly on the page.
Image and Video Swap on Hover
Swap images and videos on hover to reveal alternate content with smooth fade and scale transitions, perfect for interactive product previews and portfolio showcases.
Blending Content
Blend sticky transparent headers, sticky columns and elements, or content within elements with the background to create a striking artistic effect.
Cover and Reveal Effects for Sections
Add smooth sticky cover and reveal effects to create engaging scroll transitions between sections with just a click.
Background Image and Video Effects
Enhance background images and videos with color overlays, gradients, scroll effects, and parallax animations, all optimized for fast loading.
Justify Columns on Scroll
Align columns of different heights with a smooth animation as you scroll, so they gradually reach the bottom together.
Sticky Columns and Elements
Make elements and columns sticky while scrolling to create sticky sidebars and advanced sticky scroll animations.
Dynamic Content
Dynamic Content
Load content from Joomla, WordPress or any other source into your layouts and display it dynamically in any builder element.
Dynamic Loops
Loop through dynamic content sources and render posts, products and events in repeated layout parts built with the page builder.
Nested Dynamic Loops for Related Sources
Create nested dynamic loops to display related content inside repeated layouts, like categories with their posts, directly in the page builder.
Custom Fields
Load core and custom fields from any post type or taxonomy into builder elements to create content-driven directory websites.
Date Filter New
Easily filter and display dynamic content depending on any date field, including custom fields. Show posts from the past or future, relative to today, or within a fixed date range.
Related Sources by Taxonomies and Users
Display related content automatically by matching categories, tags, authors, or custom taxonomies without maintaining relationships manually.
Bidirectional Relationship New
Save time with bidirectional relationships between content types. Simply connect them once, and load related content dynamically from both sides.
Parent Sources
Set a content source once and reuse it across all elements inside a layout container to keep dynamic layouts consistent and easy to update.
Custom Sources
Display posts, categories and any other content dynamically anywhere on your site, with flexible filters to show exactly what you need.
External File Source
Load files dynamically from your file system into builder layouts that automatically stay in sync with your folders.
Flexible Archive Templates New
Take full control of every single WordPress archive separately – exclude posts from child categories, set the number of posts per page and define the post order.
Display Conditions
Use conditional logic to show or hide layout parts based on dynamic content, user state or page context.
Location Field (Joomla)
Add a dedicated location field to Joomla articles and map coordinates directly into the Map element with dynamic content.
Teaser Field
Present teaser text consistently across your layouts, with flexible fallbacks that adapt to your content.
E-Commerce
WooCommerce Builder
Design every part of your WooCommerce shop visually with the full power of the YOOtheme Pro page builder and dynamic content.
WooCommerce Elements
Add native WooCommerce functionality to your shop layouts with dedicated builder elements for the product image gallery, add to cart button, ratings, reviews and more.
WooCommerce Filter Element
Add versatile product filters to your WooCommerce shop to find products faster. Show filters individually in a dropdown menu, or all together in a dropdown or offcanvas dialog.
WooCommerce Style
WooCommerce pages and all their UI elements automatically adapt to your entire site design, and can be refined even further in the style editor.
WooCommerce Products Element
Display WooCommerce product grids anywhere in your layout and filter precisely what products are shown.
WooCommerce Pages
Design cart, checkout, account, and order tracking pages with all their subpages with the YOOtheme Pro page builder.
Modern WooCommerce Integration
Build a modern WooCommerce shop with many built-in refinements that reduce the need for extra plugins and manual customization.
Performance
Lazy, Responsive and Next-gen Images
Optimize images automatically with responsive sizes, lazy loading and next-gen formats like WebP and AVIF, even for background images.
Lazy or On Click Loading Videos New
Load all videos on your site lazy as they enter the viewport, or, for standard videos with controls, load them only after clicking a placeholder image.
Lazy Loading Maps
Lazy load maps from Google Maps and OpenStreetMap to improve performance, reduce bandwidth and speed up the initial page load.
Accessibility
Keyboard Navigation
Create fully keyboard-accessible websites with visible focus states, a skip to main content link, and intuitive navigation for interactive components.
WAI-ARIA Roles, States and Properties
Improve accessibility in YOOtheme Pro with built-in WAI-ARIA roles, states and properties as well as ARIA labels for interactive components.
Semantic HTML Elements
Structure layouts with semantic HTML elements, landmarks and flexible heading markup to make your YOOtheme Pro sites more accessible and easier to understand.
Privacy
Cookie Consent Manager New
Add a fully integrated consent manager with a cookie banner. Get consent for categories and single services, and show placeholders for embedded videos and maps – all without extra plugins and perfectly matching your site's design.
Privacy Placeholders New
Show privacy-friendly placeholders for YouTube, Vimeo, Google Maps and OpenStreetMap until users choose to load the external content.
Local Google Fonts
Load Google Fonts locally from your own server to improve privacy, performance and avoid external font requests.
System & Integrations
System Elements
Add native WordPress or Joomla functionality to your layouts with dedicated page builder elements – from breadcrumbs, pagination and comments, to search, widgets and modules.
Menu Element New
Display menus anywhere in your page builder layout – from sidebar and accordion menus to dropdown menus. Even render a menu for a taxonomy with just a click.
Language Switcher New
YOOtheme Pro is multilingual-ready. With its modern language switcher, building multilingual websites in Joomla or WordPress is easier than ever.
Builder Module and Widget
Design Joomla module positions and WordPress widget areas with the YOOtheme Pro page builder, and create custom toolbars, headerbars and dialogs visually.
Interactive Maps
Show locations on interactive maps powered by Google Maps or OpenStreetMap with custom markers, rich popups, marker clustering and privacy-friendly loading.
Page Break Navigation
Split long articles into readable, paginated pages and guide users through the content with built-in navigation that fits your site.
Media Manager (Joomla)
Browse, organize and select images, videos and files directly inside the page builder, with an intuitive media manager and instant video previews on hover.
Visual and Code Editors
Format rich text in a WYSIWYG editor or edit HTML directly with integrated TinyMCE, CodeMirror and native Joomla and WordPress editing tools.
Link and File Picker
Easily link pages, posts and files with integrated link and file pickers directly inside the page builder.
Export and Import Settings
Export and import your entire YOOtheme Pro setup to reuse styles, headers, footers, and settings across projects.
Contextual Help
Learn YOOtheme features directly in the editor with contextual help videos and documentation links for the current topic.
System Check
Check if your YOOtheme site is running properly and detect critical issues and recommended improvements in one central place.
Developers
Starter Plugin
Easily extend YOOtheme Pro with new functionalities using the starter plugin. It handles the integration into Joomla and WordPress and its distribution, versioning and 1-click updates, so you can focus on the actual features.
Child Themes
Quickly make smaller project-specific customizations to YOOtheme Pro with update-safe child themes for custom code, styles, template overrides and builder elements.
Custom CSS/Less
Add custom CSS and Less directly in YOOtheme Pro to fine-tune individual elements, style specific layout parts and extend the global style system.
Beta Releases
Test extensions early against upcoming YOOtheme Pro releases, adapt them to the latest API changes and ensure compatibility before stable updates arrive.
