Getting Started

Once you’ve activated your theme, you’ll see a friendly notice across the top of the page, with a link to the Getting Started page (Appearance → Getting Started). Here, you can view the help file, enter your license for theme updates, view the latest changes to the theme and visit us on our support forum.

Activate Theme Updates
Each theme is backed by 1 year of support and theme updates. By activating your theme license, you can get seamless theme updates right from your WordPress dashboard. These updates will keep your theme in tip-top shape, with the latest bug fixes and new features.

  • Locate your theme’s license key in your Array Dashboard in your Downloads section. In the pop-up window, copy your license key.
  • Now, in your WordPress dashboard (where your theme is installed), go to Appearance → Getting Started and click the License tab.
  • Paste your license key into the field and click Save License Key.
  • Once your license key is saved, click Activate License.
  • If your key is valid, you will see a success message. You will now receive a notice on Appearance → Themes whenever there is a new version of the theme available.
  • To update your theme, click update now and follow the instructions. Note: Your theme will be overwritten with the latest files, which will overwrite any changes you’ve made to the theme files. Your posts, pages and settings will not be modified in this update.

Install Jetpack

Jetpack is a free WordPress plugin by Automattic, the folks who make WordPress. It’s a toolkit that provides various features and enhancements to your WordPress site. Designer utilizes several features of Jetpack, most importantly the Portfolio, and must be installed to get the most out of your theme.

  • Install Jetpack by going to Plugins → Add New and search for “Jetpack”. Install and activate the plugin.
  • After activating Jetpack, you will be asked to connect to WordPress.com to enable the Jetpack features. Click the connect button and log in to a WordPress.com account to authorize the Jetpack connection.
  • If you don’t yet have a WordPress.com account, you can quickly create one after clicking the connect button. This will allow you to use Jetpack for Designer or any other theme in the future.

Once installed, activated, and connected to WordPress.com, you can visit the Jetpack settings page, which is now available at the top of your admin menu. You will need to activate the following Jetpack features by clicking Settings tab at the top of the page, and clicking the Activate link next to each feature.

  • Carousel – The Carousel adds a beautiful lightbox carousel to your gallery images. Learn more about the Carousel
  • Custom Content Types – Custom Content Types enables our Portfolio! Once activated, you will see the Portfolio menu appear in your dashboard menu. Learn more about Portfolios
  • Infinite Scroll – Infinite Scroll is a feature that loads the next set of posts via a More Posts button, without reloading the page. Designer’s Blog and Portfolio page support Infinite Scroll. Learn more about Infinite Scroll.
  • Tiled Galleries – Add a tiled or square mosaic gallery to your projects with the Tiled Galleries feature. Learn more about Galleries.
  • Note: By default, Designer uses the click-to-load method of Infinite Scroll. To change this to load posts on scroll instead of click, open functions.php and look for Infinite Scroll Support. Change the type value from click to scroll


Using the Theme Customizer

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

Visit the Theme Options menu to setup a few default options for Designer.

  • Logo Upload: Upload your own logo to use in place of your site’s text title.
  • Always Show Sidebar: Check this option if you’d like the sidebar to always be visible.
  • Project Image Style: This option allows you to change the orientation of your project images. You can choose to have tiled images (default), landscape, portrait or square. (Tip: if after choosing an image style your images don’t look like they’re cropped correctly, you may want to try running through the Regenerate Thumbnails plugin. This plugin essentially refreshes your images based on Designer’s image dimensions.)
  • Number of Projects on Homepage: If you are using the Homepage template for your homepage, this option lets you control how many Portfolio projects to show on your homepage.
  • Project Archive Text: This text will be shown on your Portfolio archive page, which is located at http://yoursite.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 a minimal blog style, which is a nice style for Designer.

Visit the Colors menu to customize the colors of Designer.

  • Body Text Color: Change the color of your paragraph text.
  • Accent Color: Change the default blue accent color used throughout the theme.
  • Background Color: Change the background color of your website.
  • Sidebar Toggle Bar Color: Choose a light or dark color scheme for the sidebar toggle bar.
  • Custom CSS: Use this textarea to add your own CSS styling. If you plan on adding extensive styling, you should instead use a child theme, as it’s a safer way to preserve your custom styles.

  • WordPress menus can be found under Appearence → Menus.
  • If you don’t have a menu already, click create a new menu to create one.
  • On the left hand side of the Menu page, select the pages to add to your menu and click Add to Menu. Drag the pages around and arrange them any way you’d like. Create a drop menu by dragging menu items under and to the right of another menu item.
  • Now that you have the menu created, you need to assign it to the header in the Theme Locations section.
  • Save the menu when finished.

