A few days ago Themeshaper announced the release of Boardwalk and Cubic, two beautiful new themes that display image-specific content in very unique ways. Because we’re always on the lookout to share tools that our Photography and Photoblogger uses can take advantage of, we decided to play with with a bit and show you how great they work with FooGallery and FooBox.

Here’s a video overview of both themes and a really cool way to not only use FooBox to open the images contained within the posts but also to open these posts within FooBox itself.

[content_toggle style=”1″ label=”Show%20Video%20Transcription” hide_label=”Hide”]

Hi all. This is Adam from FooPlugins. In today’s video, I want to show you a couple of new free themes that are available in the .org theme directory. These are a couple of themes by Thomas Guillot or Guillot, I’m not quite sure how it’s pronounced but one of those help.

The first was called Boardwalk. That’s right here. You can see a screenshot. It has a horizontal scrolling and it makes you use of the featured images there. The second one is called Cubic. That showcases in a tile format and that scrolls vertically. I’m showing you these because a large portion of our users for FooBox and FooGallery and our other plugins are photographers or very image-heavy businesses. These themes fit right into what we’re doing with WordPress media. What I’ve done is I’ve installed … I’ve got Boardwalk activated now on a test site. If I flip over here, you can see I’ve got some example post. I tried to have a little bit of fun. There’s me eating a meatball. If you scroll with your mouse, as you hover your cursor, you can see that the horizontal scroll is taking effect. It’s pretty slick, pretty cool, very different from what you see on most blogsites. It really looks nice.

I want to show you what a single post looks like. If you go to a WordPress Gallery Post and go ahead and click on that and it’ll load there. Again, that featured images is used on the top. You can see you’ve got your WordPress gallery. If you click your gallery, you’ve got your single image. Before I get to Cubic, I just want to activate FooBox, the free version and show you what that looks like here, just so you can the full effect there.

Let’s go ahead and activate FooBox Free. That’s active. Let’s go ahead and refresh this main page. Now, when I go to WordPress Gallery Post, you’ll see that you got the image being displayed very nicely up there and then if you have a gallery underneath that, you can display it in the FooBox Lightbox. You can use your arrows to go through. You can click to go through, whatever you want to do. Click outside of that and you’re all done.

Then if you happen to use FooGallery, you can do the same thing there. This is a FooGallery post. Right now, I don’t believe I have FooBox chosen so let me go ahead into the galleries here. I got my gallery one, I’m going to edit that. If you don’t know what FooGallery, you could choose from some built-in templates. I’m chosen the responsive image gallery template. You can have masonry, simple portfolio, justified gallery, et cetera, et cetera. You can choose what Lightbox you want to be active for that gallery. I’m going to choose FooBox Free. It recognizes it because it is activated on the site. I’m going to go ahead and refresh that. You can see that it opens in FooBox as expected. You’ve got a beautiful theme here with Boardwalk that displays images really slick.

Then you’ve got the addition of FooGallery and FooBox and then the built-in WordPress gallery. It makes for some pretty nice visual layout. Let’s go ahead and change the theme to Cubic. Go to appearance, themes, so you can see what Cubic looks like. Activate that, refresh the front page. Again, super cool visual layout, right? Way different from most WordPress traditional blog style themes. It’s so nice for image-heavy sites like photography sites or businesses that specialize in some visual medium. Again, if you go to the single post, you can see it makes use again of that featured image which is super cool.

Let’s go back to Boardwalk. I want to show you a little trick here. This is a little Easter egg, little hidden gem here. Let’s activate Boardwalk. Go back to the main site. Now, this does not work with FooBox Free. This, what I’m going to show you only works with the FooBox Pro Version only because that version, you can add some custom JavaScript code. What I want to do is I want to open one of these posts straight into a FooBox Lightbox. Let me go ahead and show you how to do that.

First thing I’m going to do is go to plugins. I’m going to deactivate the free version. I’m going to activate the pro version. Then I’m going to grab a little snippet of JavaScript code. I’m going to go to settings, FooBox, JS and CSS and I’m going to put this in the Custom JavaScript (Pre) area. Basically, I’m targeting the post entry link. I’m telling that to open in FooBox. I’m going to save the changes here, refresh the front site.

Now, if I click on anyone of these blog posts, instead of going to the single post page, it’s going to open it in FooBox in an eye frame. If you are a photographer, if you have a photography site and most of your posts are basically just images or single images, you can use the featured image to display your visual and then use the actual inline post content to talk about what the image is about instead of using titles and captions et cetera.

You may or may not want to do this. We we’re just playing around when we saw this theme and thought it would be need to see if it worked. Again, like what the WordPress Gallery Post, here’s where it gets complicated. Not really but you can open a Lightbox within a Lightbox. There we go. We have FooBox within the FooBox Lightbox. This may or may not apply to how you want to display your content but just so you know, it is possible. Again, these two themes are called Boardwalk and Cubic. Super cool visual way to display your images or your posts. They are both free in the wordpress.org repository.


Comments are closed.