Our Work Section on the Sydney Demo homepage

Hi, What widget do I use to create the “Our Work” section on the Sydney Demo homepage? Also, what adjustments should I use to make my Our Work section look just like the demo? Thanks

Hello there,

Please check our documentation here https://athemes.com/documentation/sydney/

In order to display projects, you have to install portfolio plugin (available from documentation page), and also be sure to check instructions for Creating projects - also from documentation page.

All the Best!

This response wasn’t very helpful.

The documentation isn’t clear as to how to get the “Our Work” section of the website working, which that was the Number 1 reason why I picked this theme over others.

What’s completely neglected here is how to actually get the portfolio images to show up on the home page. Yes, I get it, I installed the plugin, I created some projects, set some feature images, and added some shortcode, but what do I do to get those to show up on the home page? Do I add a widget? If so which widget?

Ugh. THis is so infuriating.

I’ve finally gotten the portfolio section to display by adding the shortcode to the “site origin editor” plugin on my front page. All of my specified categories are showing up just fine, but it’s not showing any images, despite all of my images being created as projects, every project having a feature image, and the short code showing post_type=“projects”

What the heck am I doing wrong here?

Got it to work. One of my categories was wrong in the include="" area, which apparently threw off the entire code. Only the slug versions of categories work there, which you can see by going to projects–>categories–> then click on the category


Thanks for update. We are glad to hear that you have managed to resolve this by yourself. Documentation is not going into details, because adding shortcodes to page content is pretty basic WP staff, so sorry for that.

If you have any further questions, just let us know.
All the Best!

Why isn’t there a video tutorial for this??? I read the instructions more than twice and still don’t get it. I am not a programmer or developer to understand where to put the code. I did import and install the Sydney Settings and installed the Portfolio Plug-in.

@Antonio Jones

Hello again,

You don’t have to be programmer in order to use shortcodes. Shortoced are common way for adding content with an ease. Plugin is allowing user to add shortocde which will display items from projects section. Use projects categories slugs http://screencast.com/t/n1QabVQ4, and write them for include attribute. Paste example shortocde from doucmentation page to text widget http://screencast.com/t/Ypx7rM1f9 on your front page:
[sydney-masonry posts=“8” show_all_text=“See all” post_type=“projects” filter=“yes” include=""]
and inside include write slugs from project categories which you want to display. In our demo we have included several categories http://screencast.com/t/Ypx7rM1f9

That is all. Probably you didn’t work with shortcode earlier, but since you get familiar with this one, you will know how all of them work - shortcodes have unique attributes which you can use to display some content in different way.

All the Best!

I cannot get my filter buttons to work? They do not fitler through the images below them? Also how do you center the images below the filter buttons?


Hello there,

Images will be centered automatically, and also filter links have to work out of the box, if all specified categories contain portfolio items, if they don’t there will be nothing to filter.

Please share your page link with us so we can inspect this on your end.

All the Best!

Hello and thanks for your reply!
The images and filter links were fine when I logged in the next day.
Maybe it was a cache problem?
On the same subject how would I:

  1. change color and size of filter buttons
  2. When photos are clicked how would I set up a link to a photo galley page and what photo gallery would be best to use with this theme?
    Thank You


Hello again,

  1. Color and size of filter links can be changed with custom css code below:
/*filter links backgground*/
.project-filter li {
    background-color: #ff0000;

/*filter links color and size*/
.project-filter li a {
    color: #ffcc00;
    font-size: 16px;

You can apply the code with this plugin https://wordpress.org/plugins/simple-custom-css/

  1. When photos are clicked, they are automatically leading to project post which you can edit, and you can add images to it over media library, like in any other post. If you want to use some plugin you can search for one on WP org https://wordpress.org/plugins/search.php?q=gallery

All the Best!

I put the css in my child theme and it works very well!
Can each filter button be a different color?
You recommended plugin https://wordpress.org/plugins/simple-custom-css/.
If I used this instead of putting in child theme will it be over written with theme updates?
Thanks for your help!

Good morning, thanks for the recommendation of the plugin, you can mention your website to see its functionality. Thank you


Hello again,

  1. Filter buttons can be in different colors, but we have to inspect your page in order to assist precisely. In general, you have to make adjustments with css for li and a elements, and after that you have to use data-filter selectors and to prepare custom css for each filter button. You can find these selectors with google chrome developer tools http://screencast.com/t/WFqB9Msxs5k

And this is css code which is used in the example:

.project-filter li a {
    display: block;
    padding: 10px;
    width: 100%;
    height: 100%;

.project-filter li {
    padding: 0;

.project-filter li a[data-filter=".nature"] {
    background-color: #ffcc00;

Note that for this example only one button is styled.

  1. Plugin is independent, and styles will be maintained after theme updates.

All the Best!

Thanks for the reply.
My page/site is under construction so needs a back end password to see it.
Please recommend how I should set up so you can take a look.
Thank You

Hello again,

It is not big and demanding change, so you can build your site first, and when you are finished, and your page becomes live, post to this topic again, and I will prepare custom css code for you.

Best Regards

On my Masonary layout which only has 3 post, the pictures are flush left.
How do I get them to center?
Also How to I change the font color on the title?


Hello again,

You were probably thinking on OUR WORK section and portfolio plugin. You need to have at least 5 items, and they will be centered then. 3 items cannot be centered because positions are applied by js script, and elements are absolutely positioned. This simply cannot be changed with css.

Your page needs to be live so we can generate css code in order to change title color.

All the Best!

I was reading thru the posts and had a look at the screenshots. How come i dont have the projects section like in this screenshot.

On top of the Appearance, I have Contact, Comments, Pages, Media and Posts.

Is that feature for Sydney pro?