How to Build a Conversion Focused WordPress Homepage for an Event

In today's landing page from scratch video, we're building the homepage for an upcoming live event in Bali.

The event is called the Digital Marketer Skill Share. At the time of our video recording, the business is in the phase of collecting leads: people can sign up to join the waiting list for the event. This is a very smart way to be able to start marketing the event, get sponsors and gauge interest before actually selling the tickets.

Even if you're not currently organizing an event, this landing page from scratch video is for you if:

  • You would like to know how to build visually interesting layouts such as a grid layout and a 2-column layout, while making clever use of white space.
  • You want to discover how to make your most important information stand out immediately.
  • You want to become quicker at using Thrive Content Builder to create any page or layout on your site.

More...

Make Your Most Important Information Stand Out

​The main purpose of this homepage is to inform people about the details of the event and get people to sign up to the email wait list.

That's why above the fold we have:

  • A "Join Wait List" button in the header​ (4.19 min) that's linked to a call to action further down the page (27.27 min)
  • A white contrasting content box with divider elements to show off the "When" and "Where" of the event (8.16 min)
  • A horizontal lead generation element with custom filler text (13 min)

Custom Fonts

For this homepage we are using the fonts Montserrat and Lora, both are Google Fonts. From within the Thrive Dashboard, you can easily add custom fonts to your site. Follow this tutorial for detailed instructions.

Answer the "What's In It For Me?" Question

An event homepage is basically a sales page, you try to convince people that the event is worth the time and money.

That's why the "What's In It For Me"​ section is so important.

By using a two column layout with a title and a custom illustration on the left and a right aligned text element on the other side, we direct the eye to the most important persuasion element of the page. (28.41 min)

The use of white space is important here, to make the information enjoyable to read.​

The Next Phase: Selling Tickets

Soon, the tickets will be available for sale and at that time the lead generation elements will be switched over to call to action buttons. These buttons will then link to the pricing table on the page.

Now It's Your Turn!​

I hope you liked this new landing page from scratch video and that you found some new tips and tricks to implement on your site.

And if you have any comments or questions, please leave them below!​

Author: Hanne Vervaeck

Hanne knows exactly what companies have ever retargeted her (she keeps an updated file). And when she's not busy discussing high-level funnel design over cocktails with the equally geeky, you'll find her discovering a place for the first time

  • Mirko m says:

    Yet another entertaining and inspiring tutorial. Makes me want to start working on some landing-pages again as soon as possible. Thanks for the great work!

  • Richard Collins says:

    Hanne,

    This is one of your best. I watch all of your videos and always learn something interesting, either for content presentation or for basic page/post building.

  • Antonio T says:

    Awesome content as always. What would be really cool is if you guys could export the page you created and make it available for us more technically challenged folks :-)

    • Hanne says:

      Hi Antonio,
      We try to do that as much as possible like for this homepage but this time, we’re using elements that are not free of copyright and we can not give those away :)

  • nalin w says:

    Thank you Hanne – that was so helpful to see you work and hear you think. I definitely learnt some useful tips from you, which I will use.

  • Eugenio says:

    That was a very educational post and video tutorial!
    I will recreate step by step my own version of the page just to master my website building skill.
    The “link to page section” tip was specially valuable for me.
    Thanks.

  • Richard L says:

    Looks simple and easy to design the pages.. Very nice video and narration!

  • Angelito says:

    Awesome, keep it up! I haven’t even watched the video yet=)

  • Carol says:

    Is there a way to get this as a template? I’ve been playing around this afternoon and it would be a whole lot easier and less frustrating if I could simply plug and play (after editing of course!)

    • Hanne says:

      Hi Carol,

      I hear you, but this one is a bit tricky because we do not have the appropriate copyright to the different elements…

  • Great tutorial and the most intrsting news for me is this event, hope some thrivethemes Team member will comme also to the Island where i live since 2,5 years.

  • Dale says:

    Thank you – I learned a ton, very nice. I understand much better how to use the program.

  • Eddie Tiong says:

    Hi Hanne,

    Thanks for share the tips and tricks..
    I currently using the TCB over more than 1 year, I am surprising the video you shared is very useful for me which I never use of that before.

    If possible, share more this kind of tips and tricks video so that I can utilize all the function in the TCB.

    Thanks again for sharing

  • Dean Botha says:

    Quick question do you guys host the websites?

  • Hanne, just wondering – where do you obtain the thin divider lines you used for separating the ‘Date’, ‘Location’, ‘City’ elements. Love all your tutorials. Thanks :)

    • Hanne says:

      Hi Geoff,
      We made those in PhotoShop but you can do the same in any program that can save images such as PowerPoint, PickMonkey,… Draw a rectangle of 1px wide and the height and color you’d like. and save it without any background or space around it.

  • Joseph C says:

    Thanks so much Hanne! This is very timely for me since I’m putting together an online conference in July perfguild.com and this is going to help me create an awesome landing page for the event.

  • Pauline M says:

    Love the #join shortcut! Thanks for making these Hanne!

  • Octavio says:

    Hi, very nice tutorial explanation.
    Congratulations, this is a great tool
    thanks

  • Norm Bond says:

    Hi Hanne-
    Great job as always. Very efficient and effective.
    Cheers,
    Norm

  • Johan C says:

    Very inspiring the way you created this landing page for that live event in Bali. Great tutorial. thanks

  • Ryan says:

    Fantastic tutorial again Hanne. It’s so refreshing to see a step-by-step walkthrough. Even after so many years dabbling with websites, whenever you come to a new toolset (been with Thrive under a year) and you don’t work with it every day, resources like these are invaluable.

    You guys really do over deliver and it’s very much appreciated!

  • Rinaldo says:

    Hi Hanne,

    great tutorial as always. I’ve built quite a few pages using tcb and recently I’ve started to look into how to make a HTML5 video background. At first, I thought it was impossible, but as I looked more into it I’m pretty close.

    I’ve found some resources (I’ll post the links below – not mine) that give you the finished CSS and HTML code which I embedded and although I know some HTML and CSS I can’t get it to stay in place like a full height image would. I’m just that one step away.

    I think it would be amazing value to your audience and proof to tcb as a product if you guys looked into this and made a tutorial about this.

    I know that I would be immensely grateful.

    Please, let me know!!

    Thanks!

    [Links (these are not my links and this is not spam) : http://codepen.io/mattgrosswork/pen/jrdwK https://codepen.io/dudleystorey/pen/knqyK https://slicejack.com/fullscreen-html5-video-background-css/ ]

  • Juan G says:

    Thanks Hanne. A friend has an event soon and I am going to surprise her with a similar landing page you built. At the same time, I am going to convince her to change her old website….I will see…

  • Hello Hanne,

    Thank you for another great post and tutorial on LPFS. I want to let you know that I would really, really like and appreciate if you could do a new LPFS video tutorial on how to replicate the “look” and “feel” of the landing page and general website environment of John Lee Duma’s http://www.eofire.com

    I think it would provide great value to all of us, so please consider it.

    Thank you so much in advance for your time, help and attention.

    Best Regards,

    Luis

  • >