Designer

$75

designer

Promote your latest design work, photography, artwork, and more with Designer. Featuring a minimal, responsive design, Designer gets your portfolio up and running effortlessly, zero coding required.


Create Your Portfolio

designer-photography
Designer is perfect for photographers, graphic designers, artists, videographers, and students. Using a mix of images, galleries and video, you can easily create an impressive portfolio showcasing your latest and greatest work.

Designer ships with several portfolio styles including tiled, landscape (4:3), portrait (3:4), and square (1:1). We’ve provided support for all media types so that you can create a portfolio layout that best highlights your work.


Minimal, Responsive Design

designer-responsive

Designer was crafted for all screens, from desktop to mobile and every device in between. Images, text, galleries, and video scale down gracefully for a seamless mobile browsing experience.


Distraction-Free

designer2
Designer tucks away distractions so visitors and potential clients can focus on your content. Responsive site navigation, social links, and widgets are available via a slide-out sidebar, which can optionally be set to always show.


Detailed Typography

designer3

Designer’s typography has been carefully curated for bold, attention-grabbing headlines, and crisp, legible paragraph text. The attention to typography carries over to tablet and mobile devices to ensure your visitors are getting a beautiful experience no matter how they browse.


Customize Designer

designer-styles

Customize Designer to match your style! Choose from four sidebar color options including white, black, blue and gray. Designer also includes a minimal blog option, which complements Designer’s minimal style.


Social Links Menu

social-linksDesigner makes it easy to add your social media links to the sidebar. Simply create a menu with your links and Designer will add the matching icon to your link. Available icons: Twitter, Facebook, Google, Instagram, YouTube, Vimeo, Dribbble and Github.

Read more about Adding Custom Links.

Quick Specs (all measurements in pixels):

  1. Suggested logo width is 300 wide.
  2. The main column width is 936.
  3. Featured Images on blog posts are 787 wide by unlimited height.
  4. Images on Portfolio Projects are 937 wide by unlimited height.
  5. Images on Portfolio grid are 405 wide by unlimited height.

designer-customize

Getting Started With Designer

Designer is customizable via the WordPress Customizer. Here, you can change the theme’s options and add widgets to your sidebar. To access the Customizer, click Appearance → Customize in your dashboard.

Visit the Theme Options menu to set up a few default options:

  • Always Show Sidebar: Check this option if you’d like the sidebar to always be visible. Otherwise, the sidebar will appear as a slider that tuck away when not being used.
  • Project Image Style: Use this to change the orientation of your project images. You can choose tiled images, landscape, portrait, or square.
  • Number of Projects on Homepage: If you are using the Homepage template for your homepage, this controls how many Portfolio projects to show on your homepage.
  • Project Archive Text: This text is shown on your Portfolio archive page, which is located at yourgroovysite.wordpress.com/portfolio. The Portfolio archive page gives visitors quick access to all of your Portfolio projects.
  • Blog Index Style: This option lets you choose between a full blog (default) or an alternative minimal blog style seen below.

designer-minimal-blog-style

Setting Up the Homepage

designer-homepage-setup
By default, your homepage will be the index of your blog posts. Designer also comes with a Homepage template that you can use in place of the blog index. To use the Homepage template:

  • Create a new page. The title should be what you want the Homepage intro title to be. For example, the title of this homepage was “My latest work.”
  • In the Page Attributes panel on the right-hand side of the page, select the Homepage template.
  • Publish the page.
  • Go to Settings → Reading and set your new Homepage as the Front page. See this screenshot for an example.

The Homepage template displays the Homepage template’s page content and your latest Portfolio projects in a grid. The homepage grid style can be changed by visiting Appearance → Customize → Theme Options.


Setup Your Blog

The blog will be your default homepage. If you opt to create a static front page using the Homepage template, you’ll need to set up a different page for the blog:

  • Create a new page and give it a title. You don’t have to add any content or apply any templates to this page — just create a page. Publish the page.
  • Go to Settings → Reading and set your newly created Blog page as the Posts page. You should have already set your Homepage template to be the Front page. See this screenshot for an example.
  • Finally, add this page to your menu so users can access the blog page. Go to Appearance → Menus and add your Blog page to your menu.

Your Portfolio Archive

designer-portfolio-archiveDesigner uses the Portfolio archive page to display all of your portfolio items. This is similar to the homepage, but gives visitors access to all of your projects, rather than your latest ones. This page also shows a block of text at the top (added in Apperance → Customize → Theme Options) and lists all your projects in the order they were added. This page can always be found at yourgroovysite.wordpress.com/portfolio.

Add your Portfolio archive to your navigation by setting up a Custom Menu and adding a link to your archive page from the Links area. The URL to your Portfolio archive is yourgroovysite.wordpress.com/portfolio.


Adding Portfolio Items

designer-projects
Designer uses the Portfolio content type to display your projects. Start adding Portfolio items by visiting the Portfolio menu.

You add a new project under Portfolio → Add New, just like adding new posts. Like a blog, Portfolio projects are ordered by the date they’re created, with the most recent project displayed first. Adding a Featured Image to each project is highly recommended, since each project’s featured image is displayed on the Portfolio archive and the Homepage template.

There are two ways of categorizing your projects: Project Types (similar to Categories) and Project Tags (similar to Tags). These are available in the Portfolio menu item and on the Edit Project page. Learn more about setting up Portfolios.

Adding Media To Your Projects

The Designer demo uses a combination of inline images, tiled galleries, embedded video.


Social Icon Menu

designer-url

Create a social icon menu to let visitors know where to find you:

  • Go to Appearance → Menus.
  • On the left side of the Menu page, click the Links menu item.
  • Add the URL for each of your social profiles and a label for the link. Designer will detect which site you are linking to and display a matching graphic. Icons are supported for Twitter, Facebook, Google, Instagram, YouTube, Vimeo, Dribbble, Github, Codepen, Behance, Dropbox, Email, Pinterest, Reddit, Soundcloud, Spotify and WordPress.
  • Save the menu when finished.

You can now use this menu in the Custom Menu widget in Appearance → Widgets or via the Widgets section in Apperance → Customize.


Widgets

designer-widgets
The widget area in Designer is in the sidebar, which can be displayed by clicking the sidebar toggle bar. Alternatively, you can set your sidebar to always be visible. Visit Appearance → Customize → Theme Options to select this option, as seen above.