WordPress.org

Ready to get started?Download WordPress

Forums

Need Realistic Advice on how to improve theme (9 posts)

  1. danny_getextra
    Member
    Posted 1 year ago #

    Hi Guys,

    I'm taking up a project and am still in the planning stage.

    I've got an old theme which I've customized for use here it is.

    http://79.170.44.141/dannycouncil.co.uk/

    Can I please have some advice and tips on what to improve with the design and looks of the site itself. I think it needs updating but I'm not sure where to start.

    Thanks

    Danny

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    I'd prefer this sort-of design
    http://awesomescreenshot.com/06eik7e00

  3. danny_getextra
    Member
    Posted 1 year ago #

    I think that has some great addition's to it. Did you change it in photoshop?

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    I used Google Chrome's Inspect Element tool to make temporary CSS and HTML changes within the browser.

  5. danny_getextra
    Member
    Posted 1 year ago #

    Ohhh. I see I'm familiar with that just didn't know if you'd photoshoped the image or done that. But now I know.

    I'm gunna most likely play the the back and front end of the site as functionality is very important aswell.

    Thanks

  6. danny_getextra
    Member
    Posted 1 year ago #

    Could you kindly list the css changes for the footer and pushing the background to the top like that.

    Guessing its something like

    #footer {
    background #(colorhere) repeat x;
    margin-top:(ammount of px's);
    }

    body {
    background url:top center repeat-x;
    }

    somewhere along those lines.

  7. Andrew
    Forum Moderator
    Posted 1 year ago #

    I added and moved about HTML elements too.

    • Moved <div id="header"> just above (and outside) of <div id="wrapper">.
    • Then added and wrapped <div id="header"> within a <div class="outer header">.
    • Then used style.css line 103 and appended the selector to hold the header.
      E.g
      #wrapper,
      #header {
      width: 942px;
      margin: 20px auto 0 auto;
      border: 1px solid #C5C5C5;
      background-color: white;
      padding: 9px 8px;
      }
    • Applied the background image (of the tree/landscape) to <div class="outer header"> and gave it a bit of height.

    Did the same for footer.

    If you don't receive further HTML and CSS help (as this forum is not meant to cover it), try this forum http://csscreator.com/forum .

  8. danny_getextra
    Member
    Posted 1 year ago #

    any more advice for the theme, I can make those changes no problem. Just wondered your approach. Thanks anyway.

  9. Andrew
    Forum Moderator
    Posted 1 year ago #

    • Use consistent gutters.
    • Keep white-space as your friend
    • Use rounded corners where aesthetically necessary (and consistent)
    • Focus on the theme, (Danny's Parish Council) who they are, what they're about. Then add their personality to the website (abstract I know).
    • Don't be deterred to explore the full width of the browser.
    • Create and keep consistent a colour scheme of at most 4 colours (not including white), but preferably 3.
    • Align text to follow layout, i.e be careful not to add margin/padding-left to text. It decreases readability.

Topic Closed

This topic has been closed to new replies.

About this Topic