Custom Fields/Values displaying out of order - wordpress

I'm using the Types Wordpress plugin to enable custom fields. The plugin allows you to rearrange the order of the images in the admin page editor. Here's my code in my single.php to display multiple images in the custom field and have a link to itself to also use Fancybox:
<?php
$mykey_values_img = get_post_custom_values('wpcf-image');
if ($mykey_values_img != null) {
foreach ( $mykey_values_img as $key => $value ) {
?>
<img src="<?php echo $value; ?>" />
<?php
} //foreach
} //if
?>
Problem:
Right now this code works perfectly on my local copy running on MAMP. However, when I put it online hosted on iPage, the images are out of order. I don't know what's causing this discrepancy. When I use the shortcode from Types to display the images instead of the php above they are in order, but I don't have the option of using Fancybox. I was also wondering if there is a better way to display an image from Wordpress that will insert the alt tag for the image.

I just encountered this problem too, and your first answer led me to a tighter solution.
I also used types_render_field(), but if you include a 'raw' parameter, you can avoid the string manipulation.
$images_raw = types_render_field('image', array('raw'=>'true','separator'=>';'));
$images = explode(';', $images_raw);
foreach ($images as $link) {
echo '' . $link . '">"';
}
Then, if you're nasty, you can get the ID of the attachment from its SRC. Using that ID, you can get all the info you need about that attachment, like a caption, or whatnot.

I figured out a work around to get it working. Its not ideal but it works.
The Types plugin came with its own php function to display the custom field called types_render_field. It displayed my images in order. To get fancybox working I had to do sort of a hack on the string. Here's the code:
$images = ( types_render_field( "image", array( 'size' => 'full', 'alt' => get_the_title(), 'title' => get_the_title() ) ) );
$imgArray = explode(">", $images);
foreach ( $imgArray as $value ) {
$pos1 = strpos($value, 'src="', 0)+5;
$pos2 = strpos($value, '" ', $pos1);
$link = substr($value, $pos1, $pos2 - $pos1);
echo ''.$value.">";
}

Related

Wordpress get_posts() shows only partially correct data of custom post inside user profile

I have a wordpress-based website where I'm trying to move some custom functionality that used to be just plain mysql table and some code to insert/update/show stuff from it. I'm trying to merge it in WP as custom posts so I can use filters, tags, pagination and such.
It supposed to show a few custom items inside the user profile (Ultimate Member). Like, user info, then 10 of user's top items of this kind, then on next tab 10 items of some other kind, etc.
But seems like things aren't as simple in WP, and you can't just toss things on top of each other and expect it to not overlap. >_> So when I'm trying to add a block with custom post type data, it returns only some of the data mixed with profile data mixed with nothingness.
Yeah, I get it, there's probably a profile loop and some data already inside variables, as far as I could understand from manuals. What I can't understand is how to fix it. Here's how it looks:
$args = array(
'author' => $uid,
'numberposts' => 10,
'post_type' => 'ff',
);
$ff = get_posts($args);
if($ff){
foreach($ff as $f){
setup_postdata($f);
the_content(); //shows what's needed, as well as ID, the_time() and some more
the_title(); //shows author's name instead of post title
the_tags(); //shows nothing, as well as excerpt, etc
get_the_excerpt(); //still nothing
$f->post_excerpt; //but this shows the excerpt, as well as print_r($f)
}
wp_reset_postdata();
}
Maybe someone could give a hint what am I missing? Thanks in advance!
Try using the post ID to get your data and echo it. A little more code but may work better.
// Set the global post up here
global $post;
$args = array(
'author' => $uid,
'numberposts' => 10,
'post_type' => 'ff',
);
$ff = get_posts($args);
if($ff){
foreach($ff as $f){
setup_postdata($f);
$id = $f->ID; // get post ID
$content = get_the_content($id); // get the content to echo later
$tags = get_the_tags($id); // use to get tags, these are not part of the get_posts return object
echo $content; // show the content
echo $f->post_title; // show the returned post title. can use get_the_title($id) and echo it if this does not work
// Display the tags after getting them above
foreach ($tags as $tag) {
echo $tag->name . ', ';
}
// You can get the excerpt this way too but you said your other worked okay
$excerpt = get_the_excerpt($id);
echo $excerpt;
}
wp_reset_postdata();
}
(Original) To elaborate. This sets up the global post object. Which is generally a requirement for your functions to work in the loop. Not always the case as I've found over the years, but a good practice if you're not using the post ID in the loop to get your data.