Social Icon Menu

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

  • To add a social icon menu, go to Appearance → Menus.
  • On the left side of the Menu page, click the Links menu item to add to your social links.
  • 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 the following sites: Twitter, Facebook, Google, Instagram, YouTube, Vimeo, Dribbble, Github, Flickr, Codepen, Behance, Dropbox, Pinterest, Reddit, Soundcloud, Spotify, WordPress, and Email..
  • Save the menu when finished.
  • You can now use this menu in the Custom Menu widget in Appearance → Widgets.

Homepage Template

By default, your homepage will be the index of your blog posts. Designer comes with a Homepage template that you can use in place of the blog index. The Homepage template outputs a block of text and your latest Portfolio projects in a grid.

  • 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.” You can change this to whatever you would like.
  • On the right hand side of the page under the Page Attributes window, apply the Homepage template.
  • Publish the page when finished.
  • Finally, we need to tell WordPress to use this page as the homepage. Go to Settings → Reading and set your new Homepage as the Front page. See this screenshot for an example.

Blog Page

By default, the blog will be your homepage and will show your latest posts. However, Designer uses the Homepage template for the homepage. You need to tell WordPress which page to use as the blog.

  • Create a new page called Blog. You don’t have to add any content or apply any templates to this page. You just need to create the page so we can utilize it in the next couple steps. Publish the page.
  • Next, we need to tell WordPress to use this page as the blog page where your posts will show up. 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 you need to add this page to your menu so users can access the blog page. Just go to Appearance → Menus and add your Blog page to the menu.

Portfolio Page

Designer uses the Portfolio archive page for your Portfolio page. This page shows a block of text at the top (added in the Customizer) and lists all of your projects in the order they were added. This page can always be found at http://yoursite.com/portfolio.

Add your Portfolio archive to your navigation by adding a link in the Links menu. The URL to your Portfolio archive is http://yoursite.com/portfolio. Add this URL and some Link Text and add the Portfolio link to your menu.


Contact Page

The Contact Page uses the WPForms Lite plugin, which can grab for free on the WordPress plugin repository. Once installed, you’ll see there is a WPForms link in the left hand sidebar of your WordPress admin.

  • If you haven’t already, create a new page called Contact.
  • Go to the WPForms menu on the left admin menu to configure your contact form. The form creation process is pretty simple, but you can check out the WPForms documentation here for help and tips.
  • After you’ve configured and saved your contact form, you will be given a shortcode like this: [wpforms id="161894"]. Copy your shortcode. We’ll use this to add the form to our Contact page.
  • Now head back to your Contact page. Paste the shortcode that you copied into the body of the post. Update the post. You should now see the form on the contact page.

Widgets

The widget section of Designer is in the sidebar, which is available by clicking the sidebar toggle bar. Alternatively, you can set your sidebar to always be visible. Visit Appearance → Customize → Theme Options to toggle this option.

Designer comes with a Portfolio widget to show off your latest projects. Once you’ve added some projects, add this widget to the sidebar and choose the number of items you’d like to show.


Adding Portfolio Items

To add portfolio items, first you’ll need to install and activate the Jetpack plugin. Once you’ve done that, go to Jetpack → Settings and activate the Custom Content Types feature. This will provide us with the portfolio functionality. Once you’ve activated the Custom Content Types, you’ll notice there is now a Portfolio menu item.

Similar to the way you add new blog posts, you can add a new project under Portfolio → Add New. 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. Each project’s featured image is displayed on the Portfolio archive and the Homepage template. The featured image is not displayed automatically on the single project page. We’ve done this so you have a full blank page to fill with your portfolio content, in any fashion you want. You may want a gallery at the top of a post, you may want a video at the top of the post, etc.

Create your portfolio item by adding any combination of images, videos, galleries and audio files. Designer will handle the styling of these elements on the front end. Activate Jetpack’s Tiled Galleries feature to add some additional gallery styles as seen on the Designer demo.

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.

Adding Media To Your Projects

The Designer demo uses a combination of inline images, tiled galleries, embedded video and audio. Make sure to activate Jetpack’s Carousel and Tiled Galleries for even more awesome galleries!

Error: Please enter a valid email address

Error: Invalid email

Error: Please enter your first name

Error: Please enter your last name

Error: Please enter a username

Error: Please enter a password

Error: Please confirm your password

Error: Password and password confirmation do not match