Popup and Hover Effects with Joomla Website Builder

Popup and Hover Effects with Joomla Website Builder
Hover and popup effects is one of the most popular on the web. So with OS CCK Website Builder you can easily add to any item (for exapmle menu. Read how to create a mega menu with website builder). You can use it even on a map or any other element.

We will show you how to create a hover or popup effect on any instance. Let's start with creating a new layout. Click Components → OS CCK → Layouts. Create a new layout or click on the one you need (remember, that to add an instance and display it on frontend, you have to add two layouts: «Add instance layout» and «Show all instance layouts». Without «CCK Add layout» - you can't add new items and without «CCK Show layout» - you can't show your items).
Then create an instance.

Then return to «Layouts», «Show all instance».

Hover Effect in CCK Website Builder

Select an element, scroll down to the «Layout for redirect». Choose on what element will be redirecting this item. Then in «Redirect type» select «Hover».

Here is an example of how it works.

Popup Effect in CCK Website Builder

Like on hover effect, select layout for redirect and then on «Redirect» type choose «Popup». Add some CSS styles so item would look perfectly and enjoy!