Supercharge WordPress with LoopBuddy + Custom Post Types

This is my first shot at a video tutorial. I’m brand new using ScreenFlow and the mic is just the one on my MacBook Pro. Hopefully, I’ll get better over time. Also, if you benefited from the video and do not own LoopBuddy or a WPMU membership, please use my affiliate links below if you plan to purchase. Thanks!

Resources used in the video:

Very Important Note:

When you create your Custom Post Type, be sure that you do not name the slug of your CPT the same as the slug of the page that it will be displayed on with LoopBuddy. If you do, all manner of badness will occur, including a potential breach of the space-time continuum. So, don’t cross the streams, Venkman.

Here is the CSS that was pasted:

[sourcecode language=”css”]
/*Book Grid */

.books-grid {
width: 125px;
height: 250px;
float: left !important;
display: inline !important;
padding-right: 15px;
text-align: center;

.hentry {
border-bottom: 0px !important;
margin-bottom: 0em !important;

.books-grid-image {
margin-left: 5px;
.books-grid-title {
line-height: 1;
font-size: .8em;
font-style: normal;
width: 125px;

/*Books Detail Page*/
.books-detail-title {
color: #A87F10;
font-size: 1.25em;
font-weight: bold;
line-height: 1.3em;
text-align: left;
.books-detail-author {
padding: 15px 0px;
.books-detail-image img {
margin: 0px 10px 15px 0px !important;
float: left;
.books-detail-return {
text-align: center;
background-color: #DAD8D9;
padding: 5px;
display: block;
margin: 75px auto;
width: 50%;
border: 1px #888 solid;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;

Grid Items Not Gridding?

If your posts are not displaying in a grid, try putting the float on the .hentry rather than the .books-grid. I’ll betcha that will work.

Using Custom Post Type UI instead of CustomPress

Custom Post Type UI will not allow you to create custom fields by itself, which makes doing what this video describes impossible. However, a nifty little plugin called More Fields will allow you to add custom fields to Custom Post Types and gives you the kind of control over what they look like (single line text, textarea, etc) that CustomPress does. One day I’ll make a video demonstrating this process. But it’s pretty straight forward:

  1. Create your custom post type using Custom Post Type UI
  2. Add custom fields to your custom post type using More Fields
  3. Put the custom field key you created in step 2 in LoopBuddy’s custom fields item.

36 thoughts on “Supercharge WordPress with LoopBuddy + Custom Post Types”

  1. I was lucky enough to be one of the first to view this video production – Thanks Nathan.

    This is an excellent video! I had been wanting to get into learning how to do this easily and your video was perfect for providing explanation and visual confirmation when I needed it.

  2. Thank you so much!
    This video tutorial is excellent and have given me the exact information that I need for my next project – and explained in a very easy and understandable manner.
    Well done! 🙂

  3. Thank you for that tutorial, it was so helpful. I am new to LoopBuddy and needed exactly the details and the walkthrough you explained.

    You did an awesome job for a first tutorial. Keep up the good work.

  4. Hi Nathan,

    I’m using the free custom post type UI plugin. I’ve managed to complete every stage apart from I can’t understand where to find the Field IDs with this plugin to enable loopbuddy to work with the custom post type.

    I know you did say that it should work with any custom post type plugin but I’m tearing my hair out with this trying to find where the field IDs are hiding!

    Any help would be much appreciated and I might still just have some hair left :-}

    Many Thanks,


    • Hi Dave. I’ve found what’s needed to make this concept work using Custom Post Type UI and updated the post. Thanks for the question!

  5. Nathan

    I picked up your link from one of the ithemes tutorials this week that I attended.

    Kept it open overnight and watched it today. This is just the thing I am looking for to explore some amazon blogs that I intend building.

    A fantastic first video, I think you are pulling my leg when you say this is your first effort… Top marks

    Hope you get round to adding the 2nd video regarding the free custom post UI. It would top it off.

    Keep up the good work.


    • Thanks for the compliments, Kevin. I put this out there to help people, and knowing that it does is encouraging. When you get your project done, let me know. I’d love to have a look!

  6. Excellent demonstration! I’m impressed with your clear instructions and the whole flow of the tutorial. I’d used custom-post-types before loop buddy was around, and it was a LOT more work! Thanks for taking the time to put this together and for sharing it.

    • Thanks Ray! I’m glad it helped. LoopBuddy is amazing and the more you use it, the more applications for it you find.

  7. Great job, loved the video. Thank you for the information. I do have a questions, do you know who to use Easy Custom Content Types for WordPress from

    I love this plugin, I have used it in the past and it woks great, it also has more filed options. But i can not seem to get it to work with Loopbuddy. Do you have any suggestions?

    Thank you,


    • Hello Nathan,

      Very impressive tutorial! Now I know why Benjamin Bradley mention very often about you.
      I have started using Easy Content Types (Code Canyon) with Loopbuddy.

      Just to show you two jobs:
      This is the custom post type made to display a small selection of books, note also the Cart66 integration:

      And this is another cpt I am working right now:

      To answer to Will:
      Easy Content Types works fantastically well with LoopBuddy.
      When you create a Meta Box and assign to it a field like text, or any other from the avalaibale ones you can then call them using the layout editor in LB dragging a custom field in the editing area and assigning to it the meta_key. Eg. If your field is “Name” the mata field name in ECT will be ecpt_name.

      Just play a bit with ECT + LoopBuddy and you’ll see that is not that difficult and best of all….ZERO CODING.
      The only manual coding is the CSS part to style the layout the way you (or your client) like.
      Thanks a lot Nathan, look forward to meet you again at the next Benjamin webinar compatible with the U.K. time zone…:-)

      All the best


      • Very nice work Robert! And great info for Will about ECT. Be sure to introduce yourself in the chat room if you see me.

  8. Nathan this is a fantastic tutorial. It has really helped me understand how to use Loopbuddy and ECT. The only thing that I can not get to work is the css where the grid is displayed. My items are showing up, but they are not aligning left, just all vertically. I am a complete newbie at css mind you. All I know is what I have played with and researched. My css for the grid is based on yours above. Could tell me what I am missing? Any help or direction would be greatly appreciated.

    here is a link

    /*Product Grid */

    .product-grid {
    width: 212px;
    height: 200px;
    float: left;
    display: inline !important;
    margin-left: 32px;
    margin-bottom: 14px;
    text-align: center;
    border-top: 1px #555 solid;
    border-left: 1px #555 solid;
    border-right: 1px #555 solid;
    border-bottom: 1px #555 solid;
    border-radius: 10px;
    box-shadow: 10px 10px 5px #888888;

    .hentry {
    border-bottom: 0px !important;
    margin-bottom: 0em !important;

    .product-grid-image {
    padding-left: 5px;
    padding-right: 5px;
    text-shadow: 2px 2px 2px #86848e;
    line-height: 1;
    font-size: 1.2em;
    font-style: normal;
    width: 195px;

  9. Hi Nathan,

    i have really struggled to get the divs to display inline..

    I must be missing something or new versions of theme and WP have weaved their web to confuse me.

    I have tried everything to get the divs to display inline but no matter what i have tried they are refusing to display as required.


    the tutorial you delivered was great though, thanks a tonne.


  10. As I mentioned in an email, this was an absolutely terrific tutorial, of the best I’ve seen. Thanks Nathan!!

    I reproduced your steps using CustomPress and LoopBuddy but I’m using Headway. Everything worked except for the grid layout. ( I just get a vertical list of books).

    I am new at CSS, but did experiment a lot with the float: left; statements.

    Do you have any idea how difficult it is to make this work with Headway? Headway is integrated with Loopbuddy, and I did tell Headway single page layout to use the correct Loopbody query and layout. But when looking at the HTML in firebug, there were a lot of interleaved divs between the various “book” classes ( books-grid etc.)

      • Thanks Nathan. I did buy a domain at HostGator (CraigWHarris), but have not uploaded my local practice site to it yet. I’ll try some more experiments, and upload to live this coming week so I can have more meaningful discussions.
        Thanks again for the response and suggestion!

  11. Hi Nathan

    Thanks for the excellent video.. Totally helped and much appreciated!

    Wondering if you had a thought/idea for this… any way to have hard returns/breaks in a multiline custom field box.

    i.e. recipe site.. 5, 10, 15 ingredients – that the user would paste in with bullets.. but have each on its own line.

    The alternative would be to have X amount of custom fields.. but ya never know how many you might need.

    Make sense?

    Any thoughts?


  12. Hello Nathan

    thanks so much for this tutorial. I have set everything up with Custome Types UI, Headway, and Loopbuddy. I don’t know what I am doing wrong but the Grid is showing up in the Headway Editor but when I go see the page, nothing from my posts are showing up…. Do you have any idea what I might be doing wrong?

    Thanks so much

  13. Hi Nathan
    First of all, this is a great video. Thank you.
    I’m struggling with with an issue, and hope someone can help me out.
    I created a custom field in my custom post type called “documents”, and that field is a upload field type.

    I then attach pdf documents to the posts when adding new posts in that new custom posttypes.

    But how can I download them from the front end?

    I have tried adding the custom field in the layout editor in loopbody, but all it renders is the download id (or at least a number)

    How can I make the layout in LoopBody so I get the attached file when i click on a button for instante?

    Hope you can help.

    Thanks again.

    • Lars, thanks for viewing the video and commenting. If you’re still having trouble, I’m happy to help you on an hourly consulting basis. Just let me know.


Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.