Aweber - Email Marketing Made Easy
How to Use Custom Fields in Your Thesis Theme

How to Use Custom Fields in Your Thesis Theme

August 25, 2010 · 26 comments

in Thesis

Thesis 1.x Notice: Thanks for reading this post! So, here's the deal. I wanted you to be aware that this post was written prior to the release of Thesis 2. So that means the instructions or other information provided applies specifically to Thesis 1.x and not the latest 2.x version. Thanks!

There are so many uses for custom fields in WordPress. You can read more about Custom fields just by doing a Google search, but just one of many examples, here’s what I recently had to use a custom field for. I had a client who wanted to add a PayPal buy now button to a specific place in certain posts. I wanted to make it easy to add the code without having to figure out where to place it in the post. So I created a custom field and the PayPal code is just pasted into the value field. Then I created the code in the custom functions to show the contents of the custom field. Again, this is just one example, but here’s how to get custom fields to work in Thesis:

Step 1: Add the Custom Field to a Post or Page

If you’re adding this for the first time, click the “Enter New” link. Decide on what you are going to name the custom field and type that into the “Name” field of the custom fields section. Then in the “Value” field, just type or paste in the value you want to assign to this custom field.

Custom Field in WordPress Thesis

Now save your changes and update and/or publish your post.

Step 2: Get the Custom Field

Just adding it here doesn’t actually show the custom field meta data anywhere. You need to now call that field and display the contents where you want in your site. Now, either use the Thesis Openhook plugin, or add a custom function to your custom-functions.php file, but this is the basic function:

<?php global $post; 
	if (get_post_meta($post->ID, 'your_custom_field_name', true)) { 
		echo get_post_meta($post->ID, 'your_custom_field_name', true); 
	}
?>

That’s it!

As a practical example, to create a custom function to add an image after your post using the URL specified in the custom field add this to the custom-functions.php file:

function my_custom_field_function() {
global $post;
   if (get_post_meta($post->ID, 'your_custom_field_name', true)) { ?>
      <img src="<?php echo get_post_meta($post->ID, 'your_custom_field_name', true); ?>" alt="your description" /></a>
<?php   }
}
add_action('thesis_hook_after_post', 'my_custom_field_function');

Enter your custom field names where shown, and give your function a meaningful name.

Was this post helpful? Consider subscribing to my blog via RSS or

This Site Runs on the Thesis WordPress Theme

Thesis Theme thumbnail

If you're someone who doesn't understand a lot of PHP, HTML, or CSS, Thesis will give you a ton of functionality without having to alter any code. For the advanced user, Thesis has incredible customization possibilities via extensive hooks and filters. And with so many design options, you can use the template over and over and never have it look like the same site.

If you're more familiar with how websites work, you can use the fantastic Thesis User's Guide and world-class support forums to make more professional customizations than you ever thought possible. The theme is not only highly customizable, but it allows me to build sites with a much more targeted focus on monetization than ever before. You can find out more about Thesis below:

{ 26 comments… read them below or add one }

David Alexander October 12, 2010 at 9:17 am

Thanks for this, but what if I wanted to do something like your practical example but have an if statement which said “if custom field is empty… use a fall back default image or banner?

:)

Cheers
David Alexander recently posted..Open Graph for Business

Reply

Thesis-Blogs.com October 12, 2010 at 10:31 am

Hi David,

You could try something like this:

function my_custom_field_function() {
global $post;
   if (get_post_meta($post->ID, 'your_custom_field_name', true)) { ?>
    <img src="<?php echo get_post_meta($post->ID, 'your_custom_field_name', true); ?>" alt="your description" /></a>
<?php   }
else { 
	 echo 'fallback image';
	}
}

add_action('thesis_hook_after_post', 'my_custom_field_function');

Also, here’s a post fore additional reading: http://epicalex.com/default-custom-fields/.

Reply

David October 12, 2010 at 12:24 pm

Thanks, I will give this a go :) much appreciated.
David recently posted..Open Graph for Business

Reply

Jamie October 13, 2010 at 12:34 pm

Hi David,

This is great info, and exactly what I was looking for. Thanks for posting it!

I’m having some trouble with it. I’m new to Thesis, and am trying to figure things out. I’d like to add a custom field called “pagetitle” to my pages. When filled in, the pagetitle would automatically be placed into the div class “titlebox” that I created.

I tried adding the function to my custom_functions file, but nothing is appearing on my page. Here’s what I used:

function my_custom_title_function() {
global $post;
   if (get_post_meta($post->ID, 'pagetitle', true)) { ?>
    ID, 'pagetitle', true); ?>
<?php   }
else {
	 echo 'fallback image';
	}
}
add_action('thesis_hook_content', 'my_custom_title_function');

Do you know what I'm doing wrong? I'm sure it's something stupid!

Thank you so much for this post, and your help.

Jamie

Reply

Thesis-Blogs.com October 13, 2010 at 12:49 pm