Advanced custom field (wordpress plugin of same name) not showing

I've set up some fields using the advanced custom fields.
I’ve created a custom field and a post that uses that custom field. I’m trying to display it on a page like this:
<?php
$args = array( 'post_type' => 'Portfolio Item' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
echo '<p>' . the_title() . '</p>';
echo '' . the_field('portfolio_url') . '';
endwhile;
?>
The title displays no problem, but the custom field does not i.e. the output is just:
The name ‘portfolio_url’ is the ‘Field Name’.
Can anyone help with what I’m doing wrong?
Maybe you should try and send in smaller snippets of code.
Or give an online example.
Basically if you add a the_field('bottom_quote') function on your page it should echo out the current pages' "bottom_quote" field.
If you're not in a WP loop you have to explicitly point to the post you want to get the field from of using an ID:
<?php the_field( 'bottom_quote', $post->ID );
Also note that $post should either be global or in a foreach loop.
I don't think the post_type parameter is allowed to have a space. Check that you're using the correct slug for that first.
I am not to familiar with this specific plugin but you may need to call in the global $variable that I know when using a class like WPAlchemy you need to call $meta
Check here http://codex.wordpress.org/Function_Reference/get_post_meta

Only show images/attachments within the gallery?

When i create a page, add a gallery, and browse this gallery on the front-end it will browse all the attachments that are associated with that page, instead of just the images within that gallery. Is there a way to filter all the other attachments and only show the images within a certain gallery? So that, for instance, when I delete the gallery and add a new gallery on the same page > only the new gallery is shown?
Any ideas?
This might not be the most elegant way, but i've found it very usefull.
Passing a post ID to the function below will load a gallery from the post_content of that post. So you would create a gallery and insert it into your post content, then in the template you run this function and will be returned with an array of attachments in that gallery which you are free to to whatever with, i.e slideshows and the likes.
function wp_load_gallery($post_id) {
$post = get_post( $post_id );
$regx = '/' . get_shortcode_regex() . '/';
preg_match( $regx, $post->post_content, $matches );
$ids = shortcode_parse_atts( $matches[3] );
$gallery = array( );
foreach( explode( ',', $ids['ids'] ) as $id ) {
if($id) {
$gallery[] = get_post( $id );
}
}
return $gallery;
}
Note that the shortcode is not cut from the content, so when you display the content you should run it through the strip_shortcodes function, i.e:
echo strip_shortcodes( get_the_content() );
This allows you to update the gallery whenever you want with whatever you want.
EDIT:
To simply display all images:
$gallery = wp_load_gallery($YOUR_POST_ID);
foreach($gallery as $image) {
echo wp_get_attachment_image($image->ID);
}

Wordpress : excluding images 'inserted into post' from get_children

I have a page which has a slideshow at the top, and images inserted inline into the content area.
I need to exclude the images that have been inserted into the post from the slideshow.
Currently I am excluding the 'Featured Image', but this limits me to one image that can be inserted into the post.
Here is my existing code:
$thumbnail = get_post_thumbnail_id();
$images = get_children( 'post_type=attachment&post_mime_type=image&order=asc&orderby=menu_order&post_parent='.$post->ID .'&exclude='.$thumbnail);
Previously I have used the description field of the image meta data to exclude images by entering 'exclude'. This isn't as nice for the end user as I'd like it to be.
Any suggestions, plugins or code based!
Update:
I've updated the code, so now I get any image URLs from the post_content and check them against the slideshow images.
$content = $post->post_content;
$inlineImages = array();
preg_match( '/src="([^"]*)"/i', $content, $inlineImages ) ;
$thumbnail = get_post_thumbnail_id($post->ID);
$images = get_children( 'post_type=attachment&post_mime_type=image&order=asc&orderby=menu_order&post_parent='.$post->ID .'&exclude='.$thumbnail);
if ($images) {
echo '<div id="slideshow">';
foreach ( $images as $attachment_id => $attachment ) {
$image = wp_get_attachment_image_src( $attachment_id,array(900,265));
if (!in_array($image[0],$inlineImages)) {
echo '<img src="'.$image[0].'" width="'. $image[1] .'" height="'. $image[2].'">';
}
}
echo '</div>';
}
This is an OK solution, although the regex could be improved.
A nicer step would be to add the array of images to a custom field field, which
is updated on post / page update or publish.
Any suggestions on how to go about this?
Just needed to do the same thing. Your original approach is the way I wanted to do it -- simply exclude any images that had been inserted into the post from appearing in the slider. But I didn't want the client to have to do anything special to make it happen. Here's my code.
$args = array( 'post_type' => 'attachment', 'post_mime_type'=>'image','numberposts' => -1, 'post_status' => null, 'post_parent' => $post->ID );
$attachments = get_posts($args);
preg_match_all("/<img[^']*?src=\"([^']*?)\"[^']*?>/", $post->post_content, $matches, PREG_PATTERN_ORDER);
/* $matches[1] holds the urls as an array */
foreach ( $attachments as $attachment ) {
if(in_array($attachment->guid, $matches[1])){ continue;}
wp_get_attachment_image( $attachment->ID , 'slider_size');
}
First bit gets all of the images associated with the post. The $preg_match_all gets all of the images in the post body. Then as we loop through the images to display them in the slider the in_array checks the urls of the images that were inserted with the url of the image about to be added to the slider and skips on to the next one if there is a match.
Thanks for you post, got me thinking in the right direction.
I've updated the code, so now I get any image URLs from the post_content and check them against the slideshow images.
$content = $post->post_content;
$inlineImages = array();
preg_match( '/src="([^"]*)"/i', $content, $inlineImages ) ;
$thumbnail = get_post_thumbnail_id($post->ID);
$images = get_children( 'post_type=attachment&post_mime_type=image&order=asc&orderby=menu_order&post_parent='.$post->ID .'&exclude='.$thumbnail);
if ($images) {
echo '<div id="slideshow">';
foreach ( $images as $attachment_id => $attachment ) {
$image = wp_get_attachment_image_src( $attachment_id,array(900,265));
if (!in_array($image[0],$inlineImages)) {
echo '<img src="'.$image[0].'" width="'. $image[1] .'" height="'. $image[2].'">';
}
}
echo '</div>';
}
I think the easiest thing to do would be using the Meteor Slideshow plugin to create a slideshow for each page, then insert the shortcode for the proper slideshow in the content area of the proper page. Yes, it means you'll have to edit each page "outside" the page editor, but it also gives you easy, complete control over which photos do and do not appear in each slideshow, and the shortcode is very easy to put in with the page editor.
The Media Custom Fields plugin lets you add custom data to media items exactly as you would with custom post fields, providing a user-friendly way of flagging slideshow-only images. From the plugin FAQ:
In addition to giving you the option to add custom fields, your custom fields will show up in all appropriate places. If you go to the media section to manage your media like you usually do, they will show up on the edit media form. The custom fields also show up when you are uploading an image to a post, and in all other expected locations.
One approach is to install this plugin and add a custom field such as Slide with value TRUE to your slide images via the Dashboard -> Media menu. Then your filter code might be:
$thumbnail = get_post_thumbnail_id();
$images = get_children( /* removed for brevity */ );
if ($images) {
// ..
foreach ( $images as $attachment_id => $attachment ) {
// skip images not marked for slideshow
if ( !get_post_meta($attachment_id, 'Slide') ) continue;
// otherwise do slideshow things
}
// ..
}
Note that with this approach the value for Slide can be set to anything except the empty string. You may want to define Slide as a class constant somewhere to avoid hard-coding.
Advantages
Doesn't require any work on the poster's part
Future-proof: the plugin appears to be based on good-old post functionality, and attachments are just one kind of post anyway, so there's nothing weird.
Here is another approach to this.
I would not prefer using urls, because the picture inserted inside the content area could be of different size like medium, thumbnail or full. So, the url only would not match.
Using the above code,
function printMeImages() {
$content = $post->post_content;
$inlineImages = array();
// populate ids of images from wp-image-id
preg_match_all( '/wp-image-([^"]*)"/i', $content, $inlineImages ) ;
$thumbnail = get_post_thumbnail_id($post->ID);
$images = get_children( 'post_type=attachment&post_mime_type=image&order=asc&orderby=menu_order&post_parent='.$post->ID .'&exclude='.$thumbnail);
$out = "";
if ($images) {
$out .= '<ul id="slideshow">';
foreach ( $images as $attachment_id => $attachment ) {
$image = wp_get_attachment_image_src( $attachment_id,'desiredImageSize');
// $inlineImages[1] has ids to be discarded
if (!in_array($attachment_id,$inlineImages[1])) {
$out .= '<li><img src="'.$image[0].'" width="'. $image[1] .'" height="'. $image[2].'"></li>';
}
}
$out .= '</ul>';
}
return $out;
}
The images which are not set as featured and not used inside the post are retrieved.
For performance reasons I would not execute the code while the page is being rendered, but rather bind the code to the save_post hook. When the post content is edited and saved, the hook will be called and all attached images (or their ids) which are not used in the content are saved into a postmeta table. When the slider is rendered the image ids can be accessed via get_post_meta($post_id, 'image_ids_for_slider').
Like this I can avoid to do the preg_match_all operation on page rendering. This might not be a performance reason when the post content is small and when there's only one slider loaded, but generally I find this a approach a little cleaner for scaling reasons.
//hook this function to save post action
function save_ids_of_image_attachments_not_used_in_the_content( $post_id, $post ) {
$args = array( 'post_type' => 'attachment',
'post_mime_type'=>'image',
'numberposts' => -1,
'post_status' => null,
'post_parent' => $post_id
);
$attachments = get_posts($args);
preg_match_all("/<img[^']*?src=\"([^']*?)\"[^']*?>/", $post->post_content, $matches, PREG_PATTERN_ORDER);
$ids_of_attached_images_not_in_content = array();
/* $matches[1] holds the urls as an array */
foreach ( $attachments as $attachment ) {
if(in_array($attachment->guid, $matches[1])){
continue;
}
$ids_of_attached_images_not_in_content[] = $attachment->ID;
}
// save the image_ids as postmeta
update_post_meta($post_id, 'image_ids_for_slider', $ids_of_attached_images_not_in_content);
}
add_action( 'save_post', 'save_ids_of_image_attachments_not_used_in_the_content', 10, 2 );
I haven't fully understood your problem, but how about excluding the div ID within which the slideshow is present?
$thumbnail = get_post_thumbnail_id();
$images = get_children('post_type=attachment&post_mime_type=image&order=asc&orderby=menu_order&post_parent='.$post->ID .'&exclude='.$thumbnail. '&NAME');
Replace 'NAME' after thumbnail.' in the parenthesis.
Hope this helps.

Need help calling up Custom Fields/Values in Wordpress theme

here's the correct code: (Thanks!) (Just had to add '. .' and the value in between when echo)
Uploaded by YouTube user: <?php
$custom_fields = get_post_custom();
$my_custom_field = $custom_fields['ytuser'];
foreach ( $my_custom_field as $key => $value )
echo '' . $value . "<br /><br/>";
?>
If you still want to read the problem, here it is below.
Problem:
Currently, I have a custom field created called "ytuser" on one of my posts. Inside that field, I have typed in a youtube username (for example: youtubeuser1). What I am trying to do now is put that value at the end of a href like this: <a href="http://www.youtube.com/$value"/> so that it actually returns the following address: http://www.youtube.com/youtubeuser1 and the text then links to that user's page.
So far I have this:
Uploaded by YouTube user: <?php
$custom_fields = get_post_custom();
$my_custom_field = $custom_fields['ytuser'];
foreach ( $my_custom_field as $key => $value )
echo '' . $value . "<br /><br/>";
?>
But that only gives me a link to "http://www.youtube.com/"
I can't add $value directly to it...
Is there a way I can include the $value as part of the href? So that it can make the text link go to http://www.youtube.com/$value ?
I know this is a noob question since it can't be that hard.
I would just do $ytuser = get_post_custom_values("ytuser"); and then call the variable $ytuser[0]; where you need it like echo "<a href='http://www.youtube.com/".$ytuser[0]."'>".$ytuser[0]."</a>";. That should work!
Also, in your code example, you want to switch the " and ' usage in your echo and make sure you echo the user after the YouTube URL and as the link itself (if that's what you want).

Resources