YOOtheme Pro Assets, One Click Away

Store, share, and discover ready-to-use assets for the YOOtheme Pro Builder β€” streamline your building process for teams and clients.

layout

[DSW] Reading Progress

πŸš€ Reading Progress Bar with some smart features and zero dependencies. 🎯 Easy Setup: Just configure via CSS variables (or use the defaults). Add it to your template or module wherever you need it. That's it! ✨ optional features ✨ Auto-detects YOOtheme theme colors. ✨ Customizable height and positioning (top/bottom). ✨ Can position itself below sticky headers. ✨ delayed display after scrolling. ✨ exclude footer from calculation. ⚑ Performance: Only loads features you actually use. Smart updates only when needed. Pure vanilla JS, no dependencies. πŸš€ Works great on mobile and desktop. I've been using it on several sites without issues for a long time. Hope it's useful for someone! Best, Pucki

73s0p REV 1 β€’ Nov, 2025
0
16
layout
Section as a modal window

Section as a modal window

This layout contains a button that opens, in a modal window, all the content located in another section. This is a classic example of how to create a controlled popup layout with any set of elements on your page. It's best to use CSS rules to change the window's width. Everything else should be intuitive. | The layout author is Alex Revo, a member of the Yootheme Pro support team and an independent expert. You can contact me for any assistance: β†’ Expert assessment of the feasibility of any task β†’ Auditing layouts in Figma, Adobe XD, Photoshop, etc., for compatibility issues with UIKIT markup β†’ Marking up layouts of any complexity β†’ Selecting elements for a layout, configuring dynamic content β†’ Modifying elements, adding new fields and attributes β†’ Optimizing page load speed β†’ Troubleshooting issues with the page builder | My website is alexrevo.pw

71b9b REV 1 β€’ Sep, 2025
0
2113
layout
[FS] Corner Label from Meta Text

[FS] Corner Label from Meta Text

This effect turns the .el-meta text into a stylish corner ribbon on your cards. The ribbon automatically aligns to the top-right corner, preserves the original meta content, and supports dynamic coloring via tags or custom variables. A small triangular accent at the bottom enhances the classic ribbon look. Perfect for highlighting featured items, hot labels, or custom statuses.

19n1i REV 1 β€’ Sep, 2025
1
134
layout
[FS] Switcher Pro: Modal Examples

[FS] Switcher Pro: Modal Examples

This layout demonstrates the different ways to use built-in modals in the Switcher Pro element. Each example illustrates the recommended connection methods: automatic suffix, unique sublayout ID, and sublayout row ID. You can see how changing the sublayout order affects the modal behavior, and learn how to set up reliable and stable connections for complex layouts.

97k2i REV 1 β€’ Sep, 2025
0
84
layout
[FS] Truncate Content (Line Clamp)

[FS] Truncate Content (Line Clamp)

The layout contains several YOOtheme Pro elements with a line-clamp custom CSS applied. This style shortens long text by limiting it to a set number of lines. The effect is applied via Custom CSS in the Advanced tab of each element. You can adjust the number of visible lines in the code (for example: 2, 3, or 4) to best fit your layout. Any extra text will be hidden automatically with an ellipsis (…) so your design stays neat and consistent.

65m7g REV 1 β€’ Sep, 2025
1
70
layout
Simple Contact Form

Simple Contact Form

Simple contact form displaying a name, email and description fields. On submission displays a Thank you message.

73c5r REV 1 β€’ Sep, 2025
0
92
layout
Switcher Tabs

Switcher Tabs

UIkit Switcher, the List element is the Nav and Sublayouts the container of content

69t2e REV 2 β€’ Sep, 2025
0
100
Log in to your account
Enter your email and password below to log in
Email address
Password
Forgot your password?
Remember me
Don't have an account? Sign up