10 Divi Sites with Awesome Project Pages

Last Updated on September 16, 2022 by 9 Comments

10 Divi Sites with Awesome Project Pages
Blog / Divi Resources / 10 Divi Sites with Awesome Project Pages

Project pages are great for showing potential clients the type of work you do. They often include case studies, which helps show your expertise and gives them a realistic idea of what to expect. There are several ways to create project pages with Divi. In this article we’ll look at 10 Divi sites with awesome services pages to help inspire you for your next Divi website.

Project pages typically include elements such as images, galleries, sliders, video, testimonials, and calls to action. I’ll show an image of the section I like and discuss what I liked about it. The websites are in no particular order. Hang around until the end for a few links to help you level up your own unique project page.

1. BCBD

This one shows a screenshot of the project within a laptop screen on one side and a larger screenshot on the other. Under the images is a two-column section with a title, description, and link to the website in one column, and a list of services provided in the other column. Under this is a section with screenshots of the website as displayed on different devices, a testimonial from the client, a divider, and a button to see the next project.

See Website

2. Jupper

This project page displays an image of the project followed by the client’s name, name of the project, and a divider. The next section shows a description within the left column and an image of the finished product on the right using a box shadow. More images with box shadows show the finished product in a single column followed by a call to action. The CTA uses dividers for the top and bottom and utilizes text with clickable email.

See Website (Website is down.)

3. Communication Design Partnership

This one shows a full-width header with a background image, logo, menu, tagline, divider, and a company description. Scrolling reveals a 2/3, 1/3 row with a large image of the project in the larger column and description in the smaller column. The description includes a breakdown of the project including a title, client name, brief description, solutions, and links to download the project as a PDF, to a contact form, and back to the portfolio page. A set of images from the project along with styled text are used as a CTA.

See Website

4. Cubic Fox

This project page displays an image of the project on a computer screen sitting on a desk. Text is placed next to the image and shows the project name, client, year, CMS, the services provided and a link to view the website. Under this are three screenshot examples of the project. Clicking on any of the images opens them in a lightbox. I like the screen-shot because it’s a real-world example.

See Website

5. Kim Vestergaard

This site shows a small section in black with links to different areas of the website. Scrolling reveals images from the project in a single column. The images show the typeface used, the color palette, the project design (which is a logo), and then lots of examples of how it’s used. The examples show the logo over different colors, as a desktop background, within a header, on a website using different devices, within examples of poster ads, and on social media.

See Website

6. Learning

This one uses a clean design with a full-width image and project title in parallax. Under this is a title and then two columns. The first column is text and provides the project description and includes a testimonial in bold. The second column uses a gray background to stand out and provides the information about the school. Under this section is a link to download the project information as a PDF. Another full-width section provides links to related projects followed by a full-width CTA.

See Website

7. Patti Houston

This one shows the project title and description followed by images of the project in a multi-column layout, alternating from a two-column to a one-column and short and tall images. One section includes text next to an image to provide more information about the project. Post navigation provides links to the previous and next projects. A divider separates the project from a CTA that’s built with text and a button. I love the layout of this one.

See Website

8. Blue Water Builders

This project page displays a full-width header with a background image with an overlay and title. Project information is provided within a full-width section as text divided by vertical dividers. Two columns show the project image gallery and details with text. Following this is a section with company logos to see other projects, a map to see the project in person, and post navigation to the next and previous project.

See Website

9. Kenny Payero

This one displays the project within two columns. The first shows the title, location, a description, post navigation to move to the previous and next project, and a button made of squares that takes you to the portfolio page. The second column displays images of the project within a grid. Clicking any image opens it in a lightbox.

See Website

10. The Zimmerman Group

This is one of the most elaborate on the list. It uses a full-screen header with background image, gradient, and client name as the project title. Scrolling reveals two columns with information about the client and blurbs of the services provided next to an image. Following this is a video about the client, images of the project including the website and ad campaigns (including a cool timeline), a project overview over a background gradient, and a CTA.

See Website

Ending Thoughts

That’s our look at 10 Divi websites with interesting services pages to help inspire you for your next Divi design.

There are lots of design and how-to articles here at the ET blog that are perfect for building project pages. The project page is a custom post-type that can be built with the Divi Builder and they often utilize elements such as galleries and page designs such as blog posts to show the work. I’ve included links to tutorials that cover both galleries and blog posts, and general page layouts.

We want to hear from you. Which of these websites with awesome project pages are your favorites? Let us know in the comments.

Featured Image via PODIS / shutterstock.com

Divi Marketplace

Are You A Divi User? Find Out How To Get More From Divi! 👇

Browse hundreds of modules and thousands of layouts.

Visit Marketplace
Divi Marketplace
Divi Cloud

Find Out How To Improve Your Divi Workflow 👇

Learn about the new way to manage your Divi assets.

Get Divi Cloud
Divi Cloud
Divi Hosting

Want To Speed Up Your Divi Website? Find Out How 👇

Get fast WordPress hosting optimized for Divi.

Speed Up Divi
Divi Hosting
Premade Layouts

Check Out These Related Posts

How To Migrate Your Website To Divi 5 (Public Alpha)

How To Migrate Your Website To Divi 5 (Public Alpha)

Posted on October 9, 2024 in Divi Resources

Divi 5 Public Alpha is available, so you’re probably excited to explore its new features and improvements. Transitioning from Divi 4 to Divi 5 involves a few important steps. This post will help you migrate smoothly from Divi 4 to Divi 5 Public Alpha, allowing you to take full advantage of Divi...

View Full Post
New Starter Site For Stylists (Quick Install)

New Starter Site For Stylists (Quick Install)

Posted on October 7, 2024 in Divi Resources

Divi empowers you to build the best websites possible, and now, Divi Quick Sites takes website creation to a whole new level. This revolutionary tool lets anyone, regardless of skill level, generate a complete website in under two minutes! Divi Quick Sites provides everything you need to launch...

View Full Post

9 Comments

  1. I really like the Kenny Payero site. It’s clean and easy to navigate from one project to another.

    Is there a way within Divi to add that type of navigation for projects? Or does it have to be built with links to specific before and after projects? I’m just thinking that if we end up removing or adding a project in the middle of things, we’d have to change all the links. But it would be nice if there’s a premade gizmo that would autogenerate new links for the navigation.

  2. Great blog! Thanks for sharing.

  3. Nice collection. Thanks for sharing this. Keep Posting…

  4. Great article Randy! It makes me thinking about rebuilding our portfolio page 🙂

  5. Thanks, this was helpful and interesting!

  6. Chris,
    I saw this in developer view

  7. Help me out — I don’t see any evidence the Ibis Bay Beach Resort website was built with Divi.

    • bcbd website was built with the DIVI theme.

    • It’s all over the source code. Just use the “view source” function in your browser.

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today