Photoshop Plug-in Giveaway: 3 x SG3xpress from MediaLab

Photoshop Plug-in Giveaway: 3 x SG3xpress from MediaLab

We’re so excited to team up with Media Lab to be able to offer their new product – SG3xpress to Onextrapixel’s readers. This new product enables you to convert Photoshop designs to WordPress themes and fully functional blogs.

Whether you’re designing a website, a blog, or a WordPress theme, Media Lab’s SiteGrinder plugin for Photoshop can give you a leg up on the competition by saving you time and money and by letting you give your clients exactly what they want. What you see in Photoshop is what you get in the web browser.

Photoshop Plug-in Giveaway: 3 x SG3xpress from MediaLab


There are other ways to get from Photoshop to a web page:

  • You can dig around in HTML and CSS code.
  • You can slice up your file into a bunch of individual graphics and reassemble them in a program like Dreamweaver.
  • You can even pay someone else to do the conversion for you.

But at Media Lab, the best way to go is to let SiteGrinder use the information in your Photoshop file and do the work for you.

How Does It Work?

There are three steps to creating a WordPress theme with Photoshop and SiteGrinder:

  1. Design the site in Photoshop, naming the layer, layer groups, and layer comps with special “hints” in the name, like “-button” or “-quickblog“.
  2. Customize CSS settings for text, links, backgrounds, borders, shadows and more in the SiteGrinder Design Manager.
  3. Deploy your WordPress theme and install it in your WordPress dashboard.

Let’s take a closer look.

Working in Photoshop

Just as with most design projects, when you’re creating a website or a WordPress theme, your work begins in Photoshop. It’s here that you design your site and assign hints to the layer names. With the SiteGrinder Advanced Blogs and WordPress themes there are two different ways to create the page design:

1. As a Quickblog

You can add “-quickblog” to the name of a Photoshop layer to build an entire blog in one step. Just create a rectangular text or graphic layer somewhere on the page, and apply the quickblog hint to the layer name. If you use a graphic layer to create your blog, SiteGrinder applies default font settings to the blog elements. If you use a text layer, you can put arbitrary text in the layer and SiteGrinder will use the font face, size, and color settings to create the default font for your blog. You can have any other text and image layers you want on the page, outside of the quickblog layer.

Quickblog Textlayer

2. As a Free-Form Blog

With -post, -comment, and -single layers as well as -blogdata layers you can use blogdata identifiers to manually arrange the elements of your blog on the page, giving you ultimate flexibility and control over the design of your WordPress theme. You can use these elements instead of a quickblog layer or in conjunction with a quickblog layer, to customize every part of your blog or only certain parts.

Freeform Photoshop

Whether you’re creating a quickblog or a free-form blog, you can also add any other visual elements to the page that you desire.

The Design Phase in SiteGrinder

Once you create your design and name your layers, open SiteGrinder 3 from the Photoshop File > Automate menu. When the SG3xpress plug-in opens, you can review any errors and warnings in the report that SiteGrinder provides, and set image compression as desired.

When you click build in the Build and Deploy panel, the SiteGrinder design manager will open and you can view your page in the web browser.

Quickblog DM

When you get into the Design Manager, you’ll see that there’s a new section here: blog appearance. It’s here that you can configure CSS text styles, buttons, forms, and other special blog-related elements.

On the web page itself in the main part of the browser window you will see a blog based on the blog layers you created in Photoshop. The blog will already be filled out with sample posts and comments so you can see what your blog appearance settings will look like once your blog has content in it. This is just preview content and will not appear in your final blog.

Blogstyles

You can go back and forth between Photoshop, SiteGrinder and the Design Manager as needed until your design is complete. Then you are ready to deploy your theme.

Deploying the WordPress Theme

For WordPress Themes, you simply deploy as a “WordPress Theme”, upload the files to your web server with a separate FTP program, and configure the rest of your blog options and content in WordPress.

Create a new site in the SiteGrinder plugin window, and select WordPress Theme for the type of CMS.

Deploy Theme

Deploy your theme to a folder on your computer then upload your theme to your web server’s WordPress themes folder using an FTP program such as Fetch or CuteFTP. After you’ve uploaded your theme files, log into the WordPress administration page on your server and apply the theme to a new or existing blog using the WordPress controls.

If you have WordPress installed on your computer you can test the theme there by placing the theme files in the WP themes folder.

You can include any visual elements you like in your own website, blog, or WordPress theme. Check out this Photoshop sample and click the image to see a WordPress blog using this theme.

Prettier Sample

If you want to know more, try out the free trial version of SiteGrinder and SG3xpress.

3 x SG3xpress Photoshop Plug-ins from Media Lab Up for Grabs!