Hi Jamie. Well, for one thing, you have echo 'fallback image'; as part of your code there. That was just used as a placeholder for you to add the code for whatever you want to happen if it isn’t true. Anyway, based on what you’re asking here, I believe this should do it. I didn’t use the code which checks to see if the custom field has a value or not but this should do the trick anyway.

function my_custom_field_function() {
global $post;
   if (get_post_meta($post->ID, 'pagetitle', true)) { ?>
	<div class="titlebox">
	     <?php echo get_post_meta($post->ID, 'pagetitle', true); ?>
	</div><!--end titlebox-->
<?php   }
}

add_action('my_thesis_hook_here', 'my_custom_field_function');

Just be sure to add the necessary thesis hook depending on where you want this piece of code to be inserted.

Reply

Jamie October 13, 2010 at 1:12 pm

Thanks for your reply. Believe it or not, I actually had the majority of what you wrote above (minus your comment ), but I guess that something changed when I posted the data?? Strange! Sorry to make you do the extra work, when I already had that info. I’ve removed the echo re: images.

I’m having a hard time figuring out where to hook things in. Using ‘thesis_hook_content’, shouldn’t that hook my new div into the beginning of the page content? It’s not working. Thesis is turning out to be a difficult switch for me from standard WP themes, but I’ll get it eventually.

I appreciate your help.

Reply

Jamie October 13, 2010 at 1:21 pm

Got it — the hook I needed was ‘thesis_hook_post_box_top’.

Thanks again.

Reply

Thesis-Blogs.com October 13, 2010 at 3:13 pm

It may be a little challenging up front, but it’s definitely worth it in the long run to be running on Thesis. And yes, you did have an invalid hook there. You can always refer to the official Thesis Hook Reference List.

Reply

hosteo November 15, 2010 at 5:53 am

Thanks for this code!
But if we insert a conditional for example “if (is_page (’1326 ‘))”, not as “global $page;”?

Reply

Thesis-Blogs.com November 15, 2010 at 11:09 am

Thanks for commenting. What is your question? I’m afraid I’m not following you here as your question seems to be incomplete or not fully formed.

Reply

hosteo November 16, 2010 at 1:11 am

Yes, my question is: If we don’t want to put “global $ post,” and we want to use a particular page or post such as “if (is_page (‘x’))”, how is it done? Thanks!

Reply

Thesis-Blogs.com November 16, 2010 at 11:20 am

You need the global $post part. You’d probably need to add the conditional after this as part of the next ‘if’ statement.

Reply

Bill Scheider December 27, 2010 at 10:55 pm

Hello. Hope it’s not too late to get a question in here?
I have a custom field called ‘date’ and the value is in the form mm/dd/yy. I want it added after the headline of the Event and so modified your code (which I tried first unmodified without the date being rendered) like this:
ID, ‘date’, true)) { ?>
ID, ‘date’, true);?>

But I’m still not able to have a date appear anywhere on the post. Do you know where I might be going wrong? (Do I need to say I’m new to php :) ?)
TIA
Bill

Reply

Bill Scheider December 27, 2010 at 11:00 pm

Sorry, the I entered php and it screwed up in my comment, so let me try that again like this:

<?php
function display_event_meta() {
global $post;
	if (get_post_meta($post-&gt;ID, 'date', true)) { ?>
            <p>echo get_post_meta($post->ID, 'your_custom_field_name', true);</p>
<?php	}
}
add_action('thesis_hook_after_headline', 'display_event_meta'); 

I apologize if this is messy!
–b

Reply

Thesis-Blogs.com December 27, 2010 at 11:53 pm

Hi Bill, no worries. I should have provided instructions for escaping your HTML code so it doesn’t get all messed up when you post it.. I tried to reassemble it as best I could so this makes more sense for those who might read it. Anyway, here’s a solution for you.

function display_event_meta() {
global $post;
	if (get_post_meta($post->ID, 'date', true)) {
		echo '<span>' . get_post_meta($post->ID, 'date', true) . '</span>';
	}
}

add_action('thesis_hook_after_headline','display_event_meta');

You will just need to add a custom field called “date” and in the value put the date in the format you want. This is over simplified in that it’s just returning whatever text you’re inserting into the custom field. Depending on your requirements, you could have the code reformat the date automatically, or sort by the date, etc. etc. But this will at least get your date to show up where you want it. Also, I see from a previous comment you wanted to style this date, so I wrapped it in <span> tags. You can change that to Paragraph tags if you want. Thanks for commenting.

Reply

Bill Scheider December 28, 2010 at 1:03 am

Excellent! Thank you for your quick response. This worked perfectly for a beginning. When I first plugged in your code, it didn’t work. (I had already created the ‘date’ custom field and filled in the value field with the date). I then went back to the code and capitalized the custom field name, i.e, ‘Date’. That was the fix. I had forgotten I named the custom filed with an initial cap :-/

Thanks again for your help.
Bill

Reply

TK February 19, 2011 at 10:58 am

Hi i think you can help me here, I have Thesis but i have no Programming knowledge whatsoever

Im trying to get my custom field to display URL images the same way like the wordpressReviewTheme in this example http://wordpressreviewtheme.com/auction/
the “VIEW product” and ‘Visit Website’ Which I know are done using Custom fields.

ANYWAYS

I tried to do exactly like in this tutorial just to get the image to appear (using custom fields) but I keep getting the Syntax error, I will have to ask exactly what and where do i paste the code using Thesis Openhook

Appreciate it!

Reply

Thesis-Blogs.com February 19, 2011 at 7:21 pm

I’m not absolutely clear on which elements you’re referring to. If it’s the “Read Review” and “Visit Website” buttons, then using a custom field for that isn’t what I’d recommend. Since they seem to appear at the end of every post, you’d have to add these custom fields manually to each post. You should just use the ‘thesis_hook_after_post’ hook to attach your button code. You could try something like this:

function after_post_links() {
	if (is_home()) { ?>
	<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">Continue Reading</a>
	<a href="#">Some Other Link</a>
<?php } }

add_action('thesis_hook_after_post', 'after_post_links');

Add that to your custom-functions.php file. Of course, you’d have to style the buttons accordingly.

Reply

TK February 20, 2011 at 10:19 am

HI Again!

Managed to get it working But I would want to add 2 custom fields instead ( 2 saparate images)
how do i structure the code?

Thanks once again your a life saver!

Reply

Thesis-Blogs.com February 20, 2011 at 10:31 am

No problem. I recommend you use css for the images you’re looking to create here. If you do that, there is no need for custom fields, however you could use something like this if you really want the custom fields:

<a href="<?php global $post; echo get_post_meta($post->ID, 'url', true); ?>">
<img src="<?php echo get_post_meta($post->ID, 'image_url', true); ?>"></a>

You will need to create 2 custom fields. One called “url” which will be the destination URL and one called “image_url” which will be the actual URL of the image.

Reply

TK February 21, 2011 at 4:31 am

hey TK here again

what i want is 2 Fixed images at the bottom of every posts each clickable image will open a different page Using 2 custom fields for example URL1 and URL2

Below is the code I use on my Custom_functions.PHP file

function my_custom_field_function() {
global $post;
   if (get_post_meta($post->ID, 'your_custom_field_name', true)) { ?>
      <a rel="attachment wp-att-19" href="ID, 'your_custom_field_name', true); ?>" target="_blank">
<?php   }
}
add_action('thesis_hook_after_post', 'my_custom_field_function');

I tried this code and it works perfectly! problem is I can only set one image and one custom field with the code above, I'd rly appreciate it if you could rewrite the PHP code to include 2 Custom field . Whatever i try experimenting always gives me the Syntaxx error crap..

In a nutshell, I want to have "your_custom_field_name" and "your_custom_field_name2"

Once again thank you so so much for your speedy replies buddy!

Reply

Thesis-Blogs.com February 21, 2011 at 4:06 pm

Look at the code from my previous comment. It should work if you just duplicate that line and change the names of the custom fields to ‘url_2′ and ‘image_url_2′. If your existing code is working for you, then duplicate the line with the custom field references, then update the custom field name so they’re different.

Reply

TK February 22, 2011 at 12:15 am

It worked , Thank you so much!

I’ll be bookmarking this site for future reference :)

Reply

Alex January 5, 2012 at 4:00 am

Hello! I created a unique Page (not Post) with a Custom Template and Custom Field whose value is the path to a PHP file – a Quiz, actually.

The problem is, when I go to the Page (not Post), all it does is display the path to the PHP file, when what I would expect is the page to actually display the output, i.e., the Quiz itself. This can be seen here: http://www.enxaqueca.com.br/blog/?page_id=12.

I adapted the code you provided above (thanks!!!) in my custom functions file, where the custom_field_function name is “quizsono” and the custom_field_name, “question_file”:

function quizsono() {	
global $post;	   
if (get_post_meta($post->ID, 'question_file', true)) { ?>	     
<?php echo get_post_meta($post->ID, 'question_file', true); 
?>	
<?php  } }	

add_action('thesis_hook_before_post', 'quizsono');

Could you please help me out?

Alex

Reply

Thesis-Blogs.com January 5, 2012 at 7:35 am

It looks to me that all this function will do is display whatever you have in that custom field, which it seems is what it’s doing. This isn’t really the right way to display a page in WordPress.

You would have to code this quiz page inside of the custom functions file, and then perhaps create a shortcode from it which you will add to a page in WordPress. I’d need to see this PHP quiz you created to say for sure, but I’d say the best way is what I described above.

Reply

Jason Davis October 8, 2012 at 8:24 am

Hi, working on findlawyers.co and I tried the code snippet but nothing appeared.

Also I’ve got a list of items that I need to add.

Location:
Street:
Map:
Etc….

How would I incorporate a list of items and insert them inside the posts, all posts that have the custom fields that is?

Thank you for your help.

Reply

Leave a Comment

When commenting, you can use basic HTML tags. If you are pasting in any code, please escape it here and then include that code within <pre></pre> tags. Thanks!

CommentLuv badge

Previous post:

Next post: