The Greek Restaurant template is a group that contains 6 projects. More precisely, you can find 5 Block type and 1 Simple slider type in this group. Blocks are special kind of projects that can display one slide only. So, they’re perfect for creating hero headers.

The first block in the Greek Restaurant template uses a full page layout. Full page sliders fill the screen vertically and horizontally as well. As a result, they’re a great choice for displaying content above the fold. The other sliders and blocks are full width, so they only fill the screen horizontally.

Layers

You can find two heading layers on all sliders. One displays the main headline and the other the secondary one. Most sliders also display an image using the image layer. Additionally, there’s a CTA button on two sliders. One is on the first slider, which actually uses a column layer to hold the link. The second CTA button is on the About us slider, and this one uses the button layer.

Animations

As most sliders in the Greek Restaurant template are blocks, they don’t have fancy slide changing animations. However, since they have a couple of layers, they have nice looking layer animations. For example, on the first slider, you can see the Reveal animation. What makes the Reveal animation special is that it introduces the layer by moving a colored shape on top of it. As a result, the Reveal animation looks modern and suits any kind of website.

The other animation you can spot on many sliders is the layer parallax. When you scroll on the page, some layers move at a different speed, which creates a spectacular effect. You can find this effect on the image of the first and 5th slider and the second slider’s cards.

Layout

Probably the most interesting layout in the Greek Restaurant template is the Dinner menu slider. This slider is actually made by two different sliders. One block that contains the main and secondary headline, and a slider that has the text bullets and the different slides. The same background color is set at both sliders, which makes it look like they’re one slider, but in fact, they’re not.

Responsive

Smart Slider is a responsive slider plugin so it lets you create sliders that look great on any screen. Moreover, it offers many responsive features to fine-tune the result on small screens. One of the most useful tools for optimizing for mobile is the font resizer. It lets you reduce (or increase) the font size for small screens, which is super handy.

Related Documentation: Layer animation

Related Post: 10 Beautiful Full Width Slider Examples

The post Greek Restaurant appeared first on Smart Slider 3 — WordPress Plugin.

The Politician template is a Slider Group. What makes Slider Groups special is that they can contain many sliders, what you can display together using a single WordPress shortcode or block, or Joomla module. The Politician template contains 7 blocks total. Blocks are special kind of sliders, which can only display one slide.

We used the very first block to create a cool menu for the template. It uses the Scroll to Alias link action to make the browser scroll to a slider. This action is super useful as it lets you scroll to any slider within the current by calling the alias you set for them.

Layers

The Politician template has many blocks, and they use the most basic layers: heading, text, image and button.

Animations

There are many cool animations and effects that bring the Politician template to life. Right on the first block below the menu, there’s a parallax effect. The parallax effect is a popular effect on modern websites, as it gives the illusion of depth to websites. In other words, it makes the background and foreground scroll with a different speed, which makes it look like the section below covers the background. All in all, it’s a pretty spectacular effect.

On the last block you can spot the Ken Burn effect. It’s another trendy effect that slowly zooms on the image, giving it some motion.

The last kind of animation you can see on most of the blocks is the layer animation. Layer animations are super useful to introduce layers to your sliders and blocks with a cool effect.

At the Campaign Issues blocks you can spot something interesting when you hover on the cards. Their box shadow is darker on hover, giving each card an interesting hover effect. Although it’s not really considered an animation, but it’s a nice looking effect that worth mentioning.

Layout

The most interesting layout in the Politician template is in the Manifesto block. This block has a two column row, that contains a large image on the left, and a couple of text layers on the right side. What makes this layout look special is the smaller images in the left column. They are decoration layers, so were added in Absolute position which let us move them on top of the main content image.

Responsive

Smart Slider is a responsive slider plugin for WordPress and Joomla and it offers many tools to fine-tune your sliders. Additionally, some settings are automatically made for you, saving your time and effort in your projects. For example, if you use a row it’s columns automatically break under each other on mobile.

Apart from that, you can also reduce the font size for mobile devices to make your texts more mobile friendly.

Sometimes you might have layers that you don’t need or just don’t want to show on mobile. Using the Hide on option of Smart Slider, you can easily hide these layers from your small screen visitors.

Related Documentation: Slider Group

Related Post: How to Customize a Slider Template?

The post Politician appeared first on Smart Slider 3 — WordPress Plugin.

This new template is a Slider Group. Slider Groups are known for their capability to contain an unlimited number of slides. This makes it easier to organize similar sliders effortlessly, then publish them all together.

Layers

The Gibraltar template consists of many captivating layers. The first block is created by using Rows, Columns and Heading layers resulting in a unique menu bar for the page.

Certainly, this slider takes advantage of the CTA buttons as it’s used on the Hero and Pricing page, capturing the visitors attention.

Moreover, some of them, like the Features and Content page, are specially designed with Absolute layers. They are perfect for overlapping layers as they can be positioned anywhere by drag’n dropping them.

Therefore, they are also super easy to use, not requiring any previous knowledge of any software.

Additionally, some slides employ custom CSS features which are added in the Developer settings tab to achieve their desired result.

The Hero section’s heading is created by using two colors, for this reason implementing its own custom CSS. Just like the Features block, where it also uses CSS to pull off a rounded border for its absolute layer. The Content slider on the other hand applies a custom blending to its absolut layers, enhancing the image’s character.

Animations

The Gibraltar template is made captivating by using several Layer animations. They mostly use the same type of animation which is the Basic one. It is not too fancy simply animating the layer it is applied to.

As a consequence it adds a smooth and captivating introduction to all these layers.

On the other hand, some layers, like the Hero slide’s image layer, show up using the Reveal animation. This animation type is a notable one as it firstly only reveals a solid background only then showing the content of it’s layer. With its up-to-date style it’s perfect for modern websites.

Layout

All of the blocks create captivating layouts using the Row and Column structures. The most interesting solution may still be the last one. It produces a gallery-like layout with its arrangement. There are two rows containing three and four columns each.

However, what makes it unique is the way they are displayed next to each other without any space in-between. This happens because the paddings and margins values are equal to zero.

Furthermore, the row’s gutter is also set to not create space between its columns.

Responsive

Smart Slider offers you many tools to create responsive websites. One of the most useful gadgets is the Font Resizer, which lets you to uniquely optimize your layers based on the device it’s viewed on.

On top of that, the Hide On option on each layer makes it easier to hide layers on smaller screens. In this slider’s case it’s a very useful tool as some of the absolute layers can behave differently in smaller devices, therefore hiding them can be the best solution for these circumstances.

All in all, they ensure your content looks perfect on all devices, offering your visitors a pleasant experience.

The post Gibraltar appeared first on Smart Slider 3 — WordPress Plugin.

Creating beautiful sliders in Smart Slider can often result in having many sliders on your dashboard. To help you organize the sliders you made, you can create Slider Groups and place sliders inside them. Slider Groups are like folders: they help categorize your sliders, making it easier to find the one you’re looking for. Additionally, groups can help simplify the publishing process. Instead of having to publish all sliders one by one, you can publish the whole slider group.

The Vlogger template contains 4 blocks in a slider group. Blocks are special slider types in Smart Slider. They’re not exactly sliders, as they don’t slide, since they can only display one slide. Think of blocks as sections, where you can use Smart Slider’s features, without having to create an actual slider. Most blocks in the Vlogger template are full widths, but the third one is a full page block. As a result, it fills the whole browser window both vertically and horizontally.

Layers

The Vlogger template is full of interesting layers. Even in the first block you can find two interesting layers: a video and an input layer. Of course, you can find the common layers in this template as well. There are headings, texts, CTA buttons and images on most slides.

Videos are great storytelling tools at your disposal. They help introduce your brand or product better and deeper than static images could. So, it’s a good idea to use a video on your website. The video we use at the first block starts automatically, immediately capturing the attention of the visitors. Also, it pauses when they scroll away, so they can continue watching it where they left off.

Animations

There are cool layer animations on most of the layers at each block. For example, at the first block the headings on a yellow background, the input and video layers show up using the Reveal layer animation. The Reveal animation is a special kind of layer animation that animates a solid background before revealing the content of the layer. This effect looks trendy and modern, and suits well on today’s sites.

The other kind of layer animations you can spot is the Basic Animation. It’s not as fancy as the Reveal animation, as it simply animates the layer it was applied to. On the first block you can spot this animation on the first and last text layer.

