Recreating Tesla Website in Blocs 3

Hi guys,

Most of you have probably heard about it already, but I thought I should post it here again.

I have recreated the Tesla Model Y website using Blocs 3, and it turned out to be very close to the original. I didn’t use any code. Two main features which allowed me to do that are the new Snap Scroll bric and the new VH/VW controls we have in Blocs 3.2.2.

Check out the site here

Obviously, I don’t own any copyright material, so I cannot sell this exact website as it is, so I have created a copyright-free version of this design and released it as a Nikola Template. Blocs Templates members can now download it in your dashboard.

I will teach how to build some elements of this website in this month’s update to Mastering Blocs course, which I will share next week.

You can also check the quick video update here:

4 Likes

Hello @ Eldar,

as always a great job. Congratulations !!!

Only one question, there is no way to change the color of the guide marks on the left, when the background photograph is the same color ??, you lose the guide if you want to access by clicking manually.

Juan

Español:

Hola @Eldar,

como siempre un gran trabajo. Enhorabuena !!!

Solo una pregunta, no hay forma de modificar el color de las marcas de guía de la izquierda, cuando la fotografía del fondo es del mismo color ??, se pierde la guia en caso de querer acceder haciendo click manualmente.

Juan

Hi Juan,

Thanks!

There is an option to add a background color to the indicators, which will make it better visible, but I opted against using it to make it look a bit closer to the original.

I agree, this and the color-changing logo are two things I wish were easily done inside Blocs :slight_smile:

Cheers,
Eldar

1 Like

@eldar, so how do you use the new blocs snap scroll bric? Does it need javascript code to go along with it?

No, you just place it anywhere in dynamic area and that’s all. I recommend to set the padding of the blocs to full screen for the best result.

@eldar I see… it snap scrolls every block after the snap bric is inserted on that page. Is there a way to turn if off or once you insert the snap bric or will it control the flow to the end of the page?

Also, when I open the Nikola Blocs file and view it in Safari it does not snap scroll like the live preview? Any idea what I might be missing?

Thanks