Adobe Portfolio: create an online portfolio website [step-by-step guide]

PF logo

Are you an amateur or professional photographer and looking to present your work in an online portfolio website? With Adobe Portfolio you can create a professional online portfolio web site to showcase your work to your audience. And the good part is, as part of your Adobe Creative Cloud subscription you automatically get access to Adobe Portfolio. You don’t have to pay any extra for this. Sounds great, right?

Read on to discover how to create a great online portfolio website of your work. I will touch on the following subjects:

  • using Galleries and Pages
  • using a custom domain name for your online portfolio website
  • integrating Lightroom with Portfolio

What is Adobe Portfolio

Adobe Portfolio is a service that is part of the Adobe Creative Cloud offering. It allows you to create an online portfolio website without any knowledge of HTML and CSS. It offers you a set of themes with different styling to kickstart your web site. Adobe Portfolio also lets you create galleries showcasing your work as well as other types of pages. It integrates directly with Adobe Lightroom and enables you to access photographs that you sync via Creative Cloud. Check out my own online portfolio website to get an idea of what is possible.

ronaldlips.ln

Create your online portfolio

You can access Adobe Portfolio on portfolio.adobe.com. If you are not logged in to Adobe Creative Cloud, you need to do this first. Once logged in, the Portfolio homepage is presented, containing a prominent button ‘Edit Your Sites’. Click it and the page below is presented.

create new site

Next step is to select whether you site will consist of a single splash page or whether it will contain a gallery of your work. As we want to create an online portfolio website that integrates with Adobe Lightroom as well, we need to choose to create a gallery of work.

site type

Theme Selection

Next, you need to select a theme for your online portfolio website. Adobe Portfolio provides you with 8 predefined themes that serve various purposes. This can range from a grid layout to a homepage with large cover image. You can review each theme. In this example I am using the Andreas theme, which presents each gallery with a two-column container. One containing the title, the other containing the gallery cover image.

Select the one you like by choosing ‘Use this theme’. Should you later want to change your mind, you can always change themes at a later stage.

Final step

As a final step, a blank page has been created with a default title that you can start adding your work to. The homepage already contains a gallery that is empty if this is your first Portfolio site. You can now start filling the page with one or more galleries. I will show you this in the next section.

setup ready

Add content to your online portfolio website

To add your first gallery to this page, click on the Add Page button, indicated by a large plus-sign. A popup is presented that asks you to select an ordinary Page or to select a Lightroom album as the source for this page.

add page

First I will show you how to add a an ordinary Page, later in this article I will show you how to add Lightroom albums to a page.

Add a standard page

Next, various types of content are presented that you may want to add to your page. This ranges from simple text to adding embedded HTML to adding photographs to your page. You may also add social icons to a page to refer to for instance your Facebook or Instagram account. Have a play-around with these various pieces of content, to see what they do.

For this example I am choosing Photogrid, as this is the way I want to present my photographs on this page.

add photo grid

Having selected Photogrid, you are presented the option to either upload your photos or to use Adobe Lightroom as the source for the photogrid. In this example I am choosing to upload my photos using the option ‘Upload Files’.

upload files

As a next step, I am presented with a standard File Open dialog. This enables me to select photographs that I have stored on my local computer (in this case an iMac).

select files

Having selected all photos that I want to include in the grid, I click on Open. The page presents the photos in a regular grid as presented below.

photogrid result

Modify your selection

Should you want to add additional photos to the grid, you can always do so at a later stage. Do this by clicking on the pencil icon that appears in the upper left corner of the grid when you hover over it with your mouse.

modify photogrid

When clicking on the pencil, a menu appears that contains the option Edit Grid. Click on it and you can add photos to the grid. You can also add a caption to each photo and reorder the photos in your grid.

In fact, you can modify any element on your page by clicking on the pencil icon. Appropriate options will appear. For instance, I can change the whole page container by clicking on the pencil icon. This allows me to change margins and width of the container.

modify page

Now I can take a look at a sneak preview of my new page by clicking on the Preview button at the bottom of the page. Here’s the result!

page result

Last, have a look at the home page, presenting the new gallery. I can go back to the new page by selecting the pencil icon in the upper left corner again. I can also change the cover image that is used to present the gallery on the home page.

change cover image

Adding content from Adobe Lightroom

To add content from an Adobe Lightroom album directly to your online portfolio website, some preparation in Adobe Lightroom is necessary.

First, make sure that you are signed in to your Adobe Creative Cloud account in Lightroom. To check this, verify that in the upper left corner of Lightroom your name is presented. This indicates that you are signed in. Secondly, make sure that sync with Lightroom CC is enabled. You can verify this by clicking on the small triangle besides your name and sync with Lightroom should be running.

lightroom sync

Now, I am assuming you know how to create a collection in Lightroom. (if you are not sure how to do this, please look at this short tutorial to get up to speed on this topic). So, go ahead and create a standard collection in Lightroom and put some photos in that collection. For this example, I have created a Venezia Collection in Lightroom.

Now, in the list of all your collections, find the collection you have just created (in my example Venezia Collection). At the leftmost part click on the icon presented in the image below. Once enabled, that collection is synced with Lightroom CC and ready to be included in your online portfolio website.

sync collection

Lightroom Album

Now, back in Adobe Portfolio, add a page and select Lightroom Album as the type of page. A new window opens, that presents all Lightroom CC collections, included my recently created Venezia Collection.

select lightroom album

Select the album(s) you want to import and click on Import Selected. Your album will be automatically presented in a grid as shown in the image below.

lightroom album photogrid

You can know perform the same customizations as described earlier. Please note that when you add new photos to the collection in Lightroom, these will not be automatically synced to Portfolio. You can add these new photos by selecting Edit Grid and again use Lightroom as the source for adding photos instead of uploading photos manually.

So, assuming you are already using Lightroom as the core of your photography workflow, simply syncing a collection with Lightroom CC makes it available to Portfolio as well, without any uploads! This saves you the hassle of generating JPGs, storing them on your local computer and uploading them to Portfolio. Neat, right?

Publishing your website

The last step to make your online portfolio website on the internet, is to publish it. Before publishing you can preview it and simulate various devices such as smartphones and tablets. After that, simply click Publish Site at the bottom of the screen and you’re all set! Your portfolio is now online and available to anybody who is interested.

Using a custom domain name for your portfolio website

By default, Adobe assigns a domain name to your online portfolio website that belongs to the domain myportfolio.com. Typically, the format of your domain name will be <your Adobe login name><some number>.myportfolio.com.

While this is totally workable from a technical point of view, when you are serious about advertising your work on the internet, a custom domain name is the way to go. Typically, you will want to your work to be found on a domain such as www.<yourname>.com.

Setting the domain name

Fortunately, this can be done with Adobe Portfolio as well. These are the steps to follow to achieve this:

  1. Purchase the domain name of your liking that you want to use for the Portfolio website. You can purchase a domain name through Adobe (see image below) or through many Internet Service Providers (ISPs) that provide this service.
  2. If you purchase your domain via Adobe (they are partnering with Namecheap for this), this is the only thing your have to do. Adobe takes care of the rest of the technical stuff. So, if you do not have a domain name yet, this is the easy way to go.
  3. If you already own a domain, you need to configure the domain to use the Adobe Portfolio provided IP addresses. These addresses can be found when you click on Connect Your Domain as shown below. Now, this is pretty technical, so if you are not sure how to do this, please get some support from your ISP. Making mistakes here, may cause serious problems with using your domain name!
  4. On the web site of your ISP, you need to change the A record and CNAME record of your domain to point to the Adobe IP addresses:
    •  A Record: Host: @ –> Points to Adobe IP address
    • CNAME: Host: www –> Points to Adobe IP address

Specify the domain in Portfolio

To specify a custom domain name in Adobe Portfolio, click on the cogwheel on the left side of the page.

tools

On the popup window that opens, select Domain Name on the left hand side. Either click on Purchase a Domain (to purchase through Adobe) or Connect Your Domain (to connect an existing domain).

set custom domain name

When you purchase your domain through Adobe, you’re done and you should be waiting for your domain name to become active.

When you connect your own existing domain, you need to obtain the IP address presented in the next popup window and use these to configure your domain at your ISP site. Then, come back to this screen, enter your domain name and click Apply.

connect domain

Final Words

As you can see, you can publish your work in an online portfolio without any coding or technical knowledge required using Adobe Portfolio. If you are already subscribed to Adobe Creative Cloud, Adobe Portfolio is available for free.

The Adobe Creative Cloud Photography plan is already available at around € 10 / $ 9,99 per month, giving you Photoshop and Lightroom as well as Portfolio.

Please support my site by using the link below.

2 Replies to “Adobe Portfolio: create an online portfolio website [step-by-step guide]

  1. Hello,

    I try to creative photo grid on a homepage. I dont want to create folder or page at first. Is it possible to have on homepage photo grid?

    Thank you for your response.

    Olda

Leave a Reply

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