At the second block you can find a nice lightbox, which displays a video from YouTube. Adding a lightbox is easy in Smart Slider. First select the layer that you want to click on to start the lightbox. Then click on the + sign at the Link field and go to the Lightbox tab. Finally, enter the link of the video you want to show in the lightbox. At the second block, the lightbox is added on the column that contains the image and heading.

Layout

The most interesting layout is the broken grid-like layout in the first block. The yellow heading slightly covers the video layer next to it. This happens because of the negative left margin on the video layer.

Responsive

Smart Slider is a responsive slider for WordPress and Joomla. It offers many great tools to fine-tune how your sliders look on small screens. For example, you can hide layers, or change the font size on mobile. For this, simply use the Font resizer.

Related Post: How to Create Beautiful WordPress Landing Pages That Convert

Related Post: 12 Stunning One Page Examples Which You Should Check

The post Vlogger appeared first on Smart Slider 3 — WordPress Plugin.

The Nala Light page is a special kind of template. That’s because it contains multiple sliders. When you have several similar sliders, you can place them into a Slider Group. This helps you organize your sliders better. Additionally, you can publish the sliders that are in the same group at once.

Layers

You can find the most popular layers in the Nala Light page. You can find several heading, text, image and button layers. They’re the most common layers that many people use to build their sliders. Why? To simply put, they allow adding content the easiest way.

Animations

The Nala Light page features several layer animations. Layer animations are most commonly used to introduce layers. As a result, the slider looks more interesting and captivating.

The other effect you’ll find in the template is the animated Shape Divider. This animation acts as a separator between two sliders, and it’s a great way to make the intersection of the sliders more interesting.

Layout

The layouts are super simple, but there are some interesting solutions. For example, in the first slider you can see a custom button created using a two column row. The left column contains the image and the right column contains a heading layer. Then their container, the row has a background color and a lightbox that opens a video.

Responsive

Smart Slider helps you create gorgeous responsive sliders for our website. Moreover, it offers many tools to ensure your content looks great on small screens, too. The most popular tool that helps you optimize your slider for mobiles is the Font Resizer. It lets you reduce (or increase) the font size without affecting any other device views.

Related Documentation: Layer animation

Related Post: 10 Beautiful Full Width Slider Examples

The post Nala Page – Light appeared first on Smart Slider 3 — WordPress Plugin.

The Iceland Adventure group stays from 9 sliders. You can use Smart Slider to create whole landing pages. This group is the perfect choice to create a landing page for your travel website. You can fully customize each slider, change the images, and texts, also you can add more sliders, or delete them if you want. If you publish the slider group, then the sliders will be under each other.

Layers

The Iceland Adventure group uses simple layers: headings, images, texts, and buttons. They are usually in rows and columns which you can put them next to each other. There are layers with link actions. For example, the first block of this group is a navigation, and each text layer has a link on it. Here we have used the scroll to action which you can scroll to specific sliders.

Animations

When you check the page you may notice each layer is coming in with a nice layer animation. You can customize these animations in the animation tab of the layer window, also you can use the timeline where all of the animation displays.

The second section of the page has a shape divider on the bottom which is a great separator between two sliders. Also, you can meet with a great effect on the Guide Book: with the layer parallax. When you scroll up or down, the image layers are moving in the background. You can set this vertical scrolling effect in the Animations tab of the slider settings. Also, you can add different parallax values to the layers in the Style tab of the layer window.

Layout

The Guide Book has the most special layout in this group. There is a row with 2 columns. The first column contains an image, and the second has 2 headings, a text and a CTA button. Below the content you can see 3 extra image layers which are in absolute position. With absolute position you can put your layers anywhere in the canvas, and it can be very useful at the decoration.

Responsive

The whole landing page is fully responsive. The rows wrap in a smaller view, and the texts are smaller. You can change the font size device specifically with the text scale option which you can set in the layer menu or in the Style tab of the layer window. With that you can set different font sizes for different devices.

Related Post: What is a Full Page Slider and How to Use it?

Related Post: How to Create Beautiful WordPress Landing Pages That Convert

The post Iceland Adventure Group appeared first on Smart Slider 3 — WordPress Plugin.

If you have a company it is useful to have your own website on which you can give information to your visitors and your business can also be easily found. The bakery page example is a great demo that you can use on your one page website. This landing page consists of 5 sliders which you can fully customize to your needs.

The bakery slider group starts with a navigation on the top. Here you can see a logo image, the menu, and 2 small icons on each side. With the menu, you can navigate to other sliders using the ScrolltoAlias action. In the group, each slider has an alias, which can be useful at the navigation.

The next slider is a simple full width slider with 3 slides. The slider switches their slides automatically with the slider autoplay. Small but important settings are the arrows and the bullets. In this slider, the text type arrow and the number type bullet are used which give a special navigation effect for the slider.

Layers

The first slider is a good example of how you can use the default and absolute positioning together. The textual layers are in default position in a 1-row 2-cols structure, and the images are in absolute position.

The image layers are in absolute position where you can position your layers anywhere in the canvas, and you can put a layer above or below to others.

Animations

When you scroll on the page you will notice that almost each slider uses animation. My favourite is the Bakery slider on the top, where the first col has an incoming animation, and there is a CTA which calls the users’ attention. The second col has 2 heading layers and they have a text animation which gives a nice visual effect.

The image layers come in with a nice layer animation, too, so when the visitor sees the page first, they can read the text below them, then the images come in.

The about block is simple but spectacular because of the parallax effect. Thanks for the fixed slider background you can make a great visual effect on this slider block. You can set the background image to fixed at the Slider settings.

Layout

Each slider uses a different layout, but the most interesting is the Specials block. This block uses a grid layout, which consists of 2 rows. In the first row there are 3 columns and in the second row there are 2 cols.

The first row is special because in the second column another row with 2 cols is used. At this row we have used the wrap after value, so after 1 column the second begins in a new line.

The grid where the textual layers are has a column background color which can change on hover to the color of the slide background giving a special effect to the visitor.

Responsive

The Bakery page is fully responsive, and looks good on tablet and mobile devices. We have used the Text scale at each device which we made the text smaller, and there are sliders where layers are hidden in small devices.

Related Post: How to Create a Cool Text Animation

Related Post: How to Create Beautiful WordPress Landing Pages That Convert

Related Post: 12 Stunning One Page Examples Which You Should Check

The post Bakery appeared first on Smart Slider 3 — WordPress Plugin.

The Nala Dark page is a special kind of template that consists of multiple sliders. You can gather them by placing them into a slider group. But keeping the sliders organized is not the only thing a Slider Group does. In fact, it also allows you to publish your grouped sliders at once.

Layers

The sliders use lots of interesting layers. Of course you can find the most popular layers: heading, text, image and button on most slides. These are the most basic layers to build content. They help adding structured headings, long text, pictures and CTAs to your sliders. Apart from these common layers, you can find a Counter layer on some slides. The Counter layer is a special layer that counts from the star number to the end number you set.

Animations

The Nala Dark page features a couple of amazing effects. The most common is the layer animation that you can find on all slides. Layer animations help introduce your layers in a more interesting way. Apart from making the slides more interesting, they also help bringing some life into the slide.

The other cool effect you can see on one of the sliders is the Shape Divider. Shape dividers are graphic designs that help separate the sliders in a more interesting way.

Layout

The layouts are super simple, but there are some interesting solutions. For example, in the first slider you can see a custom button created using a two column row. The left column has a background color and contains an image. The right column only contains a heading layer. Then their container, the row has a lightbox that opens a video.

Responsive

Smart Slider is a responsive slider and it offers many tools to ensure your content looks great on any screen sizes. The most popular tool that helps you optimize your slider for small screens is the Font Resizer. It lets you reduce (or increase) the font size without affecting any other device view.

Related Documentation: Where to find the Slide Library?

Related Post: Smart Slider 3 – Slide Library

The post Nala Page – Dark appeared first on Smart Slider 3 — WordPress Plugin.

The Green Energy template is a slider group. What makes slider groups special is that they can contain any number of sliders and blocks. They’re like folders, that let you export and publish a group of sliders together. Additionally, they help organizing your sliders in your Dashboard.

In this template you can find 4 blocks and 1 slider. If you’re wondering what’s the difference between a slider and a block, here’s a simple explanation. Blocks are special kind of sliders, that can only display one slide. This lets you take advantage of Smart Slider’s cool features on your website, without having to create an actual slider.

All sliders and blocks are full width in the Green Energy template. Full width sliders are popular, because they fill the browser horizontally. There’s another thing worth mentioning about the first block. It has a slide background video. Background videos, just like background images, are design elements that let you fill the whole slide area with your content.

Layers

Usually there are many sliders and blocks in a slider group. As a result, there are many different layers inside them as well. Of course, this template is no different. However, you can find the most popular layers, the heading, text, image and button layers here.

Animations

There are many layer animations in this template. Almost all blocks have some kind of special effect on some of their layers. For example, the menu on the first block appears with an incoming layer animation. Similarly, the text blocks in the Services section use a layer animation to appear.

Apart from the layer animations, there’s a lightbox in the first block. It opens up a video from YouTube when you click on the play icon.

Layout

The Green Energy template has many interesting layout solutions. Let’s highlight the two most interesting and see how they were built!

You can find the first interesting layout on the Invest block. It’s the green box that’s aligned to the bottom of the block. The base of the slider is a two column row, and this box (which is actually another row) is placed in the right column. The vertical align on the Column is set to bottom, and the row has a maximum width. This prevents it from filling the column horizontally.

The other interesting layout that worth mentioning is the bottom slider. It’s navigation and textual content is on a Static Overlay. However, the images are on regular slides. Both the Static Overlay and the other slides have a three column row as their base. However, on the Static Overlay the first column, which has the content, is wider than the other two columns. This creates the kind of overlapping effect.

Responsive

Smart Slider offers many tools to create perfect looking sliders for mobile devices. Some tools, such as wrapping a row’s columns into new lines take effect automatically, although you can change it back if you need the columns to be next to one another. This behavior was quite useful in the Services block, which allowed the two columns to display below each other in the main layout. Also, the inner row, which contains the image and texts also wraps to more lines automatically.

But there are other options which you can adjust manually, such as the font size or the alignment. For example, on the first block the layers are aligned to the left on desktop, but they’re aligned to center on mobile.

Related Documentation: Slider Group

Related Post: How to Create Beautiful WordPress Landing Pages That Convert

The post Green Energy appeared first on Smart Slider 3 — WordPress Plugin.

The wedding page group stays from 6 sliders. The first is an autoplaying slider with a static overlay and navigation. The second and third sliders are blocks, so have only one slide in the slider.

The 4. slider is a showcase type slider. Showcase sliders need a certain amount of slides to create a full carousel. Since this slider has only 3 slides, the last slide can’t appear on the left side of the first one. This creates an interesting effect, which is great for story telling. And the last 2 sliders are also blocks, and have a special layout.

Layers

The wedding slider group stays from basic layers like headings, texts, buttons and images. Since these sliders are together, they should have used the same styling and matching colors to keep the harmony. There are more layers with a link which you can navigate to the next slides thanks for the link actions.

Animations

When you load the wedding page, you can notice a lot of animations on it like layer animations, or the Ken Burns effect. The Ken Burns is a panning and zooming effect, and it is simple, elegant and works on any kind of images.

Layout

The Wedding Gallery slider’s layout looks beautiful and unique. What makes it special is the row with the small images, which break out of their grid and cover a part of the big image on the left. Creating this layout is quite simple.

Create a row with two columns.

1. Put an image layer on each column and select the image you want to display.
2. Remove the paddings from the columns and row. (Press and hold the Shift key to adjust the paddings on the opposite sides, too.)
3. Select the row and add a top margin on it. This slider has 20px top margin.
4. Give a negative left margin to the row. This slider has -80px left margin.

Responsive

The slider group is fully responsive, and looks good on any device. Showcase sliders have special responsive behavior. You can set a size for the slider itself, and one for the slides inside. Thanks to this, you can control the amount of slides that will show up in your slider. For instance, if you set your slider size to be 1500px wide, you can make 3 500px wide slides appear with 0px slide distance. Being able to specify different slider and slide sizes creates many possibilities for your slider.

In this example, we took advantage of another great feature, the Maximum slider height. This setting prevents the slider from getting taller than the set size. We set it to 700px, the same as the height of the slider, which means as the slider gets wider, more slides will be visible. This setup is close to the best way to set up a showcase type slider.

Related Post: How to Create Beautiful WordPress Landing Pages That Convert

Related Post: Why do You Need a Video Slider on Your Website?

Related Post: Use the Popular Ken Burns Effect on your Slider

The post Wedding appeared first on Smart Slider 3 — WordPress Plugin.