For a chance to win one of 3 SG3xpress Photoshop plug-ins from Media Lab – all you have to do is post a comment below and tell us why you would like to win this. Winners will be chosen randomly from the comments. Please enter a valid email address.

The competition will be open until this Saturday, 23rd April 2011. Winners will be announced on this article and will be contacted via email.

Good Luck!

Here Are The 3 Lucky Winners

We are glad to announce the 3 lucky winners for the Photoshop Plug-in giveaway. They are:

  • Theresa
  • Penny Laporte
  • Marko

Winners will be contacted through email soon. If you are one of them and have not received an email from us or our sponsor by next week, please contact us.

Thank you for all your support. For sure, we will be organising more giveaway contest so everyone will have a chance to win, stay tuned!

Onextrapixel, or more commonly known as OXP is dedicated to delivering useful, comprehensive and innovative information for designers, developers and many others.

Comments

    • Šokre,
    • April 19, 2011
    / Reply

    I would like to win this because I want to create a webpage, i’am fimiliar with photoshop, and this would be very helpfull.

    • Nino,
    • April 19, 2011
    / Reply

    Congratulations, a wonderful gift. I’d like to win, but for sure I want to participate.

  1. / Reply

    I think I should win this, cause I have never won before :)

  2. / Reply

    I wouldn’t mind winning. All I want this because, I will help me to save my time making a psd to xhtml/css. If I would have one, I can concentrate more on Photoshop rather learning coding.

    • Dan,
    • April 19, 2011
    / Reply

    I’d like to win this because if it’s indeed an outstanding plugin and its CSS will validate(excepting IE bugs) it will increase my workflow and/or will make me concentrate on more important things like inspiration and creation.

  3. / Reply

    Because you can focus in designing and creating stuff instead of coding.

    • Jacek,
    • April 19, 2011
    / Reply

    Certainly a very useful plugin. Working with the task easier, faster operation. Tool to the workshop.

    • Michael,
    • April 19, 2011
    / Reply

    I own a previous edition of SiteGrinder but would love to upgrade!

  4. / Reply

    I want to win this because i want to convert some of my favorite designs into a webpage…

  5. / Reply

    Winning Sitegrinder would be so awesome… for both future clients and my own projects, as it harnesses the amazing power of Photoshop and the impact of the web… and now, WordPress! It looks so easy, too… What could ever top this combo?

    Peace
    Iggy

  6. / Reply

    This would be incredible to have! I have been learning so much recently and this will be a new venue for me to increase my knowledge and contribute more to the web design community.

  7. / Reply

    I would love to win. I have been looking into something to increase my productivity and this could do it! I love designing but the coding can be such a pain!

    • Rommel Lim,
    • April 19, 2011
    / Reply

    SG3xpress is a powerful unmatched web tool that every web designer should have. i’ll be very grateful to win a copy of this one. It will help me a lot in creating customized WordPress themes.

    • wenzz,
    • April 19, 2011
    / Reply

    I wonder how good it will work, if it does well, i´ll use it very often ;) so give me a chance to find out.

    • Rona Girasol,
    • April 19, 2011
    / Reply

    Making WP themes will becomes a breeze for me with this amazing new tool – SG3XPRESS! No more coding for me If ever I’ll be lucky to win a copy as I’ll be able to focus more on the design process. I love WordPress. It is a powerful cms solution but the amount of time and effort in coding themes/templates consumes too much of my time and effort but with SGX3XPRESS…it sounds very easy. Bravo Medialab!!!

    • Ian,
    • April 19, 2011
    / Reply

    I’d love a copy of SiteGrinder. It would streamline my WordPress development process since I mockup designs in Photoshop anyway. Cut out those extra hours of coding! Thanks for the opportunity.

  8. / Reply

    WYSIWYG for Photoshop—WYS(IP)IWYG. Looks interesting. Would love to win!

  9. / Reply

    I want to win the competition since I like to test different solutions.

  10. / Reply

    This would be great to have! It would allow me to turn some of my unused web designs into WordPress themes to give away as freebies on my site. Who doesn’t like free, quality WordPress themes!

  11. / Reply

    I want to win the competition and plugins because I work in Photoshop and WordPress daily and it would make my life much easier…

  12. / Reply

    I’d love to win. I’ve made over 10 wordpress sites and would love a tool to focus on design rather than coding.

    • Jeff Brown,
    • April 20, 2011
    / Reply

    I have NEVER won anything!! Plus I woke up this morning and thought “is there anything out there that can help me code my wordpress sites?”. Then I saw this. I want it. I need it. ‘Nuff said.

    • Steph,
    • April 20, 2011
    / Reply

    This would be really helpful in getting my designs to Word Press with the least amount of coding.

    • Dina Reyes,
    • April 20, 2011
    / Reply

    awesome giveaway omg!! I’d love to win this giveaway cause right I have no money at all, so this would be really really useful for me

  13. / Reply

    I’d love to win for I’m just now getting into WP and this would compliment my learning.

    • Theresa,
    • April 20, 2011
    / Reply

    I would love to win. I just discovered this amazing product. I’ve spent the last nine months trying to start and run my graphic design business. One area I need to learn is web design. However, finding the time to learn web production so I can offer it to my clients just isn’t happening. I don’t even have my own website up. Unfortunately, I need a good uninterrupted week or two to learn it and it’s been impossible given my workflow and the coding part is so greek to me. I KNOW psd and this would take a great weight off my shoulders and open up so many more business opportunities for me. I hope I win, this product seems to be the answers to my prayers.

    • Aaron,
    • April 20, 2011
    / Reply

    What a great opportunity! I would use it to speed up my design process so that I could get more themes ready to purchase. Thanks!

    • Penny Laporte,
    • April 20, 2011
    / Reply

    I just have to win this because I am a seasoned print designer struggling with web design… (and hating to admit it!). I work daily in Photoshop and would really put the SG software to the test. If I can learn it and build a more effective sites I would give you an awesome testimonial and no doubt be a lifer with your brand!

  14. / Reply

    This would be an excellent tool for us to use in creating great looking sites for our clients. We deal mainly with WordPress platforms, but find that most of the “pre-made” themes can be difficult to work with. I’d love to be able to design something from scratch and convert it to a WP site!

    • Tara,
    • April 20, 2011
    / Reply

    I’d love to win!
    I’ve been looking into Site Grinder and would love to be able to really try it out.

    • Arlen,
    • April 20, 2011
    / Reply

    This is pretty cool! Thanks all.

    • Jordan,
    • April 20, 2011
    / Reply

    I would love to win this so I don’t have to sub out the coding work like I use to have to do.

  15. / Reply

    I would love love love to win SG3xpress because I love SG3!!! and I want to expand my horizons!!! :D

  16. / Reply

    i’d like to win because it’s very awesome giveaway for photoshop users to create a website.

  17. / Reply

    This plugin is awesome and it helps the designers task to almost 90% in HTML Prototying. I love to receive this plugin for my Photoshop.

    I’m looking for it. :-)

    Thanks for this wonderful giveaway.

  18. / Reply

    This seems to be a great software to built word press and normal web pages I am eager to try out this software, thanks all

  19. / Reply

    I don’t like the look of this at all. I will keep my code in Coda and my design in PS, Pixelmator and AI.

    • karan,
    • April 20, 2011
    / Reply

    its a great tool, and i need it for my sites, it can save lot of time and help me work done faster.

    thanks for giveaway.

    • JM Flores,
    • April 20, 2011
    / Reply

    I’d love to have this; it’s going to make my life a whole lot easier and I won’t have to squint at the screen for too long anymore.

  20. / Reply

    I would love to give it a try ! It might be helpfull

  21. / Reply

    Media Lab’s SiteGrinder is a godsend! The way how I create a wordpress theme will be changed a lot easier. I must win this.

  22. / Reply

    Sure it’s a way easiest way of getting my ideas designed!

  23. / Reply

    Want one baaaaadlyyyyyyyy!!!

    • Sean,
    • April 21, 2011
    / Reply

    I would like to win this because I’ve used lesser plugins like this before and they let me down. Now is a time to be a believer :-) It would be nice to automate a chunk of the work and then go in and clean it all up.

  24. / Reply

    I need this! I hate slicing things in PS and then re-assembling them… We humans are so advanced and i still have to work that way? No, thanks… Please, one SiteGrinder this way :)

    • Monika,
    • April 22, 2011
    / Reply

    Great!! I really need this!!

  25. / Reply

    Hi everyone, thank you for your support. The contest is closed.

    The winners are listed at the end of this article. Thank you!

Leave a Reply

Your email address will not be published. Required fields are marked *

Deals

Iconfinder Coupon Code and Review

Iconfinder offers over 1.5 million beautiful icons for creative professionals to use in websites, apps, and printed publications. Whatever your project, you’re sure to find an icon or icon…

WP Engine Coupon

Considered by many to be the best managed hosting for WordPress out there, WP Engine offers superior technology and customer support in order to keep your WordPress sites secure…

InMotion Hosting Coupon Code

InMotion Hosting has been a top rated CNET hosting company for over 14 years so you know you’ll be getting good service and won’t be risking your hosting company…

SiteGround Coupon: 60% OFF

SiteGround offers a number of hosting solutions and services for including shared hosting, cloud hosting, dedicated servers, reseller hosting, enterprise hosting, and WordPress and Joomla specific hosting.

d
c