Story

Allison Madsen

The main reasons why it is helpful to know yourself

Jan 20, 2022 • 10 min read

Story
Modern offices interior design ideas

James Franci

Mar 16, 2024

Can analog photography help you take better photos?

Phillip Siphron

Mar 18, 2024

Little makeup tricks that make a big difference

Dana Del Rey

Feb 10, 2024

How houseplants can change your life

Brandon Levin

Jan 22, 2024

Food

Wilson Herwitz

Fantastic, little-known pasta to try on your next trip

Jan 27, 2022 • 12 min read

Food
How to travel the world and get companies to pay for it

James Franci

Mar 18, 2024

The perfect 1-hour chocolate birthday cake

Dana Del Rey

Feb 18, 2024

Life changing tips for packing lunch for work

Phillip Siphron

Mar 11, 2024

The best steak with garlic butter

Brandon Levin

Jan 21, 2024

Travel

Abram Passaquindici

What I wish I knew before cycling the world

Jan 14 2022 • 6 min read

Travel
How to travel the world and get companies to pay for it

Aspen Herwitz

Mar 19, 2024

The perfect 1-hour chocolate birthday cake

Dana Del Rey

Feb 14, 2024

Life changing tips for packing lunch for work

Brandon Levin

Jan 26, 2024

The best steak with garlic butter

Phillip Siphron

Mar 15, 2024

Mega Magazine

💻 Settings | 🎓 Layers | 🎉 Animations | 🏗️ Layout | 📱 Responsive | Speed

Description: Create an interactive magazine slider for your posts using the Mega Magazine template and instantly amaze your visitors.

Premium: Gain access to all slider templates with a single purchase.

Minimum version: 3.5.1.12

Tags:

Slider Settings

The Mega Magazine template is a full page slider for your website. Full page sliders fill the browser viewport both vertically and horizontally. As a result, they’re perfect for various use-cases, including header sliders.

It’s also uses the Simple slider type, so it displays one slide at a time. This helps the visitor focus on the slide’s main message.

Navigating the slides in the Mega Magazine slider is easy. People can use the CTA button with the label “Next Category”. This button uses Link actions to start the slide switching. Touch swipe and drag navigation is also available.

Layers

You can find the most common layers in the Mega Magazine template. There are lots of headings, since there are many headlines, but there are couple of text layers, too.

Additionally, you can find a handful of image layers. Also, there are lots of rows and columns that create the cool layout. Also, main image on the left side is displayed by a column, because it’s the background of the column.

Column background image

Animations

There are two kinds of animation on this slider. One is the Main Animation, which is the special effect that switches slides and moves the layers at the same time. The Mega Magazine slider uses the Vertical Main Animation.

Apart from the Main Animation, you can also find layer animations on this template. They help displaying the grid on the right side.

Layer animation on the Timeline

Layout

The Mega Magazine template contains many interesting layout solutions. For example, there’s a 2×2 grid on the right side of the slider. We created it using a single 4 columns row that wraps after the second one.

Setup of the row that creates the 2×2 grid inside the right column

Another interesting element in the layout is the Absolute positioned layer at top left part of the slide, that displays the category of the current slide. Absolute positioned layers are just floating on the slide, so they can be placed anywhere. For example, at this template we placed it behind the 4 column row.

Responsive

Smart Slider is a responsive slider that offers many great tools to create perfect looking sliders for mobile. For example, you can adjust the font size for tablet and mobile devices without affecting the other devices. You can also hide any layer on any of the devices.

Hiding layers can be useful on smaller screens to ensure that the content can fit. It can be especially important thing to do when your slider is full page, as long content can end up cropped.

Core Web Vitals

PageSpeed Insights with Lighthouse analyzed this page on June 30, 2022. For the latest result analyze now!

100

Desktop

First Contentful Paint
0.3 s
Speed Index
1 s
Largest Contentful Paint
0.6 s
Time to Interactive
0.8 s
Total Blocking Time
0 ms
Cumulative Layout Shift
0
98

Mobile

First Contentful Paint
1 s
Speed Index
2.5 s
Largest Contentful Paint
2 s
Time to Interactive
3.1 s
Total Blocking Time
70 ms
Cumulative Layout Shift
0

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

Related Post: 7 News Slider Designs to Inspire Your Next Web Design Project


Similar Sliders -

CosmeticsFull Page HotelSplit SliderIceland Adventure Group