Help With Single Page Template and Advanced Custom Fields

[Tully]

I know enough php to know that I don't know much and I'm embarrassed to not be able to figure this out. But, I'm running short on time and could use some help.

I've created a CPT named "Artists", and set up two Advanced Custom Fields, Images and Audio. I am having a issue sorting out how to get everything to display as I'd like on a Single Artist page.

I'd like the page to be full width and display the artists name on the top left. I'd like the page split into 2 columns, on the left would be the image(s) with the audio below. On the right hand side would be the artist info/bio which would be entered in the content editor.

I realize I could pretty easily do this with column classes in the editor, but as the client adds more to the site, I don't want him to have to fool around with that. I'm looking to make it as straightforward on their end as possible.

All I've found so far are tutorials on creating custom templates for archives, which have been somewhat helpful for me, but haven't found one that addresses making a loop with the ACFs for the single post type.

If anyone has some tutorials they know about that deals with this specifically please share, or better yet, if someone has some code like this they've used and would share that would be tremendous.

Thanks so much.

[David Chu]

Hi,
Strictly speaking this isn't a Genesis question, but more of a WordPress one. But I have used ACF in the past, although these days I prefer either Custom Field Template or Pods for custom fields. It should work just like any custom field display. Here's a basic line of PHP code that you could pop into your template's loop and display the value of your field;

echo get_post_meta( get_the_ID(), 'Artists', true);

You could also check here for more Custom Field info.

Cheers, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Tully]

Hi David, thanks for the reply and info.

I realize the loop is more of a WP thing, but I posted here looking for help as I am making this in Genesis, and they have their own set of hooks and filters which will come into play here.

I am not having an issue so much with how to call in the fields, but more the entirety of the template, or more specifically a custom loop.

I can/have added the hooks to force full-width, remove post meta info, etc. and adding a custom loop. But, everything within the custom loop is currently beyond me.

That's basically what I am looking for help with, how to write a custom loop that would split the fields into two columns within the content area. Pretty much everything with in that loop.

Any and all help is greatly appreciated.

[David Chu]

In that case, I'll refer you to a tutorial that has some good detail on a similar process.

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Tully]

Thank you for pointing out the tutorial, it's very well written and will defintely refer to that for the archive page. I'm pasting in my attempt at coding the loop how I'd like to appear, and it will of course be way off. Again , I'm trying to get the advanced custom fields to show up on the left half and the content on the right. I know I need more to make it a loop, but I am not sure how to do that on a single post. This is for the single-artists.php page and not the archive. Is there a loop in a single post?

Any advice would be invaluable.

remove_action ('genesis_loop', 'genesis_do_loop'); // Remove the standard loop
add_action( 'genesis_loop', 'artists_do_loop' ); // Add custom loop

function artists_do_loop() {

<div id="content-sidebar-wrap">
	<div id="content" class="hfeed">
		<div class="page hentry entry">
		<h1 class="entry-title">.get_the_title();</h1>
			<div class="entry-content">
				<div class="one-half first">
					the_field('volume_artist_images');
					the_field('volume_artist_audio');
					the_field('artist_audio');
				</div> //one-half first
				<div class="one-half">
				<p>.get_the_content();</p>
				</div> //one-half
			</div>//entry
		</div>//hentry
	</div>//content
</div>//contside

}

[pathetix]

I actually would like to know about this as well.
Been trying to find out how to write a single-posttype.php page for a few hours.
There doesn't seem to be a single documentation for a custom single page anywhere.
(Or am I just searching for the wrong thing?)

[lucaslem]

I also would love a step by step on this. Been searching too... pretty rough.

[nunotmp]

We can do this using only hook....A lot of hooks. 🙂

	// First lets remove all of the post elements so we can inject our own
	remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 );
	remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 );
	remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
	remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );
	remove_action( 'genesis_entry_content', 'genesis_do_post_content' );
	remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_open', 5 );
	remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_close', 15 );
	remove_action( 'genesis_entry_footer', 'genesis_post_meta' );

	// We will define a function to add two columns into the post this will add everything in the <article> tags
	add_action( 'genesis_entry_content', 'wpz_column_artist' );

	// We can start adding all the necessary loop parts into our new custom hooks

	// Left column content here
	add_action( 'wpz_left_column', 'genesis_do_post_title' );
	add_action( 'wpz_left_column', 'genesis_do_post_content' );

	// Right column content here
	add_action( 'wpz_right_column', 'genesis_do_post_image' );
	// ADD code to display ACP

/*	Action Functions
----------------------------------------------- */

function wpz_column_artist() {
	
	echo '<div class="one-half first">';
	// Lets create a left column hook 
		do_action('wpz_left_column');
	echo '</div>'; //END .one-half first

	echo '<div class="one-half">';
	// Lets create a right column hook 
		do_action('wpz_right_column');
	echo '</div>'; //END .one-half first

}

You may need to add a few more function to output the data you want. Just use the custom hooks to display left or right side.

---

Genesis Child Themes – Follow Me

[lucaslem]

@David Chu, I followed that article closely and while it worked ok for everything else, the line with get_the_content() would not output any content. Seems from the comments to the post that I was not the only one with that problem.

@nunotmp Wow, thanks for taking the time to lay this out.

I really wish there was a more complete level of documentation for Genesis. It's definitely a no-brainer to use their very-well documented hooks and filters if one wants to gently customize their themes, but creating your own child theme with custom layouts etc from the basic framework is really tough when you're used to the more standard wordpress theme templates which show all the html scaffolding and so on.

[Author]

Posts