Site Redo with Agency Pro

Community Forums Forums Showcase and Feedback Site Redo with Agency Pro

This topic contains 9 replies, has 6 voices, and was last updated by  stinkykong 5 months ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #66231

    stinkykong
    Participant
    Post count: 169

    I was impressed with the new Agency and took it for a test spin. Here’s my results:

    http://websentia.com/


    Web Design by Websentia Web Services
    http://websentia.com

    #66239

    braddalton
    Participant
    Post count: 10182
    #66344

    stinkykong
    Participant
    Post count: 169

    Most of the credit goes to Studio Pres Designer, Lauren Mancke and perhaps others on her team. Took some trial and error on the background. An easy guide is to take a large photo, draw a white rectangle somewhere off the artboard, draw black rectangle over entire artboard including photo and over the white rectancle. Set black rectangle opacity to so underlying white rectangle matches the color of the demo site’s laptop, roughly #6d6d6f and tweak from there.


    Web Design by Websentia Web Services
    http://websentia.com

    #66447

    coralseait
    Participant
    Post count: 105

    Very nice, thanks for sharing!!! Love that background image.

    Cheers!


    #66582

    tejones
    Participant
    Post count: 26

    That is cool. I love the theme and think, maybe, some day, I’ll have a reason to use it.


    #83371

    Bader
    Participant
    Post count: 25

    Clean and beautiful looking.
    Do you mind pointing me out to how you achieved the side-bar “one-block” look please?

    Cheers


    “Whether you think you can, or you think you can’t–you’re right.”
    ― Henry Ford

    #83376

    stinkykong
    Participant
    Post count: 169

    Are you referring to the sidebar on sub pages such as Contact Us ( http://websentia.com/contact-us/ ), or the home page?

    What you see in the primary sidebar on the sub-pages, two blocks as there are two elements entered in the widgets panel. The bottom of these two blocks have a single instance of Genesis-Featured-Posts with the number of posts selected to be “2″. You can see all the CSS work at http://websentia.com/wp-content/themes/agency-pro/style.css. Search for “steve adds” which is a comment that encases all my custom CSS rules. You can perhaps pull what you need from there. If that doesn’t answer your question, please reply back here.


    Web Design by Websentia Web Services
    http://websentia.com

    #83386

    Bader
    Participant
    Post count: 25

    Thank you for the fast reply Stinkykong.

    Yes I was referring to the sub-pages like the Contact Us page.
    It looks pretty compact. I guess I’ll have to decrease the padding to achieve that :)

    Thanks for the CSS work link too. I’ll check that right now.

    Cheers!


    “Whether you think you can, or you think you can’t–you’re right.”
    ― Henry Ford

    #105878

    cass
    Participant
    Post count: 2

    Stinkykong, I think your site looks great! I’ve been looking through the forums in search of ideas about how to prep the image for the Agency Pro background, which is what I think you explained above with the white and black rectangles and changing the opacities. I’m just a beginner at photoshop and so I’m sorry for my newbie questions – but I was wondering if you could explain your system a little more. Are you referring to using a program like photoshop? Also, when you mention drawing a black rectangle, am I understanding correctly that you mean to draw it to completely cover the image (which would darken the image sufficiently to then make the image secondary and make it easier to read the writing on the welcome page and everything else too?). I think that while I’m writing it out I’m starting to understand it further!

    Thanks so much for sharing you tip!

    #105879

    stinkykong
    Participant
    Post count: 169

    Photoshop works fine for this. Place or open the image in Photoshop. Create two new layers that will be above (i.e., on top of) the photo. Select one of the new layers, and you can either draw a rectangle (which you’d do in Illustrator), or you could use Photoshop’s Paint Bucket tool to fill the entire frame with color. On one of you layers use full black (#000000) while in the other layer, use full white (#FFFFFF), then adjust the opacity which in Photoshop is in the layer’s palette (at least in my version CS4). 0% lets your image show through fully and increasing the %-age either darkens or lightens, makes richer or brighter.


    Web Design by Websentia Web Services
    http://websentia.com

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.