Redesign–Day 7

by cdwise 15. March 2014 19:29

Okay, I initially said we weren’t going to do any WordPress themes but after consideration and looking at some of the sites submitted I decided to show how a few simple changes to a Wordpress preinstalled template can personalize a site.

Site is:  needhelp4mac.com

Which uses the twentyeleven theme. As submitted it looked like

image

By uploading a custom image for the header it already looks different:

image

But that sure takes up a lot of space so scrolling down from where uploaded the image to where it says Header Text and uncheck the option to display it:

clip_image001 Results in:

 image

Finally, by adding the following CSS to a custom stylesheet:

.custom-background {
    background: rgb(249,249,251);
/* Old browsers */
    background: linear-gradient(45deg,rgba(249,249,251,1) 0%,rgba(215,214,219,1)
19%,rgba(249,249,251,1) 49%,rgba(215,214,219,1) 87%,rgba(249,249,251,1) 100%); } #page { box-shadow: 10px 10px 5px #A7A7A9; }

We get a nice drop shadow effect on the page with a diagonal gradient background, all done with CSS :

image

Not including the time to create or edit the image used you have a custom look in less than 10 minutes.

Tags:

CSS | Web Design | Training | Mac

Comments are closed


Outstanding Hosting