Landing page layout and integration on WordPress
312 USD Technical Assignment (TA)
1. General Requirements
Goal:
To create a layout for the main page (and additional informational pages) on WordPress using the Avada theme and its visual builder (Avada Builder).
To set up a global Header and Footer, add a modal window "Join our waitlist" for collecting email addresses with integration into a mailing service.
Cross-browser compatibility: Support for the latest versions of major browsers (Chrome, Firefox, Safari, Edge).
Responsiveness: Correct display on all popular devices (desktop, tablet, smartphone).
Interface: The entire site (header, buttons, texts, captions, messages, modal window) — only in English, without Russian or Ukrainian words.
Structure: To create the header and footer globally (Avada > Layouts), and all blocks of the main page – in Avada Builder.
Reusability: All sections/containers created for the main page must be "saved" (saved containers/sections) so that they can be reused or edited.
Editability: All texts, images, links, as well as the content of the modal window must be editable through Avada Builder.
2. Structure of the Main Page
Below are the blocks (sections) that need to be created and arranged sequentially on the main page. Each section specifies which elements inside should be editable.
2.1. Header
Logo (icon + text "fantribe"):
The ability to replace the icon and text through Avada/WordPress settings (the logo can be stored in Media Files).
Main Menu:
Items: For Creators, For Fans, Monetization, Subscription, FAQ, etc.
On mobile devices – a "burger" button, which opens a dropdown menu when clicked.
Buttons: Log in / Sign up — style according to the layout (different colors).
Minimal Animation:
Possible light animation on hover over menu items (change of text color).
2.2. Hero Section
Background: Gradient background, rounded corners (radius 40px).
Heading: Large text (example: "Fantribe is on a mission…"). Part of the text highlighted with a gradient (via CSS).
Block with avatars and button "join creators community":
One image
The text "join creators community" is editable in the builder.
Phone Mockup with a slider:
Behind the "screen" of the phone are slides (Swiper or Avada carousel), scrolling horizontally infinitely (loop).
The active slide is centered and highlighted with a border.
PNG frame of the phone overlaps the slides.
The caption (e.g.: "Natan Levy – Fantribe.com/natanlevy") changes according to the active slide.
2.3. "Fan subscriptions" Block
Description (text) at the top.
Cards (infinite carousel):
The ability to edit titles, descriptions, images).
2.4. "Community Perks" Block
Left Column with the title "Community Perks" and 4 items (Exclusive community access, Live events, Meet-the-creator sessions, Community challenges).
Right Column — screenshot or illustration (replaced through the builder).
2.5. "Monetization Opportunities" Block
Heading.
Left Column (2 cards: Exclusive discounts, Crowdfunding perks), vertical stripe in the middle, right column (2 cards: Sponsorship opportunities, Launch discounts).
Card: icon (emoji), title, description. All editable.
2.6. "Subscription Models" Block
Heading "Subscription Models".
Toggle: "Billed Monthly / Billed Annually" – when toggled, the active class changes. Optional: price change (JS/Avada conditional logic).
Cards (3 pcs.: Basic, Premium, VIP) with editable titles, prices, descriptions, and "Get Started" buttons.
VIP Card – dark gradient.
2.7. "FAQ" Block
Heading "FAQ".
Questions (5 pcs.):
Expand/collapse on click (JS or Avada toggle).
The ability to edit questions and answers.
2.8. Footer
Background (gradient), rounded corners (40px).
Text + Unlock button (Seamlessly connect with your audience…).
Horizontal line.
Bottom stripe: logo (with icon) on the left, copyright on the right.
3. Additional Pages
Privacy Policy
Terms of Use
To be formatted as separate pages, linked to the menu/footer. The text can be a placeholder, everything — in English.
4. Integration of Mailing Service + Modal Window
Modal Window "Join our waitlist":
Close button (icon "×") in the corner.
Heading "Join our waitlist", logo, text description, email input field, and button "Join now →".
Background of the window (dark/semi-transparent) + dark panel for content.
Minimal animation for the window appearance (fade-in or scale-in).
All inscriptions — only in English.
Button/link that opens this window (can be located in the menu, in the Hero block, or in any other place).
Email collection service:
Need to set up a form (Avada Forms or third-party plugin) with an email field, integrate with the chosen service (Mailchimp, Sendinblue, ActiveCampaign, etc.).
When submitted, the email address is added to the mailing list.
Success/error message (in English).
5. Dynamic Blocks / Reusable Sections
Header and Footer – global Layouts (Avada > Layouts).
Popup ("Join our waitlist") – can be formatted as a separate Popup (Avada or plugin). All texts and images – through the builder/plugin.
Main Sections – save as reusable containers (Avada Builder), so they can be used on other pages or cloned.
6. Animations
Hover effects on cards/buttons (lift, shadow, color change).
Fade-in or slide-in on scroll (optionally through Avada Animations).
Swiper – smooth horizontal scrolling (infinite).
7. Functional Requirements
WordPress + Avada:
Install the Avada theme, create a global Header/Footer, main page, "Privacy Policy" and "Terms of Use" pages.
Insert main blocks (Hero, Fan subscriptions, Community Perks, Monetization, Subscription Models, FAQ) through Avada Builder.
Modal Window:
Opens when clicking the button (e.g., "Join our waitlist").
Closes when clicking the "×" icon or on the overlay (optionally).
The subscription form sends the email to the chosen service (Mailchimp/other).
Swiper (in Hero Section):
The active slide is always centered, with a border.
Infinite scrolling (loop).
Display of multiple slides, ability to swipe left/right.
8. Conclusion
Main page fully created in Avada Builder on WordPress, the entire interface — in English.
Modal window with the "Join our waitlist" form, integrated with the mailing service.
Additional pages: Privacy Policy and Terms of Use (placeholders, everything in English).
All blocks are editable through Avada Builder, and the Header/Footer are moved to Layouts.
Applications 2
Client's review of cooperation with Yurii K.
Landing page layout and integration on WordPressThe project is completed, I recommend working with Yuri!
Freelancer's review of cooperation with Stefan Vasilyev
Landing page layout and integration on WordPressThank you for the collaboration! I was glad to work on your task) Prompt feedback and friendly interaction made the work comfortable and productive) If you have any questions or need assistance, feel free to reach out, I'm always available!
-
7 days312 USD
7 days312 USD
Hello.
I work with Avada quite often and am ready to complete the task.
At the start, I can begin everything on my own hosting (the theme is available), create a few blocks/elements. You will see if the result is satisfactory. If so, we will continue our collaboration.
-
5 days312 USD
319 10 0 5 days312 USD
Hello, I have extensive work experience, I will send my portfolio in private if needed.
I will be happy to collaborate with you.
-
1 day312 USD
280 1 day312 USD
Hello, Stefan
Thank you for the detailed explanation of the project.
1. Do you already have a Mailchimp account (or another email service) for collecting emails?
2. Do you want me to set up hosting, or is your WordPress site already running and ready for theme installation?
-
3 days301 USD
326 1 0 3 days301 USD
Good day.
I have over 3 years of experience working with WordPress.
I am ready to collaborate on this project.
My recent works:
https://www.malynovskyi.agency/
https://kitsystyle.com.ua/
https://www.target.malynovskyi.agency/
-
4 days312 USD
290 1 0 4 days312 USD
Good afternoon. I am ready to complete the task.
I have extensive experience in developing websites on WP.
My portfolio:
Freelancehunt
I will layout the design of the main and informational pages. I will implement all necessary functionality. I will optimize for the required browsers and platforms. The interface will be in English. The necessary elements and blocks will be arranged according to the described structure. All blocks will be editable through Avada Builder.
I will integrate the mailing service into a modal window. I will ensure maximum performance.
Write to me, we will discuss the details and I will start working.
-
20 days312 USD
411 6 1 20 days312 USD
Ready to discuss the project! Please send the design and describe your wishes for the landing page in detail.
-
10 days312 USD
6463 82 3 3 10 days312 USD
Good day!
I am ready to work on your project.
I am waiting for your response.
Sincerely, Ivan
-
10 days312 USD
2276 37 0 10 days312 USD
Good day! I will perform high-quality, responsive layout.
I can create a theme from scratch and set it up on wp/acf so that everything can be edited from the admin panel.
I have over 5 years of experience.
Feel free to reach out, I will be happy to collaborate!
-
10 days312 USD
619 7 0 10 days312 USD
Good day. I would be happy to collaborate.
I am ready to discuss the details in private correspondence.
A lot of experience, responsible and quality approach.
Sincerely, Roman!
Write to me, we will discuss.
-
5 days312 USD
2830 19 0 5 days312 USD
Hello, I am ready to design a website on WP with the specified theme and taking everything from the technical specifications into account. I guarantee the quality and promptness of the work.
Write to me, I will be happy to collaborate!
-
14 days312 USD
1405 10 0 14 days312 USD
Good day. I have experience in design, layout, and WordPress. All projects are here (https://github.com/divinebang). We can discuss all the steps. I am ready to start working as soon as we settle the details.
-
4 days301 USD
753 11 2 4 days301 USD
Good day, Stefan. I have reviewed the requirements and the layout and am ready to quality code your landing page on WordPress using the following technologies:
HTML5
CSS3, SCSS
Flexbox, Grid CSS
JS, jQuery
WordPress, ACF
Valid code (W3C), green zone Page Speed, SEO optimized code.
… I am ready to start immediately after approval.
Feel free to reach out, I will be happy to help!
-
7 days301 USD
224 1 0 7 days301 USD
Hello!
We would like to offer our services. We have a professional team of developers consisting of front-end and back-end specialists, as well as a team leader. We have been working for over 4 years with various niches, geographies, and projects, which is why we are flexible to conditions and the diversity of work.
E-Commerce, SaaS, Marketing agencies, Logistics, and IT companies are what we work with.
We have been working on similar projects for a long time, so we will complete your project efficiently and quickly.
Let's discuss the project details.
-
9 days312 USD
5569 114 4 2 9 days312 USD
Good day. I will create a cross-browser, responsive, valid, and fast website with a landing page on WordPress, ready to start immediately after discussing the details.
Available 24/7
-
7 days312 USD
4833 19 0 7 days312 USD
Hello, Stefan!
I have reviewed the task and am ready to start working on the assignment with high quality.
I propose development on WordPress + ACF PRO
Deadline: 5 days
Portfolio: webisen.com
…
To ensure that there will be no issues during the work, you can check my latest work:
https://telya.ch/
I also provide links to other projects:
https://gvadiko2004.github.io/grill/
https://gvadiko2004.github.io/Anon-shop/
https://iliarchie.github.io/cates/
If you are interested in my feedback, please contact me via private messages.
Thank you in advance.
Current freelance projects in the category HTML & CSS
Moved the website from OpenCart to the Khoroshop platformHello. There is a website on OpenCart, an online store. It is necessary to transfer the structure of the site to the GoodShop platform, select a design for the new site, and make it fully functional. HTML & CSS, Web Programming ∙ 17 hours 48 minutes back ∙ 25 proposals |
Need a strong WordPress / WooCommerce specialist for the refinement of the MARSPRO website.We are looking for a responsible freelancer or a small team for the quality completion and technical refinement of the MARSPRO company website. The website is already operational, but there are many minor and significant technical issues left by the previous developer. We need a… Content Management Systems, HTML & CSS ∙ 1 day 18 hours back ∙ 44 proposals |
Sandra Ice Cream - Kaleidoscop
92 USD
We have a small project, and we would like to know if you can prepare a video for us for an LED screen. The video will be used at our event. We will provide all necessary materials: design, brand book, dimensions, and technical requirements. Please let us know if you are… HTML & CSS ∙ 1 day 19 hours back ∙ 7 proposals |
WordPress block layoutHello. We need to do a redesign, specifically the layout of the blocks as shown in the mockup. The structure is not very different from what is currently done, except for the header and hero block. We need to redesign both the mobile and desktop versions. The website is on… HTML & CSS, Website Maintenance ∙ 2 days back ∙ 68 proposals |
Development of a website according to the specifications on FramerYou need to create a website based on the parameters in the technical specification. https://docs.google.com/document/d/1ODO2C9Krb4AaMiJz9wfbNzWlAyA2FwCCHL8r0biajUY/edit?usp=sharing Please provide your actual rate based on this design. HTML & CSS, Javascript and Typescript ∙ 2 days 1 hour back ∙ 26 proposals |
Kharkiv