This tutorial is long (4-5 hours) but will cover everything required for developing every aspect along the way. We will start with an Adobe XD design for Desktop, Tablet and Mobile, with the home page and subpages, and see exactly what is required to build all the elements out.

I spent a lot of time on this, so I hope you like it.

Full Playlist: Adobe XD to WordPress

This is the process for developing a full website, including converting all images, making sure it's responsive and integrated with a CMS like WordPress takes a long time.

In this video, we cover topics such as:

Exporting Elements from Adobe XD
Installing WordPress and a theme builder
Setting up our theme file in CSS / SCSS
Creating our Header Navigation
Creating our Home page content
Developing a Footer
Adding Responsive design to all elements on the page
Ensuring a Tablet and Mobile design based on XD

I also have timestamps for this video which will include:

I have also put together a second part to this series where I built out the other parts of the website. See part 2 below:

Part 2 | Adobe XD to WordPress

In this video we cover:

I hope you enjoy the whole process. I will be doing another video to talk more about the development of this site for those who want to follow along!

Adobe XD to Wordpress | Full Development Process for Making a Website

Follow and support me:

Want to see more: