Сouch-course

A really long landing-page (over 20 screens). This is pixel-perfect migration from client's Figma with custom acсordions and sliders.

Description

Given Figma design the Wordpress+Elementor Landing Page was built for the client who are launching his brand new course of business coaching.

We made it from the scratch using only Elementor builder and 1 additional plugin for review slider.
Responsiveness is provided for 3 breakpoints: desktop, tablet and mobile. We made them separately for pixel-perfect accordance with client’s Figma design.

The list of connected issues solved:
1) Elementor struggles opening long pages
– we made proper elementor settings and cashing solutions
2) Elementor layout issues, i.e. what you see in editor does not equal what you see as a result
– we built blocks separately creating templates and “shortcodes” and merged them all in result page. Like LEGO works ;)
3) Perfomance issues
– we’ve tested different optimizing solutions and find out the most efficient of them
– server’s settings tuned for perfomance (memory, time limits)

What has been done as well:
– when building was finished and the webpage was ready to transfer to client’s server, we realized that client has already not-empty website with potentially conflicting WordPress structure. So we decided to set up the new subdomain on their hosting, install WP there. Then the transferring has been done successfully.
– after that we set up the custom fields (using Advanced Custom Fields plugin) in client’s WP admin panel for content editing of every piece of the page. It was important for minimise risks of layout issues.
– To add, complete step-by-step instructions has been done of how-to-deal with the content with screenshots.

All works take 3 weeks to completion.

We are looking forward to build new Elementor pages using the most effective and powerful technics.

Features

Well done for desktop, tablet & mobile
The webpage is 100% fitted for client’s Figma design
Lottie files, accordion sections, sliders, and smooth appearing of elements
Advanced Custom Fields implemented in the client’s admin panel for making changes in content comfortably.
Pixel-perfect sliders in 100% accordance with given Figma design

Screenshots

Contact me

Contact me

Marina Romanova

Skills

JavaScript