Designed a PSD to WordPress Elementor Website.
So, I received an Order to develop a WordPress website for a weight loss product selling campaign.
Initially I just converted the psd files into high web quality images and placed the images into the wordpress site and showed the website to the client.
The client mentioned that he needed a complete website designed instead of an images strapped to his web pages.
I agreed and then started to design the wordpress website with the extracted elements of the psd files.
Regarding ‘how to extract elements (or) layers from the psd files to be used in the WordPress Elementor plugin‘. You can simply Open the psd file in the Adobe Photoshop and Select the Layers tabs and then Click the first layer then while holding the Shift button Scroll down upto the last layer and Click that one too. Such that all the Layers are selected, now Right-Click the layers and Select Export as Png, and choose a destination for the Layers to be extracted. Thereby all the layers are extracted into that Folder.
Now, having all the requirements at hand I started to design the website. And added all the contents of the psd files into the site with Elementor plugin. The best way to add the contents and the images in the place they are, is by making the correct use of the background images, padding. margin and z-index in the Elementor plugin.
Soon the Website was designed, later on I added some entrance animations for certain layers to get a good look for the website.
I also designed the website to be responsive and quick to load.
Website : https://look-awesome.com
Review from the Client:
Do you Need a Webste Designed from your Adobe PSD